Vue-router history模式下Nginx配置

对于VUE的router[mode: history]模式(这里主要是为了去除链接上的"#")
开发的时候,一般都不出问题。是因为开发时用的服务器为node,Dev环境中已配置好了,

nginx运行的时首页没有问题,链接也没有问题,但在点击刷新后,页面就会显示(404)

原配置:

 location / {
        root  /home/testhadoop/www/html;
        index index.html index.htm;
    }

解决方案如下:

方案一:
使用try_files

语法:try_files file1 [file2 ... filen] fallback

location / {
    root  /home/testhadoop/www/html;
    index index.html index.htm;
    try_files $uri $uri/ /index.html;
}

方案二:

location /{

    root  /home/testhadoop/www/html;
    index  index.html index.htm;

    if (!-e $request_filename) {
        rewrite ^/(.*) /index.html last;
        break;
    }
}
发布了1266 篇原创文章 · 获赞 275 · 访问量 290万+

猜你喜欢

转载自blog.csdn.net/zhouzhiwengang/article/details/103532710