Question

请帮助，
在生产中遇到以下错误

与'wss：//subdomain.example.com/socket.io/？EIO = 3＆transport = websocket'的WebSocket连接失败：WebSocket握手期间出错：意外的响应代码：404

这是我的Nginx的配置和代码-React Js和Node Express

Nginx配置

http {

    map $http_upgrade $connection_upgrade {
            default upgrade;
            '' close;
    }

    upstream node-js-myapp {
            server 127.0.0.1:5000;
    }

tcp_nopush on;
    tcp_nodelay on;
    keepalive_timeout 65;
    types_hash_max_size 2048;

server {
    root /var/www/html;

    # Add index.php to the list if you are using PHP
    index index.html index.htm index.nginx-debian.html;

    server_name subdomain.example.com;

    location / {
                # First attempt to serve request as file, then
                # as directory, then fall back to displaying a 404.
                # try_files $uri $uri/ =404;
                try_files $uri $uri/ /index.html;
        }
        # Media: images, icons, video, audio, HTC
        location ~* \.(?:jpg|jpeg|gif|png|ico|cur|gz|svg|svgz|mp4|ogg|ogv|webm|htc)$ {
          expires 1M;
          access_log off;
          add_header Cache-Control "public";
        }
        # Javascript and CSS files
        location ~* \.(?:css|js)$ {
            try_files $uri =404;
            expires 1y;
            access_log off;
            add_header Cache-Control "public";
        }
        # Any route containing a file extension (e.g. /devicesfile.js)
        location ~ ^.+\..+$ {
            try_files $uri =404;
        }
    location /app2/ {
                proxy_pass http://localhost:5000/;
                proxy_http_version 1.1;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection 'upgrade';
                proxy_set_header Host $host;
                proxy_cache_bypass $http_upgrade;
        }
        location ^~ /socket.io/ {
               try_files $uri @node-js-myapp;
        }
        location @node-js-myapp {
               proxy_set_header X-Real-IP  $remote_addr;
               proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
               proxy_set_header Host $http_host;
               proxy_pass  http://node-js-myapp;
       }

    listen [::]:443 ssl ipv6only=on; # managed by Certbot
        listen 443 ssl; # managed by Certbot
        ssl_certificate /etc/letsencrypt/live/subdomain.example.com/fullchain.pem; # managed by Certbot
        ssl_certificate_key /etc/letsencrypt/live/subdomain.example.com/privkey.pem; # managed by Certbot
        include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
        ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot
}
}

反应Js

import socketIOClient from 'socket.io-client';
const socket = socketIOClient(
  'wss://subdomain.example.com',
  { transports: ['websocket'] }
);
socket.on('socketToMe', function (data) {
  console.log(data);
  socket.emit('ABC', "abcdef");
});

Node Express

var createError = require('http-errors');
var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');
var logger = require('morgan');

var indexRouter = require('./routes/index');
var usersRouter = require('./routes/users');

var app = express();

var server = require('http').Server(app);
var io = require('socket.io')(server);

io.on('connection', function(socket) {
 console.log("Con");

socket.on("ABC", (data) => {
 console.log(data);
 io.sockets.emit('socketToMe', "test test");
})
socket.on('disconnect', () => {
 console.log('user disconnected')
})
})

Answer 1

Socket.io 不是是用于连接到Websocket客户端。阅读更多here。您将需要使用Websocket客户端以及Socket.io客户端来广播数据。

Socket.IO不是WebSocket实现。尽管Socket.IO确实确实在可能的情况下使用WebSocket作为传输工具，但它会向每个数据包添加一些元数据：当需要消息确认时，数据包类型，名称空间和数据包ID。因此，WebSocket客户端将无法成功连接到Socket.IO服务器，而Socket.IO客户端也将无法连接到WebSocket服务器。

无法建立WebSocket连接-React js + Node Express + Nginx

1 个答案: