ERR_CONNECTION / CORS Request did not succeed

I created a brand new tiny webapp 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

App running at:
- Local: localhost:8080
- Network: 192.168.1.7:8080

Note that the development build is not optimized.
To create a production build, run npm run build.

And got this error message : https://drive.google.com/open?id=10GcVFmqNVGRjox3wklJtcrAkIWM3kOp8

“GET https://localhost/sockjs-node/info?t=1580228998416 net::ERR_CONNECTION_REFUSED”

Using firefox as web browser, I get this error message: https://drive.google.com/open?id=1l6USIHrbHl6kBcQtormXplOgx0J653ko

“Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://localhost/sockjs-node/info?t=1580304400023. (Reason: CORS request did not succeed).”

Looking at Mozilla Developer explanation:

"What went wrong?

The HTTP request which makes use of CORS failed because the HTTP connection failed at either the network or protocol level. The error is not directly related to CORS, but is a fundamental network error of some kind.

In many cases, it is caused by a browser plugin (e.g. an ad blocker or privacy protector) blocking the request.

Other possible causes include:

Trying to access an https resource that has an invalid certificate will cause this error.
Trying to access an http resource from a page with an https origin will also cause this error.
As of Firefox 68, https pages are not permitted to access http://localhost, although this may be changed by Bug 1488740.
The server did not respond to the actual request (even if it responded to the Preflight request). One scenario might be an HTTP service being developed that panicked without returning any data.
"

Checked the TLS Certificates with https://www.digicert.com/help/ :
and the result is:
" TLS Certificate has not been revoked.
TLS Certificate expires soon. The primary TLS Certificate expires on February 28, 2020 (30 days remaining)
Certificate Name matches ggc.world
TLS Certificate is correctly installed "

So may be my nginx configuration has to be improved:

node --version
v12.10.0

npm -v
6.13.6

webpack-cli@3.3.10

Ubuntu 18.04.03 Server Edition

This is the /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 / {
        proxy_pass http://websocket;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header Host $host;
    }

    #location /socket.io/socket.io.js {
        # proxy_pass http://websocket;
     #}

}

How to improve the nginx configuration?

Request:

Server:

HTTPS = port 443
Server = port 8080 (possible HTTP - not sure)

Try, instead:
http://localhost:8080/sockjs-node/info?t=1580228998416
http://192.168.1.7:8080/sockjs-node/info?t=1580228998416
[one should connect]
Make sure one works FIRST - before proceeding.

Unfortunately it doesn’t work either… :

Sorry, just updated that post.
Try:
http://192.168.1.7:8080
does that connect?

No... unfortunately :

But if I digit https://ggc.world/ it does connect with those errors:

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

Then there is a fundamental connectivity problem between the services or systems.

First, and just for clarity, I would like to ensure that where you use “localhost” you are referring to the same (single) system.
OR are they two systems?
[be they physical or virtual - two means different IPs]

the nginx server and the testproject webapp are both on a PC with Ubuntu 18.04.03 Server Edition, where the PC has local address 192.168.1.7

but I’m connecting to the PC via ssh by a laptop with Ubuntu 18.04.03 Desktop Edition, whose local address is 192.168.1.4

Ok so all should be on 192.168.1.7 (server) system…

Please show (on server) the output of:
netstat -pant | grep -i listen

Thank you very much for helping.

