nginx配置ws wss 和http https和访问实例

网上有很多文章都写怎么配置，但是很多都是wss连不上的，经过摸索了很久才把wss调通，然后顺便把ws http https整合进来。

1.需要准备清单列表：websocket服务端一个，websocket客户端一个，node.js服务端一个，安装nginx。

2.配置文件分析

2.1.第一个server配置文件， http ,ws关键配置讲解

端口 listen 80;这里http和ws都用用80端口，可以根据实际情况更改。

location / {#http 这个是http的配置信息，proxy_pass http://127.0.0.1:3000;#代理nodejs服务

location /ws{#ws 这个是ws的配置信息，proxy_pass http://你的域名;

server {#httplisten       80;server_name  localhost;#charset koi8-r;#access_log  logs/host.access.log  main;location / {#httpproxy_set_header X-Real-IP $remote_addr;proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;proxy_set_header Host  $http_host;proxy_set_header X-Nginx-Proxy true;proxy_set_header Connection "";proxy_pass http://127.0.0.1:3000;#代理nodejs服务proxy_redirect default;#root   html;#index  index.html index.htm;}location /ws{#wsproxy_http_version 1.1;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-Nginx-Proxy true;proxy_redirect off;client_max_body_size 10m;proxy_pass http://你的域名;proxy_set_header Upgrade $http_upgrade;proxy_set_header Connection "upgrade";proxy_connect_timeout 300s;proxy_read_timeout 300s;proxy_send_timeout 300s; }}

2.2.第二个server配置文件， https ,wss关键配置讲解

端口443listen 443 ssl http2;#默认不要改。

ssl_certificate C:/certificate/xxxx.pem;#证书文件
ssl_certificate_key C:/certificate/xxx.key;#证书文件

location / {#https 这个是https的配置信息，proxy_pass http://127.0.0.1:3000;#代理nodejs服务

location /ws{#wss 这个是wss的配置信息，proxy_pass http://你的域名;

server {#wss httpslisten 443 ssl http2;server_name localhost;ssl_certificate      C:/certificate/xxx.pem;ssl_certificate_key  C:/certificate/xxx.key;ssl_protocols TLSV1.1 TLSV1.2 SSLv2 SSLv3;ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;location ~ ^/(css/|fonts/|images/|js/){root /root/project/***/public;access_log off;expires 10d;}location /ws{#wssproxy_http_version 1.1;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-Nginx-Proxy true;proxy_redirect off;client_max_body_size 10m;proxy_pass http://你的域名;proxy_set_header Upgrade $http_upgrade;proxy_set_header Connection "upgrade";proxy_connect_timeout 300s;proxy_read_timeout 300s;proxy_send_timeout 300s; }location / {#httpsproxy_pass     http://127.0.0.1:3000;proxy_set_header   X-Real-IP $remote_addr;}error_page   500 502 503 504  /50x.html;location = /50x.html {root   html;}}

2.3ws wss负载均衡配置

这里配置了两个ws wss服务，端口为3001 3002，根据实际情况可以配置更多，加在下面即可，当3001端口连满，自动连到3002端口。

注意共出现3次“你的域名”，这三个地方域名一样。

upstream 你的域名 {server 127.0.0.1:3001;server 127.0.0.1:3002;keepalive 3000;}

3.完整nginx.conf文件代码参考

#user  nobody;
worker_processes  1;#error_log  logs/error.log;
#error_log  logs/error.log  notice;
#error_log  logs/error.log  info;#pid        logs/nginx.pid;events {worker_connections  1024;
}http {server {#httplisten       80;server_name  localhost;#charset koi8-r;#access_log  logs/host.access.log  main;location / {proxy_set_header X-Real-IP $remote_addr;proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;proxy_set_header Host  $http_host;proxy_set_header X-Nginx-Proxy true;proxy_set_header Connection "";proxy_pass http://127.0.0.1:3000;proxy_redirect default;#root   html;#index  index.html index.htm;}location /ws{#wsproxy_http_version 1.1;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-Nginx-Proxy true;proxy_redirect off;client_max_body_size 10m;proxy_pass http://nonghua.top;proxy_set_header Upgrade $http_upgrade;proxy_set_header Connection "upgrade";proxy_connect_timeout 300s;proxy_read_timeout 300s;proxy_send_timeout 300s; }#error_page  404              /404.html;# redirect server error pages to the static page /50x.html#error_page   500 502 503 504  /50x.html;location = /50x.html {root   html;}# proxy the PHP scripts to Apache listening on 127.0.0.1:80##location ~ \.php$ {#    proxy_pass   http://127.0.0.1;#}# pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000##location ~ \.php$ {#    root           html;#    fastcgi_pass   127.0.0.1:9000;#    fastcgi_index  index.php;#    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;#    include        fastcgi_params;#}# deny access to .htaccess files, if Apache's document root# concurs with nginx's one##location ~ /\.ht {#    deny  all;#}}upstream nonghua.top {server 127.0.0.1:3001;server 127.0.0.1:3002;keepalive 3000;}server {#wss httpslisten 443 ssl http2;server_name localhost;ssl_certificate      C:/certificate/nonghua.top.pem;ssl_certificate_key  C:/certificate/nonghua.top.key;ssl_protocols TLSV1.1 TLSV1.2 SSLv2 SSLv3;ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;location ~ ^/(css/|fonts/|images/|js/){root /root/project/***/public;access_log off;expires 10d;}location /ws{#wssproxy_http_version 1.1;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-Nginx-Proxy true;proxy_redirect off;client_max_body_size 10m;proxy_pass http://nonghua.top;proxy_set_header Upgrade $http_upgrade;proxy_set_header Connection "upgrade";proxy_connect_timeout 300s;proxy_read_timeout 300s;proxy_send_timeout 300s; }location / {#httpsproxy_pass     http://127.0.0.1:3000;proxy_set_header   X-Real-IP $remote_addr;}#error_page  404              /404.html;# redirect server error pages to the static page /50x.html#error_page   500 502 503 504  /50x.html;location = /50x.html {root   html;}}
}

4.websocket服务端代码参考


var ws = require("nodejs-websocket")
var PORT=8001;
var clientCount=0;
// Scream server example: "hi" -> "HI!!!"
var server = ws.createServer(function (conn) {console.log("New connection");clientCount++;conn.nickname='user'+clientCount;//通知所有人，有人进入群聊broadcast(conn.nickname+' come in');conn.on("text", function (str) {console.log("Received "+str)broadcast(conn.nickname+' : '+str)})conn.on("close", function (code, reason) {console.log("close");broadcast(conn.nickname+"left")})conn.on("error",function (err) {console.log("handle err");console.log(err)})
}).listen(PORT);
console.log('websocket server listening on port '+PORT)function broadcast(str){server.connections.forEach((connection)=>{connection.sendText(str);})
}

5.websocket客户端代码参考

ws连接：'ws://nongua.top/ws'

wss连接：'wss://nongua.top/ws'

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>WebSocket</title>
</head>
<body><h1>WebSocket 测试</h1><input id="sendTxt" type="text"><button id="sendBtn">发送</button><div id="recv"></div><script>var websocket=new WebSocket('wss://nongua.top/ws');websocket.onopen=function () {console.log('websocket open');document.getElementById('recv').innerHTML='connect';document.getElementById('sendBtn').onclick=function () {var val=document.getElementById('sendTxt').value;websocket.send(val);}}websocket.onclose=function () {console.log('websocket close')var div=document.createElement("DIV");document.getElementById('recv').appendChild(div)div.innerHTML='close'}websocket.onmessage=function (e) {console.log(e.data);var div=document.createElement("DIV");document.getElementById('recv').appendChild(div)div.innerHTML=e.data}</script>
</body>
</html>

参考文章https://blog.csdn.net/linshizhan/article/details/79581008

nginx配置ws wss 和http https和访问实例相关推荐

Nginx配置WS、WSS域名
文章目录一.Nginx配置WS 二.Nginx配置WSS 一.Nginx配置WS WS的全称是WebSocket,Nginx配置WebSocket也比较简单,只需要在nginx.conf文件中进行相 ...
Nginx配置http301强制跳转https
Nginx配置http301强制跳转https http强制跳转到https 在nginx配置文件内添加: if ($scheme = http) {return 301 https://$serve ...
Nginx去配置socket的时候，发现nginx没有配置ws/wss协议，配置步骤如下
配置之前需要知道ws协议和wss协议的区别一.WS 和 WSS 的区别 WebSocket 协议是 html5 的一种通信协议,可以使客户端和服务端双向数据传输更加简单快捷,并且在 TCP 连接进行 ...
Nginx配置WS代理
本文背景如下: Vue+SpringBoot 前后端分离,vue采用Nginx作为服务,涉及内外网使用的场景. 技术使用:Stomp 和 rabbitMQ Nginx增加如下配置: http {map ...
nginx配置http自动跳转https方案
功能:ssl配置后的301跳转,http跳转到https 描述:利用rewrite方式301永久跳转到https 注意:需先配置好ssl证书,这篇文章说的也是在ssl证书部署后进行301重定向的方式. ...
nginx配置多个一级域名https访问的配置
首先已有两个域名 www.test1.com ,www.test2.com nginx的安装略过 1.在nginx安装目录下创建cert目录在Nginx的安装目录下创建cert目录 2.在cert目 ...
Nginx配置同时支持http和https两种方式访问
http: https: Nginx的ssl模块安装进入到目录的sbin目录下,输入 #注意这里是大写的V,小写的只显示版本号 ./nginx -V 如果出现 (configure argument ...
nginx配置ws请求
map $http_upgrade $connection_upgrade {default keep-alive; #默认为keep-alive 可以支持一般http请求'websocket' u ...
nginx配置ws反向代理
location /wss {proxy_pass http://127.0.0.1:8989;#代理到上面的地址去,proxy_http_version 1.1;proxy_set_header U ...

nginx配置ws wss 和http https和访问实例

nginx配置ws wss 和http https和访问实例相关推荐

最新文章

热门文章