React-router 配置browserHistory


  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 需要服務端支持,這樣服務端能獲取請求細節。       

注明:(綠字部分引用作為記錄學習,不是本人寫的)


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM