在本地主机上对 Node.js Socket.io 的调用无法正常工作、记录、发出、创建错误或执行任何其他操作,但非 socket.io 调用工作正常

Calls to Node.js Socket.io on localhost not working, logging, emitting, creating errors, or doing anything else, but non-socket.io calls work fine

我正在尝试在 Angular 和 Node 中制作一个实时 socket.io 应用程序,就像 here 所解释的那样。我设置了服务器和客户端连接,但从未建立连接。

服务器代码:

const port = process.env.PORT || 8080;
const host = process.env.BASE_URL || 'http://127.0.0.1';
const express = require('express');
const app = express();
const server = require('http').createServer(app);
const io = require('socket.io')(server);
io.on('connection', (socket) => {
    console.log('a user connected');
    socket.broadcast.emit('message-broadcast','Started');
    socket.on('message', (msg) => {
        console.log(msg);
        socket.broadcast.emit('message-broadcast',msg);
    })
});
server.listen(port, () => console.log(`listening on port ${port} + host ${host}`));

我在设置客户端代码时遇到了一些问题,正如教程中所解释的那样。当我使用行

import * as io from 'socket.io-client';

然后尝试调用

this.socket = io(environment.SocketEndpoint);

我收到错误消息“此表达式不可调用。” 经过一番摆弄后,我用

替换了导入行
import { io } from 'socket.io-client';
import { Socket } from 'socket.io-client';

和连接函数

  setupSocketConnection(){
    this.socket = io(environment.SocketEndpoint).connect();
    
    this.socket.on('message-broadcast', (data: string)=>{
      console.log('Recieved message:',data);
    })
    console.log('Set up socket',this.socket);
  }

这可能与问题有关,但我认为不是。 当我这样做时,它似乎可以工作,因为我可以在“网络”选项卡中看到定期调用,看起来像

http://localhost:8080/socket.io/?EIO=4&transport=polling&t=NbRCamo

但是这些调用中的 none 可以执行任何操作。它们在“网络”选项卡中显示为红色。计时标签显示它们“停滞”了。在服务器上,没有与这些调用关联的控制台日志,客户端也没有收到任何类型的发出消息。

奇怪的是,我可以通过将此调用粘贴到浏览器中来获得响应,如下所示:

0{"sid":"3KsDDAa1mA2OVxKIAADT","upgrades":["websocket"],"pingInterval":25000,"pingTimeout":20000}

但是服务器上仍然没有控制台登录。事实上,任何以“server.io”开头的调用根本不会创建任何日志记录。但是如果我任何对服务器的其他调用以“socket.io”开头,我会得到一个控制台日志记录已拨打的电话 - 即使只是 404 错误。所以我知道 socket.io 一定在做某事,它只是没有做它应该做的事情。

编辑:好的,当我将它上传到不同的服务器时它似乎工作正常 - 显然这只是本地主机的问题。我想我可以应付,但是能够在 localhost 上进行测试会很方便,所以如果有人能解决这个问题,那将会很有帮助。

EDIT2:这是由 CORS 策略问题引起的。我能够通过将服务器代码更改为此来修复它:

const port = process.env.PORT || 8080;
const host = process.env.BASE_URL || 'http://127.0.0.1';
const express = require('express');
const app = express();
const server = require('http').createServer(app);
const io = require('socket.io')(server, {
    cors: {
        origin: "http://localhost:4200",
        methods: ["GET", "POST"]
    }
});
io.on('connection', (socket) => {
    console.log('a user connected');
    socket.broadcast.emit('message-broadcast','Started');
    socket.on('message', (msg) => {
        console.log(msg);
        socket.broadcast.emit('message-broadcast',msg);
    })
});
server.listen(port, () => console.log(`listening on port ${port} + host ${host}`));

这可能与 CORS 问题有关。我有一个类似的问题,我在端口 5000 上有 socketio 服务器 运行,在 4200 上有 angular 应用程序,CORS 策略根本不喜欢。我使用代理配置解决了这个问题,并使用 --proxy-config proxy.json.

启动了开发服务器

proxy.json:

{
 "/socket.io": {
        "target": "http://localhost:8080",
        "secure": false,
        "ws": true,
        "changeOrigin": true,
        "logLevel": "debug",
        "pathRewrite": { }
    }
}

但不确定您是否遇到了同样的问题。