如何将前端 ReactJS 套接字客户端连接到服务器端套接字？

问题描述

在我的 MERN 应用中出现以下错误。

streamBuilderWidget

不知道如何让前端 ReactJS 端的 socket 客户端连接到服务端的 socket 端。

SERVER.js

StreamBuilder<QuerySnapshot>(
stream:FirebaseFirestore.instance.collection("usersMsgs").doc(????).collection("chat").snapshots(),builder: (BuildContext context,AsyncSnapshot<QuerySnapshot> snapshot) {
    if (!snapshot.hasData) {
       return Center(
     child: circulearProgress(),);
  } etc.....

ProductScreen.js

WebSocket connection to 'ws://localhost:3000/socket.io/?EIO=4&transport=websocket' Failed: WebSocket is closed before the connection is established.

解决方法

我认为您在客户端的连接方式不正确，您基本上是连接到您的 React 应用程序，您需要像这样将 BACKEND URL 传递给 io >

 const socket = io('http://localhost:5000/',{
                transports: ["websocket","polling"],});