Vue中使用websocket（即时通讯）

websocket是一个双向通行工具，解决了原来的http单向通信的弊端，可以让服务器主动向客户端推送数据

// 安装客户端的socket

npm i socket.io-client --save

/*

    安装Vue配置socket的工具

    注意：需要安装3.0.7版本的包，最新的包会有问题
*/

npm i [email protected] --save

// 在main.js中引入设置

import VueSocketIO from 'vue-socket.io'

import SocketIO from 'socket.io-client'

Vue.use(new VueSocketIO({

   // 生产环境需要切换成false
  debug: true,

  // 连接的后端地址  
  connection: SocketIO('http://localhost:3000?token=ab'),

  // 需要使用vuex的话，需要配置一下  
  vuex: {
    store,
    // mutation中定义方法的前缀
    mutationPrefix: 'SOCKET_',
    // actions中定义方法的前缀
    actionPrefix: 'SOCKET_'
  }
}))

组件中使用