配置之前需要知道ws协议和wss协议的区别

一、WS 和 WSS 的区别

WebSocket 协议是 html5 的一种通信协议，可以使客户端和服务端双向数据传输更加简单快捷，并且在 TCP 连接进行一次握手后，就可以持久性连接，同时允许服务端对客户端推送数据。

WS 协议和 WSS 协议均是 WebSocket 协议的 SCHEM。也是统⼀的资源标志符。WS是非安全的，没有证书；WSS是安全的，需要SSL证书。

WS 一般默认是 80 端口，而 WSS 默认是 443 端口，大多数网站用的就是 80 和 433 端口。

http 协议下使用 WS，在 https 协议下使用 WSS。

WebSocket协议的特点：

建立在 TCP 协议之上，服务端实现容易；

与 HTTP 协议有良好的兼容性，握手时不容易被屏蔽，可以通过各种 HTTP 代理服务器；

数据轻量，实时通讯；

可以发送文本和二进制数据；

不限制同源，客户端可以与任意服务器端进行通讯。

二、Nginx 下配置 WS

WS 配置

server {
     listen 8001;

     location / {
			 proxy_pass http://192.168.188.126:9007;
			 proxy_http_version 1.1;
			 proxy_set_header Upgrade $http_upgrade;
			 proxy_set_header Connection "Upgrade";
		 }
}

但是在测试的话会有单独的路径，刚开始我的配置是这个样子：

location /ws/ {
			proxy_pass http://127.0.0.1:9007;
			proxy_http_version 1.1;
			proxy_set_header Upgrade $http_upgrade;
			proxy_set_header Connection "Upgrade";
		 }

访问socket的时候的路径为：

前端连接的时候：

但是一直报错：

我在想，访问/ws的时候将请求代理到127.0.0.1:9007
，那 /ws/webSocket就应该转发到127.0.0.1:9007/ws/webSocket

突然发现，多了个前缀有木有，我在服务器路径为：/webSocket

修改：

第二天在帖子上看到一句话：

rewrite ^/api/(.*)$ /$1 break;

这句话的含义就是：

rewrite “^/api/(.)$” /$1 break，路径重写：
“^/api/(.)$”：匹配路径的正则表达式，用了分组语法，把/api/以后的所有部分当做1组
/$1：重写的目标路径，这里用$1引用前面正则表达式匹配到的分组（组编号从1开始），即/api/后面的所有。这样新的路径就是除去/api/以外的所有，就达到了去除/api前缀的目的
break：指令，常用的有2个，分别是：last、break
last：重写路径结束后，将得到的路径重新进行一次路径匹配
break：重写路径结束后，不再重新匹配路径。

= : 用于不含正则表达式的 uri 前，要求请求字符串与 uri 严格匹配，如果匹配成功，就停止继续向下搜索并立即处理该请求。
~ : 用于表示 uri 包含正则表达式，并且区分大小写。
~* : 用于表示 uri 包含正则表达式，并且不区分大小写。
^~ : 用于不含正则表达式的 uri 前，要求 Nginx 服务器找到标识 uri 和请求字符串匹配度最高的 location 后，立即使用此 location 处理请求，而不再使用 location 块中的正则 uri 和请求字符串做匹配。

配置这句话就可以去掉路径：

location /ws/ {
     rewrite ^/ws/(.*)$ /$1 break;
     proxy_pass http://1.116.37.17:9007;
     proxy_http_version 1.1;
     proxy_set_header Upgrade $http_upgrade;
     proxy_set_header Connection "Upgrade";
  }

服务区只使用/webSocket就可以了

三、Nginx 下配置 WSS

WSS 配置

server {
     listen 443 ssl;
     server_name im-wss-api.xxx.xxx;
     ssl_certificate ../cert/server.crt;
     ssl_certificate_key ../cert/server.key;
     ssl_session_timeout 5m;
     ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
     ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE;
     ssl_prefer_server_ciphers on;

     location / {
         proxy_pass http://localhost:8088;
         proxy_http_version 1.1;
         proxy_set_header Upgrade $http_upgrade;
         proxy_set_header Connection "Upgrade";
     }
}

我使用的是ws协议，配置完成之后：

连接成功！