nginx部署vue项目报404问题

解决刷新路由404问题

这是因为我的vue项目是采用了history路由模式，又因为vue是单页面应用，一旦切换路由之后，之前的页面就会不存在，然后你再刷新回到之前的页面就会出现404了。（个人理解）

解决的方法：

• 将路由模式修改为hash模式（不建议，hash模式#太丑）
• 修改nginx配置

location / {
    try_files $uri $uri/ /index.html;  //解决页面刷新404问题
}

    server {
        listen       80;
        server_name  localhost;

        location /ulanegw/ {
           proxy_pass http://127.0.0.1:8080/;
        }
        
        location /ulane/ {
             root  D:/nginx-and-redis/nginx-1.22.0/html;
             index  index.html index.htm;
        }

① server_name 和 listen

也就是ip和端口号，只有访问的路径为nginx的ip+端口号，才会进入到nginx服务中。

② location

例: 访问路径为localhost:80/ulane/,nginx服务经过转发访问的资源为 D:/nginx-and-redis/nginx-1.22.0/html/ulane/路径下的。

例：访问路径为localhost:80/ulanegw/test,则nginx经过转发后访问的路径是 http://127.0.0.1:8080/test,根据末尾有没有/，判断是否添加上请求的路径地址。 还有好多规则，请自行根据项目百度。