search

socketio / socket.io

Realtime application framework (Node.JS server)
https://socket.io
MIT License
61.17k stars 10.11k forks source link

sockjs-node errors #3540

Closed marcoippolito closed 3 years ago

marcoippolito commented 4 years ago

I just created a tiny test app with vue cli, so without adding anything, apart from what the empty vue-cli scaffolding brings.

(base) marco@pc:~/vueMatters/testproject$ npm run serve

testproject@0.1.0 serve /home/marco/vueMatters/testproject
vue-cli-service serve

INFO Starting development server... 98% after emitting CopyPlugin

DONE Compiled successfully in 1409ms 8:14:46 PM

With this /etc/nginx/conf.d/default.conf : 

server {
    listen 443 ssl http2 default_server;
    server_name ggc.world;

    ssl_certificate /etc/ssl/certs/chained.pem;
    ssl_certificate_key /etc/ssl/private/domain.key;
    ssl_session_timeout 5m;
    ssl_protocols TLSv1 TLSv1.1 TLSv1.2 TLSv1.3;
    ssl_ciphers EECDH+CHACHA20:EECDH+CHACHA20-draft:EECDH+AES128:RSA+AES128:EECDH+AES256:RSA+AES256:EECDH+3DES:RSA+3DES:!MD5;
    ssl_prefer_server_ciphers on;
    ssl_session_cache shared:SSL:50m;
    ssl_dhparam /etc/ssl/certs/dhparam.pem;
    #ssl_stapling on;
    #ssl_stapling_verify on;

    access_log /var/log/nginx/ggcworld-access.log combined;

    add_header Strict-Transport-Security "max-age=31536000";
    location = /favicon.ico { access_log off; log_not_found off; }
    location / {
        proxy_pass http://127.0.0.1:8080;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
    }
}

server {
    listen 80 default_server;
    listen [::]:80 default_server;
    error_page 497 https://$host:$server_port$request_uri;
    server_name www.ggc.world;
    return 301 https://$server_name$request_uri;

    access_log /var/log/nginx/ggcworld-access.log combined;

    add_header Strict-Transport-Security "max-age=31536000";
    location = /favicon.ico { access_log off; log_not_found off; }
    location / {
        proxy_pass http://127.0.0.1:8080;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
    }
}

# https://www.nginx.com/blog/nginx-nodejs-websockets-socketio/
# https://gist.github.com/uorat/10b15a32f3ffa3f240662b9b0fefe706
# http://nginx.org/en/docs/stream/ngx_stream_core_module.html

upstream websocket {
    ip_hash;
    server localhost:3000;
}

server {
    listen       81;
    server_name  ggc.world www.ggc.world;

    #location / {
    location ~ ^/(websocket|websocket\/socket-io) {
        proxy_pass http://127.0.0.1:4201;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
        proxy_set_header X-Forwared-For $remote_addr;
        proxy_set_header Host $host;

        proxy_redirect off;
        proxy_set_header X-Real-IP $remote_addr;
     }

}
# https://stackoverflow.com/questions/40516288/webpack-dev-server-with-nginx-proxy-pass

with vue.config.js : 

module.exports = {
  // options...
  publicPath: '',
  devServer: {
    host: 'localhost',
  }
}

and with this webpack.config.js : 

{
    "mode": "development",
    "entry": [
        "src/index.js",
        "webpack-dev-server/client?http://" + require("os").hostname() + ":3000/" 
    ],
    "output": {
        "path": __dirname+'/static',
        "filename": "[name].[chunkhash:8].js"
    },
    "module": {
        "rules": [
            {
                "test": /\.vue$/,
                "exclude": /node_modules/,
                "use": "vue-loader"
            },
            {
                "test": /\.pem$/,
                "use": "file-loader"
            }
        ]
    },
    plugins: [
        new BrowserSyncPlugin(
            {
                host: 'localhost',
                port: 3000,
                proxy: 'http://localhost:8080'
            },
            {
                reload: false
            }
        ),
    ],
    node: {
        __dirname: false,
        __filename: false
    },
    resolve: {
        extension: ['*', '.pem']
    },
    devServer: {
        watchOptions: {
            aggregateTimeout: 300,
            poll: 1000
        }
    }
}

Get this error message:

GET https://localhost/sockjs-node/info?t=1580397983088 net::ERR_CONNECTION_REFUSED

sockejsError13

Network Tab in the browser:

sockejsError-NetworkTab-16

PS-Ddevil commented 4 years ago

Does the same output is generated if you use non-secure protocol (http) ?

marcoippolito commented 4 years ago

@PS-Ddevil I didn't directly create a SockJS object myself. I just created a tiny test app with vue cli, so without adding anything, apart from what the empty vue-cli scaffolding brings.

(base) marco@pc:~/vueMatters/testproject$ npm run serve

testproject@0.1.0 serve /home/marco/vueMatters/testproject
vue-cli-service serve

INFO Starting development server... 98% after emitting CopyPlugin

DONE Compiled successfully in 1409ms 8:14:46 PM . I update my question above with more info

PS-Ddevil commented 4 years ago

@marcoippolito see if this helps in your case. https://github.com/webpack/webpack-dev-server/issues/416