我正在使用 React Native 和 Socket.io 为 Android 构建一个聊天应用程序。 问题是我无法在应用程序和服务器之间建立连接。它给我一个连接错误，提示 Websocket Error。

我尝试将 App Socket Io URI 更改为 localhost: port(这会导致传输错误或超时错误)， ip: port (这会导致 Websocket 错误)，设置 diff 选项。然后尝试对服务器使用 require syntaxes 而不是 import 。然后安装了旧版本 React-native 和 socket.io & socket.io-client，仍然没有运气!然后从 github 找到了一个应用程序仓库，安装它，并尝试运行该应用程序。同样的错误。还更改了 Android list 文件中的 cleartextTrafficPermitted="true"。

Node :v12.13.0

在外部设备上测试:

• Moto E3(第一代)-Android 6 Marshmallow。
• 红米 Note 7 Pro -Android 9 Pie

screenshot

SERVER:

    import express, { Application } from 'express';
    import { createServer } from 'http';
    import { listen, Server } from 'socket.io';
    
    // set port number
    const port = 7777;
    
    // set express
    const app: Application = express();
    
    // set express server
    const server = createServer(app);
    
    // listen express server updates on socket.io
    const io: Server = listen(server, {
        transports: ['websocket'],
        serveClient: false,
    });
    
    io.on('connection', (socket) => {
        console.log('connection is made');
        socket.emit('commEvent', { data: 'connectionSuccessful' });
        socket.on('disconnect', () => {
            console.log('connection disconnected');
        });
        socket.on('new-message', (data) => {
            console.log(data.message);
        });
    });
    
    // listen server updates on specified port
    server.listen(port, () => {
        console.log('Message app server listening on port:', port);
    });

SERVER: package.json

{
  "name": "message_app",
  "version": "1.0.0",
  "description": "Message app server.",
  "main": "index.js",
  "scripts": {
    "start": "node build/index.js",
    "watch": "nodemon src/index.ts",
    "test": "none",
    "build": "npm run lint && tsc-p",
    "lint": "eslint --fix --ext .ts ."
  },
  "dependencies": {
    "express": "^4.17.1",
    "socket.io": "^2.3.0"
  },
  "devDependencies": {
    "@types/express": "^4.17.6",
    "@types/socket.io": "^2.1.8",
    "@typescript-eslint/eslint-plugin": "^3.3.0",
    "@typescript-eslint/parser": "^3.3.0",
    "eslint": "^7.2.0",
    "eslint-config-prettier": "^6.11.0",
    "eslint-plugin-prettier": "^3.1.4",
    "nodemon": "^2.0.4",
    "prettier": "^2.0.5",
    "ts-node": "^8.10.2",
    "typescript": "^3.9.5"
  }
}

APP:

import React, {useEffect} from 'react';
import {AppScreenStackNavProps} from '../../../Routes/App/AppRouteTypes';
import {View} from 'react-native';
import HomeRoutes from '../../../Routes/Home/HomeRoute';
import io from 'socket.io-client';

export const socket = io('http://192.168.1.38:7777', {
  transports: ['websocket'],
  jsonp: false,
});

socket.on('commEvent', (data: {data: string}) => {
  console.warn(data.data);
});

const HomeScreen = ({navigation}: AppScreenStackNavProps<'Home'>) => {
  navigation.setOptions({
    headerShown: false,
  });

  useEffect(() => {
    socket.connect();
    socket.on('connect', (con: any) => {
      console.debug('SOCKET: connected to socket server', con);
    });
    socket.on('error', (err: any) => {
      console.debug('SOCKET: errors ', err);
    });
    socket.on('connect_error', (err: any) => {
      console.debug('SOCKET: connect_error ---> ', err);
    });
  }, []);

  return (
    <>
      <View style={{flex: 1}}>
        <HomeRoutes />
      </View>
    </>
  );
};
export default HomeScreen;

APP: package.json

{
  "name": "message_app",
  "version": "1.0.0",
  "description": "Message app server.",
  "main": "index.js",
  "scripts": {
    "start": "node build/index.js",
    "watch": "nodemon src/index.ts",
    "test": "none",
    "build": "npm run lint && tsc-p",
    "lint": "eslint --fix --ext .ts ."
  },
  "dependencies": {
    "express": "^4.17.1",
    "socket.io": "^2.3.0"
  },
  "devDependencies": {
    "@types/express": "^4.17.6",
    "@types/socket.io": "^2.1.8",
    "@typescript-eslint/eslint-plugin": "^3.3.0",
    "@typescript-eslint/parser": "^3.3.0",
    "eslint": "^7.2.0",
    "eslint-config-prettier": "^6.11.0",
    "eslint-plugin-prettier": "^3.1.4",
    "https-localhost": "^4.6.0",
    "nodemon": "^2.0.4",
    "prettier": "^2.0.5",
    "ts-node": "^8.10.2",
    "typescript": "^3.9.5"
  }
}

最佳答案

我在这个问题上花了一天时间，我发现问题出在您安装的模块上。

这意味着如果您在项目中使用 typescript ，请确保也为“socket.io.client”模块添加 .d.ts 文件。

或在 javascript 中使用相同的代码。

关于android - React Native & Socket.io - 无法在应用程序和服务器之间建立连接，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/62524783/