React native и socket.io node не работает

Ниже приведена ссылка на мой собственный компонент native и код node server.js, который я пытаюсь подключиться к моему серверу node websocket.

Мой код реагирования работает на том же компьютере, что и сервер. Я нашел здесь много разных ответов, и github, ни один из которых я не могу работать.

Я также нашел этот question, на который никогда не отвечали, и этот вопрос имеет ответ, который я не могу получить (просил более года назад)

Я нашел эту статью и попытался изменить мой код на основе этих рекомендаций, но это не сработало.

реагировать на код

import React from 'react';
import { StyleSheet, Text, View, Image } from 'react-native';

const io = require('socket.io-client/socket.io');
let socket = io('http://localhost:3000');

export default class App extends React.Component {

    constructor(props) {
        super(props);
        console.log(socket);
    }

    render() {
        return (
            <View>
                <Text>Websocket</Text>
            </View>
        );
    }
}

server.js

const express = require('express');
const http = require('http')
const socketio = require('socket.io');

const app = express();
const server = http.Server(app);
const websocket = socketio(server);
server.listen(3000, () => console.log('listening on *:3000'));

console.log(websocket)

// The event will be called when a client is connected.
websocket.on('connection', (socket) => {
  console.log('A client just joined on', socket.id);
});

Я использую следующие версии пакетов

"expo": "^16.0.0",
"react": "16.0.0-alpha.6",
"react-native": "^0.43.4",
"socket.io-client": "^1.7.3"

Ответ 1

Я считаю, что это должно быть

const io = require('socket.io-client');

Что работает для меня.

Я помню, что сталкивался с такими проблемами при использовании реакции native. Многие учебники socket.io(в том числе и на их странице) предполагают, что вы используете более старый стиль импорта JS через теги script в HTML-документе. Похоже, что socket.io изменил пространство имен, поскольку я помню, что он был socket.io-client/socket.io некоторое время назад, если память служит...

Ответ 2

Код сервера выглядит нормально. Хотя вы должны проверить, можете ли вы подключиться к его сокету через другого клиента.

В любом случае попробуйте это для ответа на собственный код.

Импорт:

import io from 'socket.io-client/socket.io'

В вашем компоненте выполните:

componentDidMount () {
    const socket = io(YOURURL, {
      transports: ['websocket']
    })

    socket.on('connect', () => {
      console.log("socket connected")
      socket.emit('YOUR EVENT TO SERVER', {})
      socket.on('EVENT YOU WANNA LISTEN', (r) => {
      })
    })

    socket.on('connect_error', (err) => {
      console.log(err)
    })

    socket.on('disconnect', () => {
      console.log("Disconnected Socket!")
    })
  }

Ответ 3

Спасибо, Питер. На мой взгляд, статья, которую вы нашли, не помогает, потому что вы пытаетесь подключиться к хосту, обслуживающему страницу. В соответствии с примером на socket.io странице, убедитесь, что эта строка работает: const io = require('socket.io-client/socket.io'); и подключиться без ссылки: let socket = io();

Это сработало для меня, но только в браузере на том же компьютере. Я думаю, что когда вы проверите на устройстве, вы должны указать свой IP вместо localhost.

Удачи:)