How to open wss: or ws: port on my website?

Question

I am using Ratchet-lib/socketo.me as a websocket for my chatting app. When I put localhost:8080 it works perfectly.

How can I put my wesbite as wss:// when I publish the app online? How to open port pr smthg?

This is the connection code :

$(document).ready(function(){
   update_chat_history_data();
    var conn = new WebSocket('wss://localhost:8080');
conn.onopen = function(e) {
    console.log("Connection established!");
};

I want to change var conn = new WebSocket('wss://localhost:8080'); with var conn = new WebSocket('wss://mywebsite:port');

Thanks

Answer 1

If you are using nginx in your production environment and it has by default ssl enabled meaning (https). Than you can do reverse proxy to your ratchet server.

upstream websocketserver {
    server ratchet:8080;
} 

server {

listen 443 ssl;
#you main domain configuration

location /ws/ {
            proxy_pass http://websocketserver;
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "upgrade";
            proxy_set_header Host $host;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header X-Forwarded-Proto https;
            proxy_read_timeout 86400; # neccessary to avoid websocket timeout disconnect
            proxy_redirect off;
    }

}

Than you will be able to use ratchet url like: wss://yourdomain.com/ws

This is how it works with nginx but I guss is same with apache or some other web server. Just do reverse proxy!