在 socket.io 中连接 2 个不同的应用程序（REACT NATIVE）

Posted 2023-04-18

【中文标题】在 socket.io 中连接 2 个不同的应用程序（REACT NATIVE）

【英文标题】：connect 2 different application in socket.io (REACT NATIVE)

【发布时间】：2021-10-13 09:58:34

【问题描述】：

大家好，我无法从application a 获取数据到application b

等等我的application a

useEffect(() => 
 setSocket(io('http://MY_SERVER_IP:3000', 
    transports: ['websocket'],
    jsonp:false,
    forceNew: true,
  ));
,[]);

const SendData = () => 
  socket.emit("user app info", dataInfo);

现在在我的server 上是这个

io.on("connection", socket => 
    console.log("a user connected :D");
    //User info's
    socket.on("user app info", dataInfo => 
        // console.log(msg);
        io.emit("user app info", dataInfo);
    );
    //Driver info's
    socket.on("driver app info", msg => 
        io.emit("driver app info", msg);
    );
);

现在我需要将它发送到我的application b 我是这样做的，但现在可以工作了

useEffect(() => 
    setSocket(io('http://MY_SERVER_IP:3000', 
        transports: ['websocket'],
        jsonp: false,
        forceNew: true,
    ));
, []);


const onAccept = (newOrder) => 
       socket.on("user app info", dataInfo => console.log(dataInfo));

但它根本不会显示任何日志。有人可以启发我。谢谢

【问题讨论】：

我遇到了同样的问题，所以我切换到核心 WebSocket。 developer.mozilla.org/en-US/docs/Web/API/WebSocket

@RajendranNadar 你也使用 react-native-websocket 吗？？

不，我用的是原生web API，不需要任何包。

对不起，你能指导我一点关于如何在 react native 上实现它吗？？？

【参考方案1】：

在 React Native 上使用 WebSocket API

第 1 步 -

为 WSS 连接创建参考

const ws = React.useRef(null)

第 2 步 -

初始化网络套接字

React.useEffect(() => 
    ws.current = new WebSocket('URL to WS')

    ws.current.onopen = () => console.log('Connected')

    ws.current.onclose = () => console.log('Disconnected')

    return () => 
        ws.current.close()
    
, [])

第 3 步 -

添加 onMessage 监听器以接收传入的 WS 数据。

React.useEffect(() => 
    if (!ws.current) return

    ws.current.onmessage = (val) => 
        const response = JSON.parse(val.data)

        console.log(response)
    
, [])

发送一些数据使用

ws.current.send(
    JSON.stringify(
       ...your payload data to server
    )
)

这是最小的 WSS 连接代码，其余是您处理接收到的数据并将其发送到服务器的方式。

【讨论】：

所以我不再需要进口了。 react native 0.60+ 是否已经支持 websocket 连接|？

无导入、无包、无库，在 RN 0.60 以上至 RN 0.64 上进行了尝试和测试