vue线上项目地址携带参数404，被当作文件请求😭，急死了，求帮忙看看

Question

本地访问没有任何问题，可以正常访问

线上访问时参数却被当作文件请求了

域名解析那边使用了Cname不知道这个有没有影响

以下是VueRouter代码部分

const routes = [
  {
    path: '/:id',
    name: 'Home',
    component: Studio
  },

]

const router = new VueRouter({
  mode: 'history',
  routes
})

Answer 1

单页面一定要从首页 xx.xx.com/ 根路径开始进入。直接在地址栏输入xx.xx.com/a/b/c是不行的，服务器上没有这个文件，需要服务端配合。比如服务如果用的nginx

listen:80;
server_name:www.xx.com;
location / {
    #意思就是试着去寻找$uri这个路径，没有的话返回index.html
    try_files $uri $uri/ /index.html;
}

Answer 2

mode: "history" 需要服务端支持，需要服务端根据地址去做 Rewrite。

开发期是 Vue 的 dev-server 帮你做了这个事情。但是发布到生产环境需要自己去配服务器转发。

参阅：HTML5 History 模式