How to fix 400 error bad request in socket io?(如何修复Socket io中的400错误错误请求?)
问题描述
我有一个前端应用程序(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错误错误请求?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:如何修复Socket io中的400错误错误请求?
基础教程推荐
- 从快速中间件中排除路由 2022-01-01
- 在 Javascript 中使用 Fetch API 上传文件并显示进度 2022-01-01
- 最佳动态 JavaScript/JQuery 网格 2022-01-01
- 带角度的选项卡:仅使用 $http 在单击时加载选项卡 2022-01-01
- 当木偶师打开Chrome时,不能使用Chrome扩展 2022-01-01
- CORS:当凭据标志为真时,无法在 Access-Control-Allow-Origin 中使用通配符 2022-01-01
- 即使每次插入第一个输入的值不同,第二个输入仍显示相同的输入值 2022-01-01
- 逻辑运算符 ||在 javascript 中,0 代表 Boolean false? 2022-01-01
- 使用 jQuery 在悬停时交换 DIV 类 2022-01-01
- HTML5 画布调整为父级 2022-01-01
