Nginx笔记-vue项目刷新出现404（try_files和index）

IT19952023-09-09 2:09

目前的nginx.conf配置：

javascript 复制代码

......

server{

    ......

    ......

    location /xxx{

        root /home/userName/dir

        index index.html

   }

}

部署是成功了，但是有个问题，就是感觉整个前端不会找uri，按F5或者在浏览器输入url都会404，只从vue默认的地方进，才行。

解决方法：

javascript 复制代码

......

server{

    ......

    ......

    location /xxx{

        root /home/userName/dir

        try_files $uri $uri/ /home/userName/dir/index.html

   }

}

原因：

index index.htm index.html;

index 就是根目录，也就是只识别"/"结尾的，输入不存在或者刷新页面的路径就直接报nginx的404了，而不会重定向到index.html

try_files 更加可靠，首先会查找" $uri"下的这个文件，如果不存在会查找$ uri/,如果还不存在就会重定向到 /index.html页面。如果最后参数写错了，就会导致500的服务器错误。

以前如果是没有用webpack的项目，可以直接用index，如果是用的webpack最好用try_files