怎么使用 Socket.io 连接 WebSocket 服务

Posted 2023-05-08

参考技术A socket.io封装了websocket，同时包含了其它的连接方式，比如Ajax。原因在于不是所有的浏览器都支持websocket，通过socket.io的封装，你不用关心里面用了什么连接方式。你在任何浏览器里都可以使用socket.io来建立异步的连接。
如果需要自己实现WebSocket服务的话 ，用spray去实现还是挺方便的。

我有用Spray.io+
WebSocket 实现过一个demo，自己的机器最大支持3w不到的同时在线好像。性能不是特别好，豌豆荚的那个实现，性能非常高。网上有开发者做的分享PPT中有提到

如何使用 socket.io 连接两个应用程序

【中文标题】如何使用 socket.io 连接两个应用程序

【英文标题】：how to connect two apps with socket.io

【发布时间】：2021-02-10 11:45:07

【问题描述】：

所以我有一个运行良好的 electron-express-socket.io 应用程序。 我现在需要使用 ("socket.io-client") 将 EXPO 应用程序连接到 socket.io。

它们位于不同的端口。

Eelectron-express-socket.io = http://localhost:3000/ EXPO 应用程序 = http://localhost:19006/

我试过这个 https://socket.io/docs/v2/handling-cors/

电子：

const socketio = require('socket.io');
class WebSocket 
  socket = null
  allClients = [];

  socketOptions = 
    'path': '/ws',
    'pingInterval': 10000,
    "handlePreflightRequest": (req, res) => 
      res.writeHead(200, 
        "Access-Control-Allow-Origin": "http://localhost:3000",
        "Access-Control-Allow-Methods": "GET,POST",
        "Access-Control-Allow-Headers": "my-custom-header",
        "Access-Control-Allow-Credentials": false
      );
      res.end();
    
  

  constructor(httpServer) 
    //-------------------------------------------------------
    // this.socket = socketio(httpServer, this.socketOptions);
    //-------------------------------------------------------
    this.socket = socketio();
    this.socket.attach(httpServer, this.socketOptions);
    //-------------------------------------------------------

    this.socket.on('connection', (client) => 
      this.onConnection(client);
    );
    this.socket.on('error', this.onClientError);
  

世博APP：

import socketIOClient from "socket.io-client";
const ENDPOINT = "http://localhost:3000/";

export default function App() 
 //-- SocketIO
 const [response, setResponse] = useState("");
 useEffect(() => 
   const socket = socketIOClient(ENDPOINT, 
    withCredentials: false,
  );

   socket.on("currentTime", data => 

     setResponse(data);
   );

 , []);

//-- SocketIO

  return (
    <View style=styles.container>
      <Text>responseOpen up App.js to start working on your app!</Text>
      <StatusBar style="auto" />
    </View>
  );

我也累了

socketOptions = 
    'path': '/ws',
    'pingInterval': 10000,
    "handlePreflightRequest": (req, res) => 
      res.writeHead(200, 
        "Access-Control-Allow-Origin": "http://localhost:3000",
        "Access-Control-Allow-Methods": "GET,POST",
        "Access-Control-Allow-Headers": "my-custom-header",
        "Access-Control-Allow-Credentials": true
      );
      res.end();
    
  

和

const socket = socketIOClient(ENDPOINT, 
withCredentials: true,
transportOptions: 
  polling: 
    extraHeaders: 
      "my-custom-header": "abcd"
    
  

);

【参考方案1】：

我所要做的就是将 EXPO 更改为 socket：

const socket = socketIOClient(ENDPOINT,
    path: '/ws',

   );