文章

前端代理及Nginx配置

前端代理及Nginx配置

发表于 更新于
作者 独行的风
2 分钟阅读
前端代理及Nginx配置

前端代理及Nginx配置

try_files $uri$uri/ /index.html;客户端

下载依赖 **http-proxy-middleware**

1

npm i http-proxy-middleware -D

根目录新建文件 **setupProxy.js**

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

//引入依赖
const {createProxyMiddleware} = require('http-proxy-middleware');

//添加代理
module.exports = function (app) {
  //"/api"是你接口地址的首个分发地址
  app.use('/api', createProxyMiddleware({
    target: 'http://www.mrhu.fun:7001',//目标地址
    secure: false,
    changeOrigin: true,
    // 重定向
    /*pathRewrite: {
      "^/api": "/api"
    },*/
  }));
};

服务器Nginx配置

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

server{
   listen       3000;
   server_name  localhost;
   location / {
       root   /mycodes/web-build; #客户端代码目录
       index  index.html index.htm;
       try_files $uri $uri/ /index.html; #404页面转发
   }

   #代理后台接口
   #匹配到 /api 开头的接口时，转发到下面的服务器地址
   location /api {
       proxy_pass http://111.67.197.234:7001; #转发请求的地址
   }
}

修改完需要重新载入配置文件

1
2
3
4
5
6
7
8
9
10
11
12

proxy_pass http://127.0.0.1:9080;
#转发请求的地址;设置被代理服务器的端口或套接字，以及URL
proxy_connect_timeout 90;
#后端服务器连接的超时时间_发起握手等候响应超时时间
proxy_read_timeout 180;
#连接成功后_等候后端服务器响应时间_其实已经进入后端的排队之中等候处理（也可以说是后端服务器处理请求的时间）
proxy_send_timeout 180;
#后端服务器数据回传时间_就是在规定时间之内后端服务器必须传完所有的数据
proxy_buffer_size 256k;
#设置从被代理服务器读取的第一部分应答的缓冲区大小，通常情况下这部分应答中包含一个小的应答头，默认情况下这个值的大小为指令proxy_buffers中指定的一个缓冲区的大小，不过可以将其设置为更小
proxy_buffers 4 256k;
#设置用于读取应答（来自被代理服务器）的缓冲区数目和大小，默认情况也为分页大小，根据操作系统的不同可能是4k或者8k
后端运维, Linux
linux
本文由作者按照 CC BY 4.0 进行授权