1. 安装依赖

npm install stompjs

2. 在vue中使用

2.1 在main.js中定义websocket连接地址:
    Vue.prototype.$globalWebsocketUrl= ws://localhost:8080/wisdom-classrome/webSocketServer
2.2 在<script>标签中:
    import Stomp from 'stompjs'
2.3 method中方法如下:
// ***************** webSocket *****************
onConnected (globalWebsocketUrl, frame) {
  let _that = this
  _that.stompClient = Stomp.client(globalWebsocketUrl, this.responseCallback(), this.onFailed())
  console.log('连接已建立--------------')
  // 向服务器发起websocket连接
  _that.stompClient.connect({}, (frame) => {
    _that.stompClient.subscribe('/user/' + student.id + '/handsUp', (msg) => { 
    console.log('msg-----------', msg)   
    }) 
  }, (err) => {
    console.log(err)
  })
  // 断开连接
  _that.disconnect = () => {
    if (_that.stompClient != null) {
      _that.stompClient.disconnect()
    }
  }
},
onFailed (frame) {
  console.log('Failed: ' + frame)
},
responseCallback (frame) {
  console.log('responseCallback msg=>' + frame)
},
// 关闭连接
closeWebSocket () {
  this.disconnect()
}

 

Logo

前往低代码交流专区

更多推荐