Nginx-使用实例 | HoleLin's Blog

通过阿里云免费`SSL`证书配置`HTTPS`

登录阿里云网页端,进入SSL证书模块,选择免费证书,创建证书,填写好相关信息后,提交审核.
审核通过后,下载证书,选择Nginx,可参考阿里云帮助手册,进行部署
把下载好的证书上传至服务器,可以在nginx相关目录中新建文件夹cert用于存放证书相关信息

然后,修改nginx的配置信息,可新建一个conf.d目录里面存放单独的配置文件

mkdir conf.d
chmod 777 conf.d
# 新建配置文件
vim xxx.xxx.cn.conf

# 注意要保持server_name的值与之前申请的证书所填写的一致,不然会出现"您与此网站之间建立的连接并非完全安全"即证书域名和设置的域名不一致问题
server {
    listen 443 ssl;
    server_name xx.xxxxx.cn; #需要将yourdomain.com替换成证书绑定的域名.
    ssl_certificate ../../cert/xx.xxxxx.cn.pem;  #需要将cert-file-name.pem替换成已上传的证书文件的名称.
    ssl_certificate_key ../../cert/xx.xxxxx.cn.key; #需要将cert-file-name.key替换成已上传的证书私钥文件的名称.
    ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;
    #表示使用的加密套件的类型.
    ssl_protocols TLSv1 TLSv1.1 TLSv1.2; #表示使用的TLS协议的类型.
    ssl_prefer_server_ciphers on;
    ssl_session_cache shared:SSL:10m;
    ssl_session_timeout 10m;
    error_page 400  https://$host$request_uri;

    #Location配置
    location / {
        proxy_set_header X-Rea $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_pass http://xxx.xxx.xxx.xx:xxxx;
        proxy_set_header X-Forwarded-Proto $scheme;

    }
}

