Socket.IO 不会升级到 websockets 的连接

Question

I'm working on a project with Angular and Node.js where I'm using socket.io (v3.1.0). The problem is that the connection between server and client is never upgraded from polling to websockets , even though I can see on the web console that the upgrade connection request is sent and the 101 code response with "swithcing protocols" is received.

Here it is the socket.io config code on the server:

const app = express();
const server = await app.listen(port);

const test = io.of('/api/test');
test.on('connect', socket => {
  console.log("Connected");
});


io.listen(server, 
      {
      cors: { 
         origin: "*", 
         methods: ["GET", "POST"],
         allowedHeaders: ["content-type"],
         credentials: true
      }
   });

Client code:

this.socket = io("/api/test")
this.socket.on('connect', () => {
      console.log("Connected");
});

Proxy config file:

"/sock/*": {
        "target": "http://localhost:3000/socket.io/",
        "logLevel": "debug"
    }

Another thing I'd like to add is that if I change the proxy file to this:

"/sock/*": {
        "target": "http://localhost:3000/socket.io/",
        "logLevel": "debug",
        "ws": true
    }

Now in chrome it works only with ws (as expected) but it doesn't work on mozilla (it keeps refreshing the page and throwing an error).

So the question is: Does anyone know why it won't automatically upgrade to websockets? From What I understand It should send an http request first for handshake but after that it should upgrade to websockets by default, am I wrong?

Answer 1

I have the same issues with Firefox. If I set the script to get the bundle from the server, socket.io sends the script as text/html which forces Firefox to not load it because of X-Content-Type-Options: nosniff header. And if I load the script directly, it doe pooling continuously without any chance of upgrading.