Question

我正在尝试将 Express 中的 socket.io 服务器连接到 Angular 客户端，但遇到了一些问题。

目前我的 Express 程序代码是

const options: cors.CorsOptions = {
    allowedHeaders: [
        'Origin',
        'X-Requested-With',
        'Content-Type',
        'Accept',
        'X-Access-Token',
    ],
    credentials: true,
    methods: 'GET,HEAD,OPTIONS,PUT,PATCH,POST,DELETE',
    origin: ['http://localhost:4200/'],
    preflightContinue: false,
};

dotenv.config();
const app: Express = express();
app.use(bodyParser.json())
app.use(cors());


let server = http.createServer(app);
let io = new socketio.Server(server);
// let io = new socketio.Server();
// io.listen(server);

io.on('connection', (socket) => {
    console.log("Connection from client");
})

app.listen(process.env.PORT, () => {
    return console.log(`server is listening on ${process.env.PORT}`);
});

这对于普通的 HTTP 工作正常，我已经开始工作了，但我没有收到 CORS 错误或任何错误。但是，当我尝试将 Angular 客户端连接到服务器时，我开始收到 404 错误。

GET http://localhost:5050/socket.io/?EIO=4&transport=polling&t=Nb8aNZ5 404 (Not Found)

我查看了一下，发现这个 stack overflow 答案提到了以下代码

var app     = express();
var server  = require('http').createServer(app);
var io      = require('socket.io').listen(server);
server.listen(app.get('port')); // not 'app.listen'!

我在使用 app.listen(port) 时收到 404 错误，但是如果我将其更改为 server.listen(port)，我开始收到 CORS 错误，试图从客户端连接到 socket.io 服务器。

Access to XMLHttpRequest at 'http://localhost:5050/socket.io/?EIO=4&transport=polling&t=Nb8bDGb' from origin 'http://localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

我不确定我需要在这里更改什么才能使其正常工作。我希望能够使用 app.listen 以便我可以使用我所有的 express 中间件。有没有办法做到这一点？

客户端使用以下方式尝试连接

import * as socketioClient from 'socket.io-client';
this.socket = socketioClient.io(environment.apiBaseUrl); //Url is http://localhost:5050

找不到本地主机 socket.io 服务器 (404)

0 个答案: