nginx反向代理404问题解决说明
今天是个开心的日子,为啥呢?当然是我耗时多日的Vue+SpringBoot系统上线的日子啦!使用这两个技术编写的项目打包上线还是算蛮简单。后台Java只要会打 JAR 包就行(因为所有的依赖都会打包进去),前端Vue那是简单只需要 npm runbuild 操作即可。那么在上线过程中会遇到什么问题呢?问题1: Vue项目打包完之后接口请求不到后端出现404错误,这是由于Vue项目打包之后 prox
今天是个开心的日子,为啥呢?当然是我耗时多日的Vue+SpringBoot系统上线的日子啦!使用这两个技术编写的项目打包上线还是算蛮简单。后台Java只要会打 JAR 包就行(因为所有的依赖都会打包进去),前端Vue那是简单只需要 npm run build 操作即可。
那么在上线过程中会遇到什么问题呢?
问题1: Vue项目打包完之后接口请求不到后端出现404错误,这是由于Vue项目打包之后 proxyTable代理配置失效了!
问题2: 由于Vue项目打包之后代理失败,那么就需要使用Nginx进行反向代理请求了,可是还是出现404错误。在nginx中配置proxy_pass反向代理时,当在后面的url加上了 “/”,相当于是绝对根路径,则nginx不会把location中匹配的路径部分代理走;如果没有 “/”,则会把匹配的路径部分也给代理走。
举个例子: 访问接口为 /api/menu/getMenuList
当nginx配置文件proxy_pass后边的url端口后面带"/"时,代理到后端的路径为:http://127.0.0.1:8080/menu/getMenuList,省略了匹配到的/api/路径;
location /api/ {
proxy_pass http://127.0.0.1:8080/;
}
当nginx配置文件proxy_pass后边的url端口后面不带"/"时,代理到后端的路径为:http://127.0.0.1:8080/api/menu/getMenuList,连同匹配到的/api/路径一起代理了;
location /api/ {
proxy_pass http://127.0.0.1:8080;
}
以上就是我对Nginx反向代理的理解,如果文章由于我学识浅薄,导致您发现有严重谬误的地方,请一定在评论中指出,我会在第一时间修正我的文章,以避免误人子弟。
更多推荐
所有评论(0)