大白话带你理解Socket.io是如何同步数据的

需求分析

有哪些实现方法？

方法1：不断轮询

方法2：长连接

长连接实现

通过Socket.io实现长连接

使用socket.io实现聊天室功能

https://socket.io/get-started/chat

1. 服务端：安装socket.io

npm install socket.io

2. 服务端：创建socket.io服务器

const express = require('express');
const app = express();
const http = require('http');
const server = http.createServer(app);
const { Server } = require("socket.io");
const io = new Server(server);

app.set('view engine','ejs');
app.use(express.static('public'));

app.get('/',(req,res) => {
  res.render('index');
})

server.listen(8002)

// 创建socket.io服务
io.on('connection',(socket) => {
  console.log('一个用户连接到服务器');
  // 下面是给客户端的广播
  socket.emit("serverMsg","已经建立了连接")
})

3. 客户端：连接socket.io服务器并监听广播

  // 1. 连接socket.io服务器
  const socket = io();
  // 2. 监听广播
  socket.on("serverMsg",function(serverData){
    console.log(serverData);
  })

4. 客户端：向服务端发送数据

  $('#send').click(function() {
    const msg = $('#msg').val();
    // alert(msg);
    socket.emit("clientMsg",msg);
  });

5. 服务端监听消息并发送广播

  socket.on("clientMsg",(clientData) => {
    console.log(clientData);
    io.emit("serverMsg",clientData);
  })

总结