Join Log in
Score:0
avatar Server

HTTPS breaks Socket.io connection

ch flag
Pauli Isoaho

Fault description
I have in my test environment Rasa chatbots running in docker containers. Chatbot's fronted is a Botfront webchat widget in a website served by Apache2 in same server. I also installed Nginx as reverse proxy which then serves Apache virtual domains. Chatbot works directly from Apache http://testibotti2.omnia.fi:444/ and also via reverse proxy http://testibotti2.omnia.fi/ but when using https it fails i.e. chatbot widget is not shown https://testibot1.omnia.fi/

My environment

Server version: Apache/2.4.41 (Ubuntu)  
nginx version: nginx/1.18.0 (Ubuntu  
Ubuntu 18.04  
Docker version 20.10.9, build c2ea9bc  
docker-compose version 1.29.2, build 5becea4c

Config files

Nginx reverse proxy (I have commented out testibotti2 SSL part for testing purposes)

server {

   #root /var/www/html/;
   #index index.html index.htm;

   server_name testibot1.omnia.fi;
   #server_name 127.0.0.1
   index index.php index.html index.htm index.nginx-debian.html;
   root /var/www/public_html/testibot1;

   location \ {

   proxy_pass http://testibot1.omnia.fi:444;
   proxy_set_header X-Real-IP $remote_addr;
   proxy_set_header X-Forwarded-For $remote_addr;
   proxy_set_header Host $host;  
   # I have tried these parameters below but no success
   #proxy_redirect     off;
   #proxy_set_header X-Forwarded-Proto https;
   #proxy_set_header X-Forwarded-Proto $scheme;  
   # also these parameters I added after SSL installed, no success
   proxy_http_version 1.1;
   proxy_set_header Upgrade $http_upgrade;
   proxy_set_header Connection "upgrade";

   }

   access_log      /var/log/nginx/testibot1.fi_access.log;
   error_log       /var/log/nginx/testibot1.fi_error.log;


   listen 443 ssl; # managed by Certbot
   ssl_certificate /etc/letsencrypt/live/testibot1.omnia.fi/fullchain.pem; # managed by Certbot
   ssl_certificate_key /etc/letsencrypt/live/testibot1.omnia.fi/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

}

server {

   #root /var/www/html/;
   #index index.html index.htm;

   server_name testibotti2.omnia.fi;
   #server_name 127.0.0.1
   index index.php index.html index.htm index.nginx-debian.html;
   root /var/www/public_html/testibotti2;

   location \ {

   proxy_set_header X-Real-IP $remote_addr;
   proxy_set_header X-Forwarded-For $remote_addr;
   proxy_set_header Host $host;
   proxy_pass http://testibotti2.omnia.fi:444;
   }

   access_log      /var/log/nginx/testibotti2.fi_access.log;
   error_log       /var/log/nginx/testibotti2.fi_error.log;


#   listen 443 ssl; # managed by Certbot
#   ssl_certificate /etc/letsencrypt/live/testibot1.omnia.fi/fullchain.pem; # managed by Certbot
#   ssl_certificate_key /etc/letsencrypt/live/testibot1.omnia.fi/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

}

server {
    if ($host = testibot1.omnia.fi) {
        return 301 https://$host$request_uri;
    } # managed by Certbot


   listen 80;

   server_name testibot1.omnia.fi;
    return 404; # managed by Certbot


}

#server {
#    if ($host = testibotti2.omnia.fi) {
#        return 301 https://$host$request_uri;
#    } # managed by Certbot


#   listen 80;

#   server_name testibotti2.omnia.fi;
#   return 404; # managed by Certbot


#}

Botfront webchat widget configuration

<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/lib/index.min.js"></script>
    <link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
Testisaitti 1
<div id="webchat"></div>
<script>
  WebChat.default.init({
    showFullScreenButton: true,
    selector: "#webchat",
    initPayload: "/tervetuloa",
    customData: {"language": "fi"}, // arbitrary custom data. Stay minimal as this will be added to the socket
    socketUrl: "http://testibot1.omnia.fi:5006",
    socketPath: "/socket.io/",
    embedded: false,
    title: "AsPa botti",
    subtitle: "Testibotti 1",
    inputTextFieldHint: "Vastaa kysymyksiin",
    profileAvatar:"robot_icon.png",
    params: {"storage": "session"} // can be set to "local"  or "session". details in storage section.
  })
</script>

</body>
</html>

This error I see on browser debug window

Mixed Content: The page at '<URL>' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint '<URL>'. This request has been blocked; the content must be served over HTTPS.

Nginx error log

paulii@vetbot7:/var/www/public_html/testibot1$ sudo tail -f /var/log/nginx/testibot1.fi_error.log
[sudo] password for paulii:
2021/10/18 10:04:50 [error] 3469367#3469367: *60 open() "/var/www/public_html/testibot1/omnia.fi.db" failed (2: No such file or directory), client: 89.248.173.145, server: testibot1.omnia.fi, request: "GET /omnia.fi.db HTTP/1.1", host: "testibot1.omnia.fi"
2021/10/18 10:04:50 [error] 3469367#3469367: *60 open() "/var/www/public_html/testibot1/omnia.fi.sqlite" failed (2: No such file or directory), client: 89.248.173.145, server: testibot1.omnia.fi, request: "GET /omnia.fi.sqlite HTTP/1.1", host: "testibot1.omnia.fi"
2021/10/18 10:05:26 [error] 3469367#3469367: *66 open() "/var/www/public_html/testibot1/favicon.ico" failed (2: No such file or directory), client: 91.153.58.139, server: testibot1.omnia.fi, request: "GET /favicon.ico HTTP/1.1", host: "testibot1.omnia.fi", referrer: "https://testibot1.omnia.fi/"
2021/10/18 10:05:52 [crit] 3469367#3469367: *81 SSL_do_handshake() failed (SSL: error:141CF06C:SSL routines:tls_parse_ctos_key_share:bad key share) while SSL handshaking, client: 35.203.251.54, server: 0.0.0.0:443
2021/10/18 10:05:54 [crit] 3469367#3469367: *90 SSL_do_handshake() failed (SSL: error:141CF06C:SSL routines:tls_parse_ctos_key_share:bad key share) while SSL handshaking, client: 107.178.200.215, server: 0.0.0.0:443
2021/10/18 10:07:15 [crit] 3469367#3469367: *103 SSL_do_handshake() failed (SSL: error:141CF06C:SSL routines:tls_parse_ctos_key_share:bad key share) while SSL handshaking, client: 107.178.237.2, server: 0.0.0.0:443
2021/10/18 11:31:10 [error] 3470484#3470484: *2 open() "/var/www/public_html/testibot1/5007" failed (2: No such file or directory), client: 91.153.58.139, server: testibot1.omnia.fi, request: "GET /5007 HTTP/1.1", host: "testibotti2.omnia.fi"
2021/10/18 11:31:12 [error] 3470484#3470484: *2 open() "/var/www/public_html/testibot1/5007" failed (2: No such file or directory), client: 91.153.58.139, server: testibot1.omnia.fi, request: "GET /5007 HTTP/1.1", host: "testibotti2.omnia.fi"
2021/10/18 11:31:21 [error] 3470484#3470484: *2 open() "/var/www/public_html/testibot1/5007" failed (2: No such file or directory), client: 91.153.58.139, server: testibot1.omnia.fi, request: "GET /5007 HTTP/1.1", host: "testibotti2.omnia.fi"
2021/10/18 11:32:21 [error] 3470484#3470484: *3 open() "/var/www/public_html/testibot1/favicon.ico" failed (2: No such file or directory), client: 91.153.58.139, server: testibot1.omnia.fi, request: "GET /favicon.ico HTTP/1.1", host: "testibotti2.omnia.fi", referrer: "https://testibotti2.omnia.fi/"
396
0 + 0
Score:0
avatar Server
ch flag
Pauli Isoaho

I got it working

this is needed in Ngingx reverse proxy config file

server {


   server_name testibot1.omnia.fi;
   index index.php index.html index.htm index.nginx-debian.html;
   root /var/www/public_html/testibot1;

   location / {

   proxy_pass http://testibot1.omnia.fi:444;
   proxy_set_header X-Real-IP $remote_addr;
   proxy_set_header X-Forwarded-For $remote_addr;
   proxy_set_header Host $host;

   }

   location /socket.io/ {
   proxy_pass http://testibot1.omnia.fi:5006/socket.io/;
   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;
   }

and this is needed in webpage

socketUrl: "https://testibot1.omnia.fi",

Big thanks Alexander Tarasov! Your idea lead me to the right path and after tens of tries I found right combination

0 + 0
Score:0
avatar Server
de flag
Alexander Tarasov

The cause of the issue is literally printed in the browser's developer console:

detailed error message

Therefore, you need to make XHR requests happening over HTTPS connection.

You probably want to add another location to the nginx configuration:

location /socket.io {
   proxy_pass http://localhost:5006;
}

while also changing the URL in the frontend configuration:

    socketUrl: "https://testibot1.omnia.fi",
0 + 0
ch flag
Pauli Isoaho
Thanks, I added this to Nginx config, I think this "/" should be this "\" server { location \socket.io { proxy_pass http://localhost:5006; } } and this to index.html //socketUrl: "http://testibot1.omnia.fi:5006", socketUrl: "https://testibot1.omnia.fi", But still not working, this error message now GET https://testibot1.omnia.fi/socket.io/?EIO=3&transport=polling&t=NoJZNCe 404 (Not Found)
0
Reply
de flag
Alexander Tarasov
Did you reload nginx? Also, it usually makes sense to do sanity check via `nginx -t`
0
Reply
de flag
Alexander Tarasov
Still, I am not sure that you should use backslash (\\). For path delimiters, you should use forward slashes (http://nginx.org/en/docs/beginners_guide.html), and the backslash is usually used to escape special characters.
0
Reply
ch flag
Pauli Isoaho
paulii@vetbot7:/etc/nginx/sites-available$ sudo nginx -t nginx: the configuration file /etc/nginx/nginx.conf syntax is ok nginx: configuration file /etc/nginx/nginx.conf test is successful paulii@vetbot7:/etc/nginx/sites-available$ sudo systemctl reload nginx paulii@vetbot7:/etc/nginx/sites-available$ sudo systemctl restart nginx paulii@vetbot7:/etc/nginx/sites-available$
0
Reply
ch flag
Pauli Isoaho
I tried with "/" and not working. This is error now "Failed to load resource: the server responded with a status of 404 (Not Found)"
0
Reply
djdomi avatar
za flag
djdomi
dont tell its not working, update the question and show us the new configuration ;)
0
Reply
ch flag
Pauli Isoaho
What you mean? It is not working!
0
Reply
ธงชาติไทย
Elon Musk
I sit in a Tesla and translated this thread with Ai:

mangohost

Post an answer

Most people don’t grasp that asking a lot of questions unlocks learning and improves interpersonal bonding. In Alison’s studies, for example, though people could accurately recall how many questions had been asked in their conversations, they didn’t intuit the link between questions and liking. Across four studies, in which participants were engaged in conversations themselves or read transcripts of others’ conversations, people tended not to realize that question asking would influence—or had influenced—the level of amity between the conversationalists.