# 在nginx.conf的http{}中添加
include conf.d/*.conf;
# 重启nginx
nginx -s reload

`Nginx`配置`WebSocket`

前置准备

WebSocket地址: ws://{IP}:{PROT}/ws

验证配置前WebSocket是否可以用,编写test.html填充以下内容

<script>
const socket = new WebSocket('ws://{IP}:{PROT}/ws');

// 连接建立时触发
socket.onopen = function() {
  console.log('WebSocket连接已建立');
  
  // 向服务器发送消息
  socket.send('PING');
};

// 接收服务器发送的消息
socket.onmessage = function(event) {
  const message = event.data;
  console.log('收到服务器消息:', message);
};

// 连接关闭时触发
socket.onclose = function() {
  console.log('WebSocket连接已关闭');
};

// 发生错误时触发
socket.onerror = function(error) {
  console.error('WebSocket错误:', error);
};

</script>

打开页面,使用F12查看网络并选择WS进行过滤WebSocket请求
验证完成后进行Nginx配置文件修改

配置`ws`

原始配置

server {
    listen 80;
    server_name xx.xxxxx.cn; 
    #Location配置
    location / {
        proxy_set_header X-Rea $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_pass http://xxx.xxx.xxx.xx:xxxx;
        proxy_set_header X-Forwarded-Proto $scheme;
    }
}

添加了WebSocket配置

server {
    listen 80;
    #Location配置
    location / {
        proxy_set_header X-Rea $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_pass http://xxx.xxx.xxx.xx:xxxx;
        proxy_set_header X-Forwarded-Proto $scheme;
    }
    
    # 补充websocket配置
    location /ws {
         proxy_pass http://{IP}:{PROT}/ws;
         proxy_http_version 1.1;
         proxy_set_header Upgrade $http_upgrade;
         proxy_set_header Connection $connection_upgrade;
         proxy_read_timeout 86400;  
    }
}

验证

<script>
const socket = new WebSocket('ws://xx.xxxxx.cn/ws');

// 连接建立时触发
socket.onopen = function() {
  console.log('WebSocket连接已建立');
  
  // 向服务器发送消息
  socket.send('PING');
};

// 接收服务器发送的消息
socket.onmessage = function(event) {
  const message = event.data;
  console.log('收到服务器消息:', message);
};

// 连接关闭时触发
socket.onclose = function() {
  console.log('WebSocket连接已关闭');
};

// 发生错误时触发
socket.onerror = function(error) {
  console.error('WebSocket错误:', error);
};

</script>

配置`wss`

原始配置

server {
    listen 443 ssl;
    server_name xx.xxxxx.cn; #需要将yourdomain.com替换成证书绑定的域名.
    ssl_certificate ../../cert/xx.xxxxx.cn.pem;  #需要将cert-file-name.pem替换成已上传的证书文件的名称.
    ssl_certificate_key ../../cert/xx.xxxxx.cn.key; #需要将cert-file-name.key替换成已上传的证书私钥文件的名称.
    ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;
    #表示使用的加密套件的类型.
    ssl_protocols TLSv1 TLSv1.1 TLSv1.2; #表示使用的TLS协议的类型.
    ssl_prefer_server_ciphers on;
    ssl_session_cache shared:SSL:10m;
    ssl_session_timeout 10m;
    error_page 400  https://$host$request_uri;

    #Location配置
    location / {
        proxy_set_header X-Rea $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_pass http://xxx.xxx.xxx.xx:xxxx;
        proxy_set_header X-Forwarded-Proto $scheme;
    }
}

添加了WebSocket配置

server {
    listen 443 ssl;
    server_name xx.xxxxx.cn; #需要将yourdomain.com替换成证书绑定的域名.
    ssl_certificate ../../cert/xx.xxxxx.cn.pem;  #需要将cert-file-name.pem替换成已上传的证书文件的名称.
    ssl_certificate_key ../../cert/xx.xxxxx.cn.key; #需要将cert-file-name.key替换成已上传的证书私钥文件的名称.
    ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;
    #表示使用的加密套件的类型.
    ssl_protocols TLSv1 TLSv1.1 TLSv1.2; #表示使用的TLS协议的类型.
    ssl_prefer_server_ciphers on;
    ssl_session_cache shared:SSL:10m;
    ssl_session_timeout 10m;
    error_page 400  https://$host$request_uri;

    #Location配置
    location / {
        proxy_set_header X-Rea $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_pass http://xxx.xxx.xxx.xx:xxxx;
        proxy_set_header X-Forwarded-Proto $scheme;
    }
    # 补充websocket配置
    location /ws {
         proxy_pass http://{IP}:{PROT}/ws;
         proxy_http_version 1.1;
         proxy_set_header Upgrade $http_upgrade;
         proxy_set_header Connection $connection_upgrade;
         proxy_read_timeout 86400;  
    }
}

验证

<script>
const socket = new WebSocket('wss://xx.xxxxx.cn/ws');

// 连接建立时触发
socket.onopen = function() {
  console.log('WebSocket连接已建立');
  
  // 向服务器发送消息
  socket.send('PING');
};

// 接收服务器发送的消息
socket.onmessage = function(event) {
  const message = event.data;
  console.log('收到服务器消息:', message);
};

// 连接关闭时触发
socket.onclose = function() {
  console.log('WebSocket连接已关闭');
};

// 发生错误时触发
socket.onerror = function(error) {
  console.error('WebSocket错误:', error);
};

</script>

`Nginx`配置`GZip`压缩

Nginx中的gzip处理模块是:ngx_http_gzip_module.可以使用:nginx -V命令,查看nginx服务器是否开启了对gzip的支持模块
- 若包含–with-http_gzip_static_module,就说明nginx服务器已经支持 gzip 了,可以开始配置 gzip 压缩了

具体配置

#  gzip 可以在 http, server, location 中和配置,这里配置到 http 下是全局配置,
#  只要是使用当前 nginx 服务器的站点都会开启 gzip
http {
  gzip on;
  gzip_comp_level 5;
  gzip_min_length 1k;
  gzip_buffers 4 16k;
  gzip_proxied any;
  gzip_vary on;
  gzip_types
    application/javascript
    application/x-javascript
    text/javascript
    text/css
    text/xml
    application/xhtml+xml
    application/xml
    application/atom+xml
    application/rdf+xml
    application/rss+xml
    application/geo+json
    application/json
    application/ld+json
    application/manifest+json
    application/x-web-app-manifest+json
    image/svg+xml
    text/x-cross-domain-policy;
  gzip_static on;  
  gzip_disable "MSIE [1-6]\.";  
}

gzip on;:开启 gzip,Default: off
gzip_comp_level 5;:压缩级别: 1-9.5 是推荐的压缩级别,Default: 1
gzip_min_length 1k;:gzip 压缩文件体积的最小值.如果文件已经足够小了,就不需要压缩了,因为即便压缩了,效果也不明显,而且会占用 CPU 资源.Default: 20
gzip_buffers 4 16k;:设置用于压缩响应的 number 和 size 的缓冲区.默认情况下,缓冲区大小等于一个内存页.根据平台的不同,它也可以是4K或8K.
gzip_proxied any;:是否开启对代理资源的压缩.很多时候,nginx 会作为反向代理服务器,实际的静态资源在上有服务器上,只有开启了 gzip_proxied 才会对代理的资源进行压缩.Default: off
gzip_vary on;:每当客户端的 Accept-Encoding-capabilities 头发生变化时,告诉代理缓存 gzip 和常规版本的资源.避免了不支持 gzip 的客户端（这在今天极为罕见）在代理给它们 gzip 版本时显示乱码的问题.如果指令gzip, gzip_static 或 gunzip 处于活动状态, 则启用或禁用插入“ Vary:Accept-Encoding”响应标头字段.Default: off
gzip_types:压缩文件的 MIME 类型.text/html 默认就会开启 gzip 压缩,所以不用特别显示配置 text/html 的 MIME 类型.Default: text/html
gzip_static on;:服务器开启对静态文件（ CSS, JS, HTML, SVG, ICS, and JSON）的压缩.但是,要使此部分与之相关,需要在 gzip_types 设置 MIME 类型,仅仅设置 gzip_static 为 on 是不会自动压缩静态文件的.
gzip_disable “MSIE [1-6].”;:IE6 以下的浏览器禁用 gzip 压缩.