vue hositroy 的路由模式会出现的问题记载

1.将项目放在了服务器上，进入路由以后，直接刷新会出现页面空白的情况，这是因为我们的路由模式是histroy模式。

hash模式

#后面 hash 值的变化，并不会导致浏览器向服务器发出请求，浏览器不发出请求，也就不会刷新页面。每次 hash 值的变化，会触发hashchange 这个事件，通过这个事件我们就可以知道 hash 值发生了哪些变化。然后我们便可以监听hashchange来实现更新页面部分内容的操作：hash模式背后的原理是onhashchange事件

history模式

因为HTML5标准发布，多了两个 API，pushState() 和 replaceState()。通过这两个 API （1）可以改变 url 地址且不会发送请求，（2）不仅可以读取历史记录栈，还可以对浏览器历史记录栈进行修改。

除此之外，还有popState().当浏览器跳转到新的状态时，将触发popState事件.

history 模式缺点

vue路由有 hash(浏览器环境) 、 abstract (Node.js 环境)、history(Html5模式)三种方式。

默认mode为hash,支持所有浏览器，缺点（url路径为有#号）

history 模式，依赖后端配置，详细配置地址

history 模式打包之后的本地文件，浏览器不能访问

使用history模式，没有后台依赖，会出现打包放在服务器之后浏览器刷新404，跳转404等问题

 

区别：

前面的hashchange，你只能改变#后面的url片段。而pushState设置的新URL可以是与当前URL同源的任意URL。
history模式则会将URL修改得就和正常请求后端的URL一样,如后端没有配置对应/user/id的路由处理，则会返回404错误