socket.io

[ 官方文档的坑 ]

• 文档示例

[ 服务端 ]

• 官方文档给出了一个入门的示例，但是如果按照这个示例，会得到一个不断循环出现的404。
• 解决这个问题，只需要理解一点就好，socket.io会启动一个服务器，这个服务器和express启动的服务器不是一个东西，所以不能监听同一个端口。
• 简言之，如果我们给 express 监听了80端口，那么就要手动给 socket 监听另一个端口，同时做好跨域。

  const express = require('express')
  const { Server } = require('socket.io')

  // 分别创建 express 服务器 和 socket 服务器
  const app = express()
  const io = new Server()

  // 分别给两个服务器 分配端口
  app.listen(80)
  io.listen(3000)

• 如上，会出现一个跨域的问题，所以在 socket 服务器创建的时候，要设置好跨域问题

  // 这里写了监听端口，就不用在单独去写了
  const io = new Server(3000, {
    cors: {
      // 这里注意，如果是80端口，可以省略
      origin: 'http://localhost'

      // 如果是其他端口，需要写出端口
      // origin: 'http://localhost:5173'
    }
  })

[ 客户端 ]

• 既然 socket 服务器监听的不是 80 端口，那么客户端在创建 socket 对象的时候，就需要指明 socket 服务器所监听的端口。

  const socket = io('localhost:3000')

• 不知道写官方文档的人有没有跑过自己写的示例，耽误工夫。也或者是我太菜了没明白其中精髓吧。总之算是跑通了。