zoukankan      html  css  js  c++  java
  • Vue Stomp+SocketJS 数据报错[Object object]

    开头一句mmp

    tmd换位置了也没个提示!!!!

    坑死爹了

    <template>
      <div>
        <input type="text" v-model="text">
        <button @click="sendMessage">发送消息</button>
        <br>
        <br>
        <div>{{data}}</div>
      </div>
    </template>
    <script>
    import SockJS from 'sockjs-client'
    import Stomp from 'webstomp-client'
    export default {
      name: 'ChatRoom',
      data () {
        return {
          text: '',
          data: '',
          stompClient: null
        }
      },
      mounted () {
        if ('WebSocket' in window) {
          this.initWebSocket()
        } else {
          alert('当前浏览器 Not support websocket')
        }
      },
      methods: {
        sendMessage () {
          this.stompClient.send('/app/hello', JSON.stringify(this.text), {})
        },
        initWebSocket () {
          this.connection()
        },
        connection () {
          const socket = new SockJS(this.$baseUrl + '/chat')
          this.stompClient = Stomp.over(socket)
          this.stompClient.connect({}, (frame) => {
            this.stompClient.subscribe('/topic/greetings', (greeting) => {
              console.log(JSON.parse(greeting.body))
            })
          })
        }
      }
    }
    </script>
    
    <style scoped>
    
    </style>

    重点是{}参数放最后面!!!!!

    哎我擦

     接口代码:

    package org.just.computer.mathproject.Controller.WebSocket;
    
    import org.just.computer.mathproject.Bean.Message;
    import org.springframework.messaging.handler.annotation.MessageMapping;
    import org.springframework.messaging.handler.annotation.SendTo;
    import org.springframework.stereotype.Controller;
    
    import java.security.Principal;
    
    @Controller
    public class GreetingController {
        @MessageMapping("/hello")
        @SendTo("/topic/greetings")
        public Message greeting(String content, Principal pl) throws Exception{
            Message message = new Message();
            message.setContent(content);
            message.setName(pl.getName());
            return message;
        }
    }
  • 相关阅读:
    ASP.NET Core开发者路线指南(转)
    一文读懂QPS、TPS、PV、UV、GMV、IP、RPS(转)
    后端开发术语大全转
    css 动态设置某一元素随浏览器大小而调整
    .NET FTP上传文件
    bootstrapselectpicker 插件事件
    Node.js安装及环境配置之Windows篇
    EasyUI表单验证插件扩展
    程序员需要知道的缩写和专业名词转
    JavaScript指定日期格式化
  • 原文地址:https://www.cnblogs.com/godoforange/p/11441120.html
Copyright © 2011-2022 走看看