Question

我无法连接到后端的前端服务器插槽在我的前端（反应），我有这个：

_linkedItemsSource

在我的后端

GetLinkedItems

在我的路由器文件夹中，我有这个：

import React, { Component } from 'react';
import {Form,FormGroup, Label, Input, Button, Alert} from 'reactstrap';
import Header from '../../components/header';
import io from 'socket.io-client';
export default class Login extends Component {

    constructor(props) {
        super(props)
        console.log(this.props);
        this.state = {
            message: this.props.location.state?this.props.location.state.message: '',
        };
    }

    signIn = () => {
        let socket = null;

            async function connect () {
               socket = io.connect('http://localhost:8080/');
            }
            connect();

    }

    render(){
        return(
            <div className="col-md-6">
                <Header title="ReactJS Login"/>
                <hr className="my-3"/>

                    <Button color="primary" onClick={this.signIn}> Entrar </Button>

            </div>
        );
    }
}

我还想知道如何在我的路由中添加jwt验证中间件

我也不知道这是否是我可以使用路由和控制器使用套接字的最佳代码结构，如果有人可以帮助我进行改进的话。

Answer 1

您的示例中没有与服务器实际交互的代码。请按照以下说明更新代码，以确定连接和事件是否按照问题注释起作用。

反应：

async function connect () {
    socket = io.connect('http://localhost:8080/');

    socket.on('hello', (message) => {
        console.log(message);
    });

    socket.on('myevent', message => {
        console.log(message);
    });

    socket.emit('myevent', {foo: 'bar'});
}

快递：

module.exports = (socket) => {
    socket.emit('hello', {data: 'this is a message'});

    socket.on('myevent', (message) => {
       console.log(message);

       socket.emit('myevent', {message: 'OK'});
    });
 };

反应js nodejs socket.io

1 个答案: