Deux solutions au problème 404 lors de l'actualisation de la page en mode historique de routage vue

Cet article vous propose deux solutions au problème 404 lors de l'actualisation de la page en mode historique de routage Vue. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.

En mode hachage vue, il y a '#' dans l'URL. Utilisez le mode 'historique' pour résoudre ce problème. Mais en mode historique, après avoir actualisé la page, la page apparaîtra 404. La solution est de le configurer avec nginx.

Modifiez

dans le fichier de configuration nginx :

location /{
    root   /data/nginx/html;
    index  index.html index.htm;
    if (!-e $request_filename) {
        rewrite ^/(.*) /index.html last;
        break;
    }
}

Méthode deux :
vue.js officiel. https://router.vuejs.org/zh/g...

  server {
        listen       8081;#默认端口是80，如果端口没被占用可以不用修改
        server_name  myapp.com;
        root        D:/vue/my_app/dist;#vue项目的打包后的dist
        location / {
            try_files $uri $uri/ @router;#需要指向下面的@router否则会出现vue的路由在nginx中刷新出现404
            index  index.html index.htm;
        }
        #对应上面的@router，主要原因是路由的路径资源并不是一个真实的路径，所以无法找到具体的文件
        #因此需要rewrite到index.html中，然后交给路由在处理请求资源
        location @router {
            rewrite ^.*$ /index.html last;
        }
        #.......其他部分省略
  }

mentionné dans le tutoriel

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!