Question

我是本机反应的新手，并尝试在我的应用程序中实现socket.io。我想我所做的一切都正确，但仍然无法正常工作。

这是我的代码段：

App.js

import React from 'react';
import {StyleSheet, Text, View} from 'react-native';
// window.navigator.userAgent = 'react-native';
import io from 'socket.io-client/dist/socket.io'

export default class App extends React.Component {
    state = {
        name: 'Hello World!'
    };

    constructor(props) {
        super(props);
        this.socket = io('http://192.168.1.24:19001'/*, {transports: ['websocket']}*/);
        this.socket.on('connect', () => {
            console.log('connected');
        });
        this.socket.on('update', () => {
            console.log('yay');
            this.setState({name: 'Done did it!'})
        });
    }

    render() {
        return (
            <View style={styles.container}>
                <Text>{this.state.name}</Text>
            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#F5FCFF',
    },
});

我创建了一个文件夹“ server”，其中包含以下代码：

server / app.js

var express = require('express');
var app = express();
var server = require('http').Server(app);
var io = require('socket.io')(server);

server.listen('19001', '192.168.1.24');

app.get('/', function (req, res) {
    res.sendFile(__dirname + '/index.html');
});

io.on('connection', function (socket) {
    console.log(socket.id);
    socket.on('update', () => {
        console.log('update');
        socket.emit('update')
    });
});

我制作了一个html页面以与应用程序进行交互。

server / index.html

var express = require('express');
var app = express();
var server = require('http').Server(app);
var io = require('socket.io')(server);

server.listen('19001', '192.168.1.24');

app.get('/', function (req, res) {
    res.sendFile(__dirname + '/index.html');
});

io.on('connection', function (socket) {
    console.log(socket.id);
    socket.on('update', () => {
        console.log('update');
        socket.emit('update')
    });
});

我也尝试使用本地主机而不是IP地址。那也不起作用。

请帮助！

Answer 1

您为什么使用'socket.io-client/dist/socket.io'？我认为socket.io的客户端只是'socket.io-client'。
即使在回调函数内部，也不建议在构造函数中调用this.setState。当屏幕尚未渲染时，您可以更新状态，这会引发错误。尝试将您的侦听器移到componentDidMount内。
您确定连接已完成吗？如果是，则尝试将您的侦听器移至“连接”事件的回调中的“更新”事件。
您的服务器正在侦听19001端口。我认为这也是react native打包程序的默认端口。您的服务器启动了吗？如果您没有root用户访问权限，是否要尝试其他端口（例如80 8080）。

无法在react-native中使用socket.io在客户端和服务器之间发送消息

1 个答案: