简单实现socket.io后端主动给前端发请求

下面的使用到的技术栈是vue+node（express）

后端

npm install socketio express express-static
// or
yarn add socketio express express-static

const express = require('express');
const http = require('http');
const socketIo = require('socket.io');

const app = express();
const server = http.Server(app);
const soc = socketIo(server);
server.listen(9000);

const socOne = soc.of('/one');
const socTow = soc.of('/tow');
//监听connection（用户连接）事件，socket为用户连接的实例
socOne.on('connection', (socket) => {
  console.log("连接");
  socket.on('disconnect', () => {
    //监听用户断开事件
    console.log("断开连接");
  });
  //监听msg事件
  socket.on('msg', (data) => {
  	//打印用户端发送的信息
    console.log(data);
    //1秒后向socket用户发送信息
     setTimeout(() => {
       socket.emit('msg', `你好浏览器`);
     }, 1000);
  })
})
// 监听向tow发送的信息
socTow.on('connection', (socket) => {
  console.log("连接");
  socket.on('disconnect', () => {
    //监听用户断开事件
    console.log("断开连接");
  });
  //监听msg事件
  socket.on('msg', (data) => {
  	//打印用户端发送的信息
    console.log(data);
    //1秒后向socket用户发送信息
     setTimeout(() => {
       socket.emit('msg', `你好浏览器`);
     }, 1000);
  })
})

如果需要主动向所有用户发送信息，socket也给我们提供了方法

soc.on('connection', function (socket) {
  //这条信息会发送给除了当前socket的其他用户
  socket.broadcast.emit('有用户连接');
});

上面这个方法是发送给连接同一个soc的用户的，如果在socOne里掉是不会发送给socTow的

前端

npm install socket.io
// or
yarn add socket.io

<template>
  <div class="home">
    <button @click="sendA">发送消息a</button>
    <button @click="sendB">发送消息b</button>
  </div>
</template>

<script>
import io from "socket.io-client"
export default {
  data() {
    return {
      socA: null,
      socB: null
    }
  },
  methods: {
  // 主动向服务器one发送信息
    sendA() {
      this.socA.emit('msg', '你好服务器');
    },
  // 主动向服务器tow发送信息
    sendB() {
      this.socB.emit('msg', '你好服务器');
    },
    init() {
      this.socA = io('http://localhost:9000/one', {
        transports: ['websocket']
      });
      this.socB = io('http://localhost:9000/tow', {
        transports: ['websocket']
      });
      // 监听one返回的信息
      this.socA.on('msg', (data) => {
        console.log(data);
      });
      // 监听tow返回的信息
      this.socB.on('msg', (data) => {
        console.log(data);
      });
    }
  },
  created() {
    this.init();
  }
}
</script>

这里说个聊天实现思路

时隔半个小时，来更新一下

1.想要实现聊天效果首先需要将刚刚所登录的用户全部储存起来
	这里可以用缓存或者说是变量来储存，简单易用，就是服务器不能重启，重启数据就都没了。
	用户登录之后将用户的信息储存起来，将用户对用的socket实例也要储存起来（connection回调里的实例）
	用户退出登录，当用户与服务器断开连接之后将储存的该用户和cocket实例也删除掉（防止没用的信息太多，清理内存）
2.群发消息
	上面也说到了一个方法，socket.broadcast.emit('msg','有用户连接')，这个方法会发送给除了当前socket实例以外所有的socket（如果填写了如上的msg，需要客户端也要有监听msg的方法）
3.点对点发消息
	之前储存了用户的信息和用户的实例，之前忘记说一点，就是储存的用户或者socket实例必须有唯一的区分，比如用户登录账户（不会有人会让用户账户重复的吧）。
	用户发送过来的信息带上自己的信息、对方的信息以及发送的内容。服务器凭借对方的信息找到对应的socket实例，使用该实例向对法推送消息，并带上发送消息的用户信息和内容。

都写到这了，在补充一个思路
4.离线消息（也就是对方不在线）
	接收到用户需要推送的信息，去查询接收者的信息，发现当前连接的里面没有（不在线），将这条消息储存。
	接下来修改用户登录，登录的时候不再是简单的保存了，再加一步，查询当前离线池里（刚刚给起的名字，就是储存的未推送消息记录）有没有属于自己的信息，有的话就推送，没有就是正常登录。

再唠叨一句，每个socket实例都有一个id，这个id是唯一的，但是不能拿它去识别用户，因为这玩意是根据链接的时候生成的，可能会变，作为区分需要自己再绑定用户信息