对于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;
}
   原文:https://www.jianshu.com/p/f7a19f1bafa0

vueRouter history模式下 nginx配置的更多相关文章

  1. 解决vue-router嵌套路由(子路由)在history模式下刷新无法渲染页面的问题

    一. 异常描述: 本来使用的是vue-router的hash模式,但是hash模式下url需要带“#”符号,不仅看起来不舒服,而且有些场景下是会破坏路由中的"#"(微信分享页面就会 ...

  2. Windows下Nginx配置SSL实现Https访问(包含证书生成)

    Vincent.李   Windows下Nginx配置SSL实现Https访问(包含证书生成) Windows下Nginx配置SSL实现Https访问(包含证书生成) 首先要说明为什么要实现https ...

  3. react history模式下的白屏问题

    近期,再用react的时候,由于不想用丑陋的hash,便将路由模式切换成history了,结果带来了一些问题,比如刷新白屏,还有图片加载不出来,这里我们说一下解决方案. 原因 首先,我们说一下造成这一 ...

  4. 【转】Linux下nginx配置https协议访问的方法

    一.配置nginx支持https协议访问,需要在编译安装nginx的时候添加相应的模块--with-http_ssl_module 查看nginx编译参数:/usr/local/nginx/sbin/ ...

  5. “Options模式”下的配置是如何绑定为Options对象

    “Options模式”下的配置是如何绑定为Options对象 配置的原子结构就是单纯的键值对,并且键和值都是字符串,但是在真正的项目开发中我们一般不会单纯地以键值对的形式来使用配置.值得推荐的做法就是 ...

  6. Azure ARM模式下VNet配置中需要注意的几点事项

    虚拟网络的配置是所有公有云中非常重要的环节.把虚拟网络配置好,对整个系统的管理.维护,以及安全性都非常重要. 本文将介绍Azure在ARM模式下VNet配置中需要特别注意的几点. 一 Azure的VN ...

  7. Vmware在NAT模式下网络配置详解

    Vmware在NAT模式下网络配置详解 Linux中的网络配置对于接触Linux不久的小白菜来说,还是小有难度的,可能是不熟悉这种与windows系列迥然不同的命令行操作,也可能是由于对Linux的结 ...

  8. windwos下nginx 配置https并http强制跳转https

    windwos下nginx  配置https并http强制跳转https 一.首先配置证书文件 申请证书文件,这里就不做详细过程了,直接看证书文件结果. 这是两个证书的关键文件 打开ngxin下con ...

  9. `vue-router`的`History`模式下的项目发布

    背景 脚手架版本号:vue cli 3.x 项目路由:vue-router的History模式 原理:url路由处理逻辑从后端转移到前端. 参考:https://developer.mozilla.o ...

随机推荐

  1. 【GStreamer开发】GStreamer基础教程12——流

    目标 直接播放Internet上的文件而不在本地保存就被称为流播放.我们在前面教程里已经这样做过了,使用了http://的URL.本教程展示的是在播放流的时候需要记住的几个点,特别是: 如何设置缓冲 ...

  2. WXS-----学会使用WXS

    学会使用WXS require函数用于引入其他WXS模块 不要重复引入两个wxs模块,不然后者会覆盖前者

  3. linux中硬盘分区、格式化、挂载

    已经接触了小半年的linux,基本命令用的还行,就是涉及到深入操作,就显得不够看了,比如linux中的硬盘操作,于是整理了这篇博客. 1. 主分区,扩展分区,逻辑分区的联系和区别 ​ 一个硬盘可以有1 ...

  4. nginx location 路由的几个配置纪要

    1:网上没有查到在线测试 nginx location 规则的网址 在服务器上可以通过 return 返回测试比如  把#号去掉 # location /admin\.php(.*) # { #def ...

  5. 批量删除c文件和h文件中的注释

    不知道大家有没有批量删除c文件和h文件中注释的需要,说起来搞笑,偶然翻出来早先写的一份,首先楼猪不是闲的蛋疼写这东西,工作需要,哪里要砖就要搬.冷门的东西大家需要的时候也不一定好找,分享给大家,省的自 ...

  6. Java基础IO类之字节数组流

    package IODemo; //字节数组流 :内部维护这着一个字节数组,我们可以利用流的读取机制来处理字符串 无需关闭,不会报IO异常 // ByteArrayInputstream ByteAr ...

  7. Java8新特性 - 并行流与串行流

    并行流就是把一个内容分成多个数据块,并用不同的线程分别处理每个数据块的流. Java8中将并行进行了优化,我们可以很容易的对数据进行并行操作.Stream API可以声明性地通过parallel()和 ...

  8. VS.NET(C#)--2.2_事件

    事件 事件 由用戶行为生成系统触发(事件处理程序).在ASP.NET中,对象可以触发事件.用户在浏览器对服务器控件的任何行为都可能触发事件,但是在服务器端处理. 页面和控件事件 它们继承自contro ...

  9. string.Format 格式化

    1.格式化货币(跟系统的环境有关,中文系统默认格式化人民币,英文系统格式化美元) string.Format("{0:C}",0.2) 结果为:¥0.20 (英文操作系统结果:$0 ...

  10. nginx代理(正向代理和反向代理)

    正向代理 是一个位于客户端和原始服务器(origin server)之间的服务器,为了从原始服务器取得内容,客户端向代理发送一个请求并指定目标(原始服务器),然后代理向原始服务器转交请求并将获得的内容 ...