Socket.io-клиент не может nnet подключиться к серверу из мобильного приложения React Native - PullRequest
0 голосов
/ 17 февраля 2020

Я пытаюсь подключиться к удаленному серверу через socket-io.client из приложения React Native android, но эти попытки не удаются, проверка сокета. подключен -> false, не работает с событием подключения на сервере, потратил на это больше суток, не могу понять, в чем дело. Использование примерно одного и того же кода в Интернете (хотя и на другой платформе) приводит к соединению.

Я много читал, и все говорили о разных вещах. Возможно AndroidMainfest. xml не тот ... Может версии не одинаковые ... Поэтому я отправляю все сразу.

Код: App. js

import React, { useState, useEffect } from 'react';
const io =  require('socket.io-client');

export default function App() {
useEffect(() => {
    const socket = io('https://my_domain:3000/', {transports: ['websocket'], secure: true});
      socket.connect();
    console.log(socket.connected);
  })
}

Сервер. js

const cors = require('cors');
const bodyParser = require('body-parser');
const express = require('express');

const app = express();
var options = {
    key: my_key,
    cert: my_cert
}
const server = require('https').createServer(options,app);
server.listen(3000, 'my_domain');
const io = require('socket.io')(server);

app.use(cors());

let connections = [];

io.on('connect', (socket) => {
    connections.push(socket);
    console.log('Connect');
    console.log(connections.length);
}

AndroidManifest. xml

<?xml version="1.0" encoding="utf-8"?>
<manifest
  xmlns:android="http://schemas.android.com/apk/res/android"
  package="com.facebook.react.uiapp">

  <uses-permission android:name="android.permission.INTERNET" />
  <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
  <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/>
  <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
  <uses-permission android:name="android.permission.CHANGE_NETWORK_STATE" />
  <uses-permission android:name="android.permission.VIBRATE"/>

  <!--Just to show permissions example-->
  <uses-permission android:name="android.permission.CAMERA"/>
  <uses-permission android:name="android.permission.READ_CALENDAR"/>

  <!--
  android:icon is used to display launcher icon on mobile devices.
  android:banner is used to display a rectangular banned launcher icon on Android TV devices.
  -->
  <application
      android:name=".RNTesterApplication"
      android:allowBackup="true"
      android:banner="@drawable/tv_banner"
      android:icon="@drawable/launcher_icon"
      android:label="@string/app_name"
      android:theme="@style/Theme.ReactNative.AppCompat.Light" 
      android:usesCleartextTraffic="true">
    <activity
        android:name=".RNTesterActivity"
        android:label="@string/app_name"
        android:screenOrientation="fullSensor"
        android:configChanges="orientation|screenSize" >
      <intent-filter>
        <action android:name="android.intent.action.MAIN" />
        <category android:name="android.intent.category.LAUNCHER" />
        <!-- Needed to properly create a launch intent when running on Android TV -->
        <category android:name="android.intent.category.LEANBACK_LAUNCHER" />
      </intent-filter>
      <intent-filter>
        <action android:name="android.intent.action.VIEW" />
        <category android:name="android.intent.category.DEFAULT" />
        <category android:name="android.intent.category.BROWSABLE" />
        <!-- Accepts URIs that begin with "rntester://example” -->
        <data android:scheme="rntester" android:host="example" />
      </intent-filter>
    </activity>
    <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
  </application>

</manifest>

Пакет. json

{
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web",
    "eject": "expo eject"
  },
  "dependencies": {
    "@expo/vector-icons": "^10.0.6",
    "@react-native-community/masked-view": "0.1.5",
    "@react-navigation/drawer": "^5.0.3",
    "expo": "~36.0.0",
    "expo-font": "^8.0.0",
    "jquery": "^3.4.1",
    "react": "~16.9.0",
    "react-dom": "~16.9.0",
    "react-native": "https://github.com/expo/react-native/archive/sdk-36.0.0.tar.gz",
    "react-native-gesture-handler": "~1.5.0",
    "react-native-reanimated": "~1.4.0",
    "react-native-safe-area-context": "0.6.0",
    "react-native-screens": "2.0.0-alpha.12",
    "react-native-web": "~0.11.7",
    "react-navigation": "^4.1.1",
    "react-navigation-drawer": "^2.3.4",
    "react-navigation-stack": "^2.0.4",
    "react-socket-io-client": "^1.1.1",
    "socket.io-client": "^2.1.1"
  },
  "devDependencies": {
    "babel-preset-expo": "~8.0.0",
    "@babel/core": "^7.0.0"
  },
  "private": true
}

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...