个人项目中使用的nginx.conf解读

一、开篇介绍一下项目背景:

我这个项目需要用到的哪些nginx代理,如果你跟我的情况一致,你可以直接复制粘贴使用了,其他情况下就需要做些修改了:

(约定:隐私需要,代表服务器域名ip的我全部使用 127.0.0.1 代替)

1、前端框架+cli:项目使用react-create-app自动化构建的,且没有做eject释放项目webpack配置,标准的单页面应用;

2、前端资源部署:使用 build 打包出来的前端项目资源部署到服务器之后,使用nginx配置代理到 127.0.0.1    的http默认80端口上,关于该配置可参考本人此前的一篇随笔;

3、http请求代理:所有http的接口访问的都是 127.0.0.1:3000/...   的,例如,前端接口访问 ‘api/login’,通过nginx配置之后的实际访问地址为 127.0.0.1:3000/login;

4、webSocket请求代理:项目中使用到了通过socket.io框架包装的webSocket网络请求,通过nginx代理配置所有的webSocket请求到  127.0.0.1:5000 上。

二、完整的nginx.conf配置:

#user  nobody;
worker_processes  1;
events {
    worker_connections  1024;
}


http {
    include       mime.types;
    default_type  application/octet-stream;
    sendfile        on;
    keepalive_timeout  65;

    #127.0.0.1/api/... 相关的请求代理设置
    upstream api {   
        #将 /api  替换为 127.0.0.1:3000                                                      
        server 127.0.0.1:3000;                                                
        keepalive 2000;
    }
    server {
        #代理端口
        listen       80;
        #代理ip(需要替换成实际的服务器ip!)
        server_name  127.0.0.1;

        #80端口根路径代理设置
        location /{
            #根路径文件夹设置
            root  /usr/local/webServe/build/;
              #默认访问文件设置
              index index.html;
              #单页面应用,所有请求重定向到index.html上
              try_files $uri /index.html;
        }

        #127.0.0.1/api/... 相关的请求代理设置
        location /api/ {
            proxy_pass http://api/;
            proxy_set_header Host $host:$server_port;
        }

        #webSocket请求的代理设置
        location ^~/socket.io {
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "upgrade";
            #代理到5000端口上
            proxy_pass http://127.0.0.1:5000;
        }
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
    }
}

本来想写个第三点的各配置的分析,想了一下,直接在完整配置文件上注释也挺好。各位需要哪一部分也可以单独复制粘贴。

需要额外说明的一点是:因为使用到了socket.io框架(这个框架包含两个独立部分,node服务端和client客户端部分),所以项目中的webSocket请求url有独特的socket.io标识。

posted @ 2020-07-30 13:57  我爱黎明!  阅读(403)  评论(0编辑  收藏  举报