在这里插入图片描述

一开始本地出现这个问题的时候,我以为是restful风格的参数被识别成了url导致的。

想了很久,想着,就算被识别成这样了,那应该也有重试机制可以跳转啊,那为什么还是会白屏呢?
于是开始翻阅资料,牵心万苦后终于发现,是由于vue代码中的配置导致的:publicPath:’./’。

看到这里我终于恍然大悟,这个配置的意思是从当前路径找资源,所以一开始进去或者刷新页面是可以的,但如果带参数的url访问时,由于参数被识别成了url,所以url并不存在,就需要去当前目录找,但当前目录本就不存在,所以404。

将配置改成publicPath:’/'即可解决问题。

就在我以为问题已经解决时,服务器上的项目仍有这个问题!!!
在这里插入图片描述

于是乎又开始了漫长的找bug阶段,会不会是nginx配置也有问题? 因为是刷新页面才会出现问题,于是我将问题点定位在了nginx的try file上。可不管怎么尝试,始终不行,于是我想到了之前学到的try file原理,这是我的配置:

try_files $uri $uri/ /index.html;

我想,既然uri 和 uri/ 都找不到,那么最后应该会跳转到index主页才对啊,为什么没有跳转这一步呢?
于是我将 index.html替换成404 ,看看是否会报404错误,结果可想而知,并没有什么变化。

try file配置没有生效!!!

为什么没有生效? 于是我又去翻阅资料,良久后发现,应该是没错的,可为什么呢?
难道是代码问题?这个时候,路都堵死了,当然是要学会去问大佬,于是我开始了提问的过程,可就在截图的过程中,灵光乍现!

我想到了一个关键点,由于出问题的前端url和后端api部分重合,所以会不会是nginx将前端url识别成了后端api导致的? 一番严谨的验证后,果然如此啊!!!! 泪目了~
于是我将后端的前缀稍加改变,问题解决!!! 在此记录心酸历程`~

Logo

前往低代码交流专区

更多推荐