如何修复Socket io中的400错误错误请求？ [英] How to fix 400 error bad request in socket io?

问题描述

我有一个前端应用程序(VUE JS)

我有一个后端(Nest JS)

Vue JS应用程序使用VUE-Socket.IO-扩展库通过WebSockets从后端获取数据 当Vue JS应用启动时，我在浏览器中看到错误：

Polling-xhr.js？d33e：229 POST http://localhost:11050/socket.io/?EIO=4&；transport=polling&；t=NMXgCF1 400(错误请求)

如何修复此错误？

我认为它与库没有连接，我只尝试了Socket io库，结果是一样的。

服务器正在工作，因为它发送日志并显示连接人员：

Server(Nest JS) main.ts文件：

async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  app.enableCors();
  await app.listen(11050);
}
bootstrap();

App.ateway：

@WebSocketGateway()
export class AppGateway implements OnGatewayInit, OnGatewayConnection, OnGatewayDisconnect {


  private logger: Logger = new Logger('AppGatway');

  @SubscribeMessage('msgToServer')
  handleMessage(client: Socket, text: string): WsResponse<string> {
    return { event: 'msgToClient', data: text };
  }

  afterInit(server: Server) {
    this.logger.log('Initialised!');
  }

  handleConnection(client: Socket, ...args: any[]): any {
    this.logger.log(`Client connected: ${client.id}`);
  }

  handleDisconnect(client: Socket): any {
    this.logger.log(`Client disconnected: ${client.id}`);
  }
}

前端(Vue JS)：

import VueSocketIOExt from "vue-socket.io-extended";
import Vue from "vue";
import io from "socket.io-client";
const socket = io("http://localhost:11050/");

Vue.use(VueSocketIOExt, socket);

data: () => ({
socket: null,
    connection: null,
    sockets: {
      connect() {
        console.log("socket connected");
      },
    },
}

推荐答案

我今天遇到了这个问题，使用的是非常类似的NestJS实现，但是我的前端是用ReactJS编写的。我认为该问题与不匹配的Socket.IO服务器和客户端版本有关。

我通过将socket.io-client的版本从^3.0.0降级到^2.3.0解决了此问题。

这篇关于如何修复Socket io中的400错误错误请求？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！