React-router 配置browserHistory

牧云@^-^@ 提交于 2021-02-16 10:50:03

  browserHistory是使用React Router的应用推荐的history,它使用浏览器重的History API用于处理URl

 

     可以通过设置webpack.config.js 中的devServer,设置如下

 devServer: {
        historyApiFallback:{ index:'src/index.html' }, }

     实际开发用browserHistory而不用hashHostory(可以直接用,不用在服务器配置):

       browserHistory 其实使用的是 HTML5 的 History API,浏览器提供相应的接口来修改浏览器的历史记录;而 hashHistory 是通过改变地址后面的 hash 来改变浏览器的历史记录;

        History API 提供了 pushState() 和 replaceState() 方法来增加或替换历史记录。而 hash 没有相应的方法,所以并没有替换历史记录的功能。但 react-router 通过 polyfill 实现了此功能,具体实现没有看,好像是使用 sessionStorage。

另一个原因是 hash 部分并不会被浏览器发送到服务端,也就是说不管是请求 http://domain.com/index.html#foo 还是 http://domain.com/index.html#bar ,服务只知道请求了 index.html 并不知道 hash 部分的细节。而 History API 需要服务端支持,这样服务端能获取请求细节。       

注明:(绿字部分引用作为记录学习,不是本人写的)

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!