(base) marco@pc:~/vueMatters/testproject$ netstat -pant | grep -i listen
(Not all processes could be identified, non-owned process info
will not be shown, you would have to be root to see it all.)
tcp 0 0 127.0.0.1:5432 0.0.0.0:* LISTEN -
tcp 0 0 127.0.0.1:5433 0.0.0.0:* LISTEN -
tcp 0 0 0.0.0.0:443 0.0.0.0:* LISTEN -
tcp 0 0 127.0.0.1:5984 0.0.0.0:* LISTEN -
tcp 0 0 127.0.0.1:5986 0.0.0.0:* LISTEN -
tcp 0 0 0.0.0.0:37677 0.0.0.0:* LISTEN -
tcp 0 0 0.0.0.0:111 0.0.0.0:* LISTEN -
tcp 0 0 0.0.0.0:80 0.0.0.0:* LISTEN -
tcp 0 0 0.0.0.0:4369 0.0.0.0:* LISTEN -
tcp 0 0 0.0.0.0:81 0.0.0.0:* LISTEN -
tcp 0 0 127.0.0.53:53 0.0.0.0:* LISTEN -
tcp 0 0 0.0.0.0:22 0.0.0.0:* LISTEN -
tcp6 0 0 ::1:5432 :::* LISTEN -
tcp6 0 0 ::1:5433 :::* LISTEN -
tcp6 0 0 :::2377 :::* LISTEN -
tcp6 0 0 :::7946 :::* LISTEN -
tcp6 0 0 :::111 :::* LISTEN -
tcp6 0 0 :::80 :::* LISTEN -
tcp6 0 0 :::4369 :::* LISTEN -
tcp6 0 0 :::22 :::* LISTEN -

Well there is no :8080 listener…
You need to start there.
Start the webapp process.

Also try it with sudo too (may show more):
sudo netstat -pant | grep -i listen

(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 871ms 4:27:05 PM

App running at:

Note that the development build is not optimized.
To create a production build, run npm run build.

Entered as root:

(base) marco@pc:~/vueMatters/testproject$ sudo su
[sudo] password for marco:
root@pc:/home/marco/vueMatters/testproject# netstat -pant | grep -i listen
tcp 0 0 127.0.0.1:5432 0.0.0.0:* LISTEN 995/postgres
tcp 0 0 127.0.0.1:5433 0.0.0.0:* LISTEN 996/postgres
tcp 0 0 0.0.0.0:443 0.0.0.0:* LISTEN 923/nginx: master p
tcp 0 0 127.0.0.1:5984 0.0.0.0:* LISTEN 1123/beam.smp
tcp 0 0 127.0.0.1:5986 0.0.0.0:* LISTEN 1123/beam.smp
tcp 0 0 0.0.0.0:37677 0.0.0.0:* LISTEN 1123/beam.smp
tcp 0 0 0.0.0.0:111 0.0.0.0:* LISTEN 806/rpcbind
tcp 0 0 127.0.0.1:8080 0.0.0.0:* LISTEN 22783/node
tcp 0 0 0.0.0.0:80 0.0.0.0:* LISTEN 923/nginx: master p
tcp 0 0 0.0.0.0:4369 0.0.0.0:* LISTEN 1151/epmd
tcp 0 0 0.0.0.0:81 0.0.0.0:* LISTEN 923/nginx: master p
tcp 0 0 127.0.0.53:53 0.0.0.0:* LISTEN 867/systemd-resolve
tcp 0 0 0.0.0.0:22 0.0.0.0:* LISTEN 1187/sshd
tcp6 0 0 ::1:5432 :::* LISTEN 995/postgres
tcp6 0 0 ::1:5433 :::* LISTEN 996/postgres
tcp6 0 0 :::2377 :::* LISTEN 1138/dockerd
tcp6 0 0 :::7946 :::* LISTEN 1138/dockerd
tcp6 0 0 :::111 :::* LISTEN 806/rpcbind
tcp6 0 0 :::80 :::* LISTEN 923/nginx: master p
tcp6 0 0 :::4369 :::* LISTEN 1151/epmd
tcp6 0 0 :::22 :::* LISTEN 1187/sshd

Much better.

Now try:
http://192.168.1.7:8080/
from server and from your PC

This site can’t be reached

192.168.1.7 refused to connect.

Can’t be reached from where?
Server? or PC?

from the web browser in laptop

Ok that is a firewall block - which is OK.
You don’t need to reach :8080 from your laptop, only form the server to the server itself.

On the server, try:
curl -Iki http://192.168.1.7:8080/

From within the server:

(base) marco@pc:~/vueMatters/testproject$ curl -Iki http://192.168.1.7:8080/
curl: (7) Failed to connect to 192.168.1.7 port 8080: Connection refused

WTH?
Is :8080 still listening?

Yes. It's still there. I didn't shutdown it:

(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 871ms 4:27:05 PM

App running at:

Note that the development build is not optimized.
To create a production build, run npm run build.