nginx反向代理’/’的问题记录

问题记录

一个vue项目的前端，在登录时去请求另一个接口进行登录，请求时返回404，原因就是在请求www.a.com/forward/login/v1/doLogin?loginName=test&passWord=e10adc3这个地址时，没有转发到www.b.com/login/v1/doLogin?loginName=test&passWord=e10adc3，所以才会返回一个404

解决方法

一开始考虑使用rewrite直接改写请求到www.b.com/forward/login/v1/doLogin?loginName=test&passWord=e10adc3，但是发现会出现跨域问题

location /forward/ {
        rewrite /forward/(.*) http://www.b.com/$1 last;
}

这样配置会出现跨域，代码里已经对跨域做好了跨域设置，所以直接使用proxy_pass进行转发就可以，下面是正确的写法

    location /forward/ {
        proxy_pass https://www.b.com/;
    }

这种写法可以将原请求的虚拟路径给去掉，即不带请求地址，如下： 源请求： www.a.com/forward/login/v1/doLogin?loginName=test&passWord=e10adc3 转发后的请求： www.b.com/login/v1/doLogin?loginName=test&passWord=e10adc3

示例

源请求：www.a.com/test/api/index.html

写法一

location /test/ {
  proxy_pass http://www.b.com;
}

原样转发

www.b.com/test/api/index.html

写法二

location /test/ {
  proxy_pass http://www.b.com/;
}

后面加了一个/，转发后的请求实际为：

#去掉了/test/这个路径
www.b.com/api/index.html

写法三

location /test/api/ {
  proxy_pass http://www.b.com/;
}

转发后的请求实际为：

#把location匹配到的路径都给去掉了
www.b.com/index.html

写法四

location /test/api/ {
  proxy_pass http://www.b.com/api;
}

转发后的请求为：

#拼接的是剩余部分的请求，所以会连到一起
www.b.com/apiindex.html

写法五

location /test/api/ {
  proxy_pass http://www.b.com/api/;
}

转发后的请求为：

www.b.com/api/index.html

总结

总而言之，如果proxy_pass后面没有跟任何路径信息，那么反向代理的请求地址将包含location匹配到的部分。 如果proxy_pass后面有路径，那么反向代理的请求地址将进行拼接，拼接的形式为：proxy_pass后面的路径部分 加上 location匹配外的部分