hash和history两种模式的区别

最新推荐文章于 2024-03-27 00:36:30 发布

Ideaing~

最新推荐文章于 2024-03-27 00:36:30 发布

阅读量142

点赞数

文章标签：哈希算法前端算法

本文链接：https://blog.csdn.net/L_csdn123/article/details/129118022

版权

                    
                    hash 就是指 url 尾巴后的 # 号以及后面的字符，history没有底带#，外观上比 hash 模式好看些
hash 能兼容到IE8， history 只能兼容到 IE10
虽然hash路径出现在URL中，但是hash值变化不会导致浏览器向服务器发送请求，对后端完全没有影响，因此改变hash值不会重新加载页面，基本都是使用 hash 来实现前端路由的，hash改变会触发hashchange事件（hashchange只能改变 # 后面的url片段）；history模式URL就要和后端进行一致，所以要改为history也需要后端的配合，否则会报错，所以hash模式在每次刷新页面时是直接更改“#”后的东西，history每次刷新会重新像后端请求整个网址，也就是重新请求服务器。如果后端没有及时响应，就会报错404！(最好在服务端增加一个覆盖所有情况的候选资源：如果 URL 匹配不到任何静态资源，则应该返回同一个 index.html 页面)。history的好处是可以进行修改历史记录，并且不会立刻像后端发起请求。
hash原理是通过监听浏览器的onhashchange()事件变化，查找对应的路由规则；history原理是利用H5的 history中新增的两个API pushState() 和 replaceState() 和一个事件onpopstate监听URL变化