webSocket(wss)出现连接失败的问题解决方法

前言

前段时间用Letsencrypt提供一个称为certbot的工具,生成了HTTPS证书
升级https后,原先的websocket项目不能有效运行了。。。。

相关技术:linux(centos7.9)/nginx/websocket
1.这是升级https后的nginx配置

server {
        server_name 你的域名;
        location / {
                root /www/client/WebSocket-master/src;
                index client1.html;
        }

        location /chat/ {
                root /www/client/WebSocket-master/src;
                index client2.html;
        }

    listen 443 ssl; # managed by Certbot
    ssl_certificate 改为自己申请得到的 crt 文件路径; # managed by Certbot
    ssl_certificate_key 改为自己申请得到的 key 文件路径; # 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 = 你的域名) {
        return 301 https://$host$request_uri;
    } # managed by Certbot


        listen 80;
        server_name 你的域名;
    return 404; # managed by Certbot


}

2.这是websocket服务升级https之前,使用ws连接发生的错误

这是升级https之前,使用ws连接发生的错误


3.这是将连接方式改为wss后的报错

ws = new WebSocket('wss://ip:端口');

这是将连接方式改为wss后的报错


4.需要更改nginx配置和websocket连接方式

ws = new WebSocket('wss://域名');
server {
        server_name 你的域名;
        location / {
                root /www/client/WebSocket-master/src;
                index client1.html;
                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   $scheme;
                proxy_pass        你需要代理的地址;

                # 关键配置 start
                proxy_http_version 1.1;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection "upgrade";
                # 关键配置 end
        }

        location /chat/ {
                root /www/client/WebSocket-master/src;
                index client2.html;
                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   $scheme;
                proxy_pass 你需要代理的地址;

                # 关键配置 start
                proxy_http_version 1.1;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection "upgrade";
                # 关键配置 end
        }

    listen 443 ssl; # managed by Certbot
    ssl_certificate 改为自己申请得到的 crt 文件路径; # managed by Certbot
    ssl_certificate_key 改为自己申请得到的 key 文件路径; # 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 = 你的域名) {
        return 301 https://$host$request_uri;
    } # managed by Certbot


        listen 80;
        server_name 你的域名;
    return 404; # managed by Certbot


}

5.改完步骤4的内容后重启服务
重启nginx

nginx -s reload

重启node-websocket服务

pm2 restart 服务名称或id

6.完成升级后的聊天

在这里插入图片描述


在这里插入图片描述


参考:
Nginx反向代理WebSocket服务连接报错:WebSocket connection to “wss://xxx/xxx” failed
webSocket(wss)出现连接失败的问题解决方法
nginx配置https以及websocket

相关文章

文章浏览阅读3.7k次,点赞2次,收藏5次。Nginx学习笔记一、N...
文章浏览阅读1.7w次,点赞14次,收藏61次。我们在使用容器的...
文章浏览阅读1.4k次。当用户在访问网站的过程中遇到404错误时...
文章浏览阅读2.7k次。docker 和 docker-compose 部署 nginx+...
文章浏览阅读1.3k次。5:再次启动nginx,可以正常启动,可以...
文章浏览阅读3.1w次,点赞105次,收藏182次。高性能:Nginx ...