websocket控制vue路由跳转

先下载websocket包

npm install ws

在App.vue中初始化

<template>
  <div id="app">
    <router-view />
  </div>
</template>

<script>
import "@/assets/iconfont/iconfont.css";
import { getToken } from '@/utils/auth'
export default {
  name: 'App',
  data() {
    return {
      websocket: null,
      toUrl: ''
    }
  },
  mounted() {
    // console.log('ppp',getToken)
    this.initWebSocket()
  },
  destroyed() {
    this.websocket.close()
  },
  methods:{
    initWebSocket(){ // 初始化
      try {
        if(this.websocket && this.websocket.readyState === 1){
          this.websocket.close()
        }
        const wsuri = `ws://192.168.3.24:8080/ws/toggle`
        this.websocket = new WebSocket(wsuri)
        this.websocket.onmessage = this.websocketonmessage
        this.websocket.onopen = this.websocketonopen
        this.websocket.onerror = this.websocketonerror
        this.websocket.onclose = this.websocketonclose
      } catch (err){
        console.log('错误',err)
      }
    },
    websocketonopen(){
      console.log('建立连接')
    },
    websocketonerror(){
      // this.initWebSocket()
      console.log('连接失败')
    },
    websocketonmessage(e){//数据接收
      // console.log('数据',e.data)
      this.$router.push(e.data)
    },
    websocketonclose(e){
      console.log('断开连接',e)
    }
  }
}
</script>

websocket发送的信息进行路由跳转