hash模式:
通过hashchange监听url中的hash来进行路由的跳转。
概述:hash指的是地址中#号以及后面的字符,这个#就是hash符号,中文名哈希符或锚点,哈希符后面的值,我们称之为哈希值。如 http://localhost/index.html/#/hello,这里的#/hello就是hash
特点:hash 虽然出现在 URL 中,但不会被包括在 HTTP 请求中,对后端完全没有影响,因此改变 hash 不会重新加载页面。
路由的哈希模式其实是利用了window可以监听onhashchange事件,可以实现监听浏览器地址hash值变化,执行相应的js切换网页。这么一来,即使前端并没有发起http请求它也能够找到对应页面的代码块进行按需加载。
histore模式:
概述:window.history 属性指向 History 对象,它表示当前窗口的浏览历史。当发生改变时,只会改变页面的路径,不会刷新页面。History 对象保存了当前窗口访问过的所有页面网址。
下面介绍一下H5新推出的两个神器:pushState()与replaceState()方法
作用:就是可以将url替换并且不刷新页面。在hash模式下,前端路由修改的是#中的信息,而浏览器请求时不会将 # 后面的数据发送到后台,所以没有问题。但是在history下,你可以自由的修改path,当刷新时,如果服务器中没有相应的响应或者资源,则会刷新出来404页面。