Vue-router history模式下Nginx配置分析

你猜 阅读:227 2021-03-31 16:54:37 评论:0

对于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; 
    } 
}

 

声明

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

发表评论
搜索
KIKK导航

KIKK导航

排行榜
关注我们

一个IT知识分享的公众号