Vue的History模式在Nginx怎么配置?

由于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是因为项目入口是这里]
   }

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

阅读 6.4k
2 个回答

这样试试

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

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

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
宣传栏