node.js - 用户登录时重新连接套接字

Question

我使用 create-react-app 创建的设置，并使用 Flux 进行数据管理，并且应用程序需要在客户端实现套接字(我使用 socket.io 用于此目的)。

目前，套接字是通过以下方式在 Socket.js 文件中初始化的:

import io from 'socket.io-client';
import { remoteUrl } from './constants/RemoteUrl';
import SocketWorker from './utilities/SocketWorker';

let socket = io.connect(remoteUrl + '?role=user');

socket.on('statusChange', (data) => {
  return SocketWorker.receiveOrderStatusChange(data);
})

export  { socket };

它确实有效，但问题是它只在站点加载时尝试连接到服务器一次。当用户未经身份验证打开站点时，它不会连接并错过重新连接，因此未建立连接并且未接收套接字事件

我尝试创建一个类，并对 API 使用react以在对象上重新连接，例如:

import io from 'socket.io-client';
import { remoteUrl } from './constants/RemoteUrl';
import SocketWorker from './utilities/SocketWorker';

function Socket() {
  this.socket = io.connect(remoteUrl + '?role=user');
  this.reconnect = () => {
    this.socket = io.connect(remoteUrl + '?role=user');
  }
}

let socket = new Socket();

socket.socket.on('statusChange', (data) => {
  return SocketWorker.receiveOrderStatusChange(data);
})

export { socket };

我尝试调用 Socket.reconnect() 方法，但它不起作用并且连接也没有建立。有什么想法或替代解决方案吗？

Answer 1

如果有人在使用 Socket.io API 时遇到同样的问题，我设法解决这个问题的方法:

首先，您应该将 Socket 封装到由构造函数创建的对象中，但不需要创建重新连接方法，因为连接已经存在(并且可以通过我将在下面描述的发出的事件来处理身份验证):

import io from 'socket.io-client';
import { remoteUrl } from './constants/RemoteUrl';
import SocketWorker from './utilities/SocketWorker';

function Socket() {
  this.socket = io.connect(remoteUrl + '?role=user');

  this.socket.on('statusChange', (data) => {
    return SocketWorker.receiveOrderStatusChange(data);
  })
};

const socket = new Socket();

export  { socket };

您可以在项目中的任何位置导入套接字:

import {socket} from './Socket';

您可以调用:

socket.socket.emit('joinRoleRoom','user');
socket.socket.emit('joinIdRoom', _user._id);

在服务器端，您只需按如下方式处理这些事件:

socket.on('joinRoleRoom', (role) => {
  socket.join(role)
  console.log('Client joined to: ' + role);
});
socket.on('joinIdRoom', (id) => {
  console.log('Client joined to: ' + id);
  socket.join(id)
});

套接字将根据在身份验证过程中获得的身份验证信息加入必要的房间。