history和has的区别
**vue-router 中**hash**模式和*history*模式。
在vue的路由配置中有mode选项,vue默认使用hash。
vue2的写法
mode:'hash'
mode:'history'
hash
- 即地址栏 URL 中的 # 符号
比如这个 URL:http://www.aaa.com/#/hello,hash 的值为 #/hello。它的特点在于:hash居然出现在URL上,但是不会被包括到http请求上,后端也读取不到#/这个东西 ,因此改变 hash 不会重新加载页面history
history
- 利用了 HTML5 History Interface 中新增的 pushState() 和 replaceState() 方法。(需要特定浏览器支持)
这两个方法应用于浏览器的历史记录栈,在当前已有的 back、forward、go 的基础之上,它们提供了对历史记录进行修改的功能。只是当它们执行修改时,虽然改变了当前的 URL,但浏览器不会立即向后端发送请求。
history模式的问题
-
通过history api,我们去掉的#,但是它也有个问题:刷新会请求服务器(如果后端没有准备的话),因为刷新是实实在在地去请求服务器的。
-
在hash模式下,前端路由修改的是#中的信息,而浏览器请求时不会将 # 后面的数据发送到后台,所以没有问题。但是在history下,你可以自由的修改path,当刷新时,如果服务器中没有相应的响应或者资源,则会刷新出来404页面。