一个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匹配外的部分