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

方案二:
使用try_files

location /{

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

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

方案三:
使用error_page (一般不建议用, 404的方式会被第三方劫持)

location /{

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

    error_page 404 /index.html;
}
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 初始化git 配置git 使用Git的第一件事就是设置你的名字和email,这些就是你在提交commit时的签名,...
    MiracleJQ阅读 5,298评论 0 0
  • 文件操作: ls ####查看目录中的文件#### ls -F ####查看目录中的文件#### ls -l ##...
    劍風阅读 3,538评论 0 1
  • 大多数 Nginx 新手都会频繁遇到这样一个困惑,那就是当同一个location配置块使用了多个 Nginx 模块...
    SkTj阅读 12,442评论 0 12
  • 系统信息 arch 显示机器的处理器架构(1)uname -m 显示机器的处理器架构(2)uname -r 显示正...
    jsondream阅读 3,547评论 4 13
  • 系统信息 arch 显示机器的处理器架构(1) uname -m 显示机器的处理器架构(2) uname -r 显...
    周晓风阅读 2,958评论 0 0