使用 Socket.io 在 React Native 移动应用程序中不起作用

Posted 2023-04-18

【中文标题】使用 Socket.io 在 React Native 移动应用程序中不起作用

【英文标题】：Using Socket.io not working in React Native Mobile App

【发布时间】：2021-09-22 22:44:44

【问题描述】：

我尝试将套接字与 React Native 移动应用程序连接。 节点服务器 socket.io 正在工作，我已经使用了 react web，但是当我使用 React Native Mobile App 时没有工作

客户端（反应原生

import io from 'socket.io-client';

const ENDPOINT = "http://192.168.1.3:7000";
const socket = io(ENDPOINT, transports: ['websocket']);

const getMessage = () => 
  socket.on('getMessage', (data) => 
    console.log('socket data', data);
  )
;

const sendMessage = () => 
  var userid = log.userid
  var message = "msg from app"
  socket.emit('send msg',  userid, message );

服务器（节点 Js）

const app = express();
const server = app.listen(7000);
const io = require('socket.io')(server, 
cors : 
    origin:'*'
  
);

io.on("connection",(socket)=>
  socket.on('sendMessage',(userid, message)=>
    io.emit('getMessage',userid, message);
  )
)

【参考方案1】：

开发！我解决了这个问题，只是不使用 socket.io。我知道 Socket.io 在移动应用程序中不是一个好的选择。请改用WebSocket API。

反应组件

import React from 'react';
import  View, Text  from 'react-native';

class WebSocketConnection extends React.Component 

    constructor(props) 
        super(props);
        this.webSocket = this.webSocket.bind(this);
    

    webSocket() 
        const ws = new WebSocket('ws:172.16.20.201:8080');

        ws.onopen = (e) => 
            console.log('connected on wsServer');
        
        
        ws.addEventListener('open', function (event) 
            ws.send('Hello from React Native!');
        );
        
        ws.addEventListener('message', function (event) 
            this.message = event.data;
            console.log('Message from server ', event.data);
        );
        
        ws.onerror = (e) => 
            console.log(e);
        
    
    
    render() 
        return (
            <View>
                <Text>
                    Socket.io YES
                </Text>
            </View>
        )
    

    componentDidMount() 
        this.webSocket();
    



export default WebSocketConnection;

服务器

/**
 * Create WebSocket server.
 */

const WebSocket = require('ws');
const serverWs = new WebSocket.Server(
  port: 8080
);

let sockets = [];
serverWs.on('connection', function(socket) 
  sockets.push(socket);

  console.log(`connectet client`);

  // When you receive a message, send that message to every socket.
  socket.on('message', function(msg) 
    console.log(msg);
    sockets.forEach(s => s.send(msg));
  );

  // When a socket closes, or disconnects, remove it from the array.
  socket.on('close', function() 
    sockets = sockets.filter(s => s !== socket);
  );
);

在使用 Express 时，我将此服务器绑定在 /bin/www 中，并且对我来说工作正常。

【讨论】：

嗨。我在使用 socket.io 时也遇到了麻烦，然后我找到了你的答案。您能否与我分享更多信息，例如在服务器上安装什么或做出类似反应。真的很感激。谢谢

嗨，开发者。在服务器中，您将拥有一个本机 WebSocket 服务器。 MasteringJs 。在客户端，您将拥有一个本机 WebSocket 客户端（甚至是 ReactNative）。 Mozilla .I'm not sure I've help you,但如果没有，请告诉我更多信息！祝福！