【Web前端问题】Vue的History模式在Nginx怎么配置？

Z时代
2024-01-10
分类：技术分享

由于vue-router默认是带了"#"的，但是在微信公众号里面转发地址的时候会直接把该地址"#"包括以后的地址全部去掉，导致没法分享页面。
所以我按照Vue官方配置，把路由模式设置为history，并且由于我们项目是服务端渲染的，所以我把base设置成了对应的mobile。

图片描述

这样我就能通过www.xxx.com/mobile来访问首页，并且在界面中用vue-router跳转其他页面也能正常。
但是操蛋的问题就来了，比如我分享的www.xxx.com/mobile/A/B路径给朋友，那么朋友直接访问这个路径就nginx会报404错误。
然后我就按照vue官方推荐的做法，把nginx加了如下配置。

   location / {
       try_files $uri $uri/ /mobile [这里我设置为mobile是因为项目入口是这里]   }

但是依旧不生效，请问这里应该怎么配置啊？

回答：

这样试试

 location /mobile {
       try_files $uri $uri/ /mobile [这里我设置为mobile是因为项目入口是这里]   }

回答：

这个问题我们后端用另外一种方法解决了，他没有用Ngnix，而是自己检测了一次路由，只要是以/mobile开头的路径就去输出mobile.html静态文件。

以上是【Web前端问题】Vue的History模式在Nginx怎么配置？的全部内容，来源链接： utcz.com/a/140397.html

回到顶部