巴拉巴拉
小魔仙

微信小程序-nginx-https-wss-websocket

nginx 同时配置 https wss 双协议

http→https;

ws→wss;

注意:nginx 1.3以上版本才开始支持websocket的反向代理

微信小程序需要使用https以及wss,不带端口,也就是443端口

wss其实是http的升级协议,所以它们是可以共用一个端口的,所以我们这里可以利用nginx反向代理让他们都走443端口

# 安装

yum -y install git bc
yum install -y gcc-c++ pcre pcre-devel zlib zlib-devel openssl openssl-devel
wget https://nginx.org/download/nginx-1.11.6.tar.gz
tar zxvf nginx-1.11.6.tar.gz
./configure –user=root –group=root –prefix=/usr/local/nginx –with-http_stub_status_module –with-http_ssl_module –with-ipv6
make
make install

./nginx -V
./nginx -t
./nginx -c /usr/local/nginx/conf/nginx.conf
./nginx -s reload

首先我们要先把http升级为https请求,网上配置的有很多配置的教程和参考

 

需要SSL证书,这个SSL证书怎么申请以及获得不再累赘复述,反正肯定最后nginx用的证书是两个文件,一个*.key文件以及另外一个*.pem或者*.crt证书

例如微信小程序中http和ws请求:

https://wx.againfly.com/example?id=1

wss://wx.againfly.com/websocket

本地端口服务:

web服务:tomcat,端口:8080

websocket服务:netty,端口7979

这里给出nginx的ngxin.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 {
    include       mime.types;
    default_type  application/octet-stream;

    #log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
    #                  '$status $body_bytes_sent "$http_referer" '
    #                  '"$http_user_agent" "$http_x_forwarded_for"';

    #access_log  logs/access.log  main;

    sendfile        on;
    #tcp_nopush     on;

    #keepalive_timeout  0;
    keepalive_timeout  65;

    #gzip  on;

    upstream websocket {
        server localhost:7979; #本地websocket反向代理地址
    }
    upstream web{
        server localhost:8080; #本地web反向代理地址
    }
    map $http_upgrade $connection_upgrade {
        default upgrade;
        '' close;
    }

    server {
        listen       443;
        server_name  wx.againfly.com;

        ssl on;
        #你的上传到服务器的证书位置
        ssl_certificate /usr/local/nginx/conf/server.pem;
        #你的上传到服务器的证书位置
        ssl_certificate_key /usr/local/nginx/conf/server.key;

        ssl_session_timeout 5m;
        ssl_session_cache shared:SSL:50m;
        ssl_protocols TLSV1.1 TLSV1.2 SSLv2 SSLv3;
        ssl_ciphers ALL:!ADH:!EXPORT56:RC4+RSA:+HIGH:+MEDIUM:+LOW:+SSLv2:+EXP;
        ssl_prefer_server_ciphers on;

        #wss协议转发 小程序里面要访问的链接
        #访问:wss://wx.againfly.com/websocket
        location /websocket {
            proxy_pass http://websocket;
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "Upgrade";
        }

        #charset koi8-r;
        #access_log  /var/log/nginx/log/xxx.access.log  main;

        location / {
            proxy_pass http://web;
            proxy_set_header   X-Real-IP        $remote_addr;
            proxy_set_header   X-Forwarded-For  $proxy_add_x_forwarded_for;
            #跨域访问设置
            add_header Access-Control-Allow-Origin *;
        }

        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
        #关闭nginx日志
        access_log off;

    }
}

 

我的博客其他nginx文章:

利用nginx将ws协议升级为wss协议

多个Tomcat服务器 + Nginx负载均衡

赞(0) 打赏
如果文章对你有帮助,欢迎你来评价反馈。AgainFly » 微信小程序-nginx-https-wss-websocket

评论 1

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
  • Q Q(选填)
  1. #1
    头像

    我的nginx配置wss,用浏览器访问不了啊,能否帮我解决下,qq:529016850,感谢

    Do10个月前 (12-20)回复

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