socket.io-client 和egg-socket.io搭配使用 注意的坑

前端項目用的react + socket.io-client

服務端用的egg egg的官網上有配合使用的egg-socket.io

一開始鏈接不上，起初覺得應該是前端連接問題，這個過程中我修改過連接和transports方式，但是都沒有作用

const socket = io('ws://127.0.0.1:7001', {
	path: '',
	transports: ['websocket', 'xhr-polling', 'jsonp-polling'],
})

然後開始從監聽事件上做文章

socket.on('connect', () => {});

接收服務端方法myevent傳過來的參數 socket.on('myevent', () => {});

connect_error | disconnect | reconnect | reconnect_attempt [具體文檔]（https://www.w3cschool.cn/socket/socket-k49j2eia.html）

沒找到問題開始查找服務端的代碼是否有錯誤

1、查看代理的方法是否寫的對

2、命名空間問題

最終發現是版本的問題：當前egg-socket.io 是4.1.6 socket.io-client爲4.1.1， connect_error這個監聽器報客戶端和服務端socket.io版本不匹配

以egg-socket.io/4.1.6爲例，搭配的socket.io-client應爲2.1.1

一定要注意node_modules裏的egg-socket.io依賴的socket.io-client版本號！！！

import io from 'socket.io-client'

const socket = io('ws://127.0.0.1:7001')
socket.on("connect", () => {
  socket.on("res", (data: any) => {
	console.log('res=>>>', data);
  });
});

socket文檔