使用react-router 瀏覽器刷新，頁面404問題解決

首先咱們先找到問題，再解決問題，別嫌我囉嗦，首先說說react路由history三種模式。

history 配置

React Router 是創建在 history 之上的。 簡而言之，一個 history 知道如何去監聽瀏覽器地址欄的變化， 並解析這個 URL 轉化爲 location 對象， 而後 router 使用它匹配到路由，最後正確地渲染對應的組件。
經常使用的 history 有三種形式， 可是你也可使用 React Router 實現自定義的 history。

• createHashHistory

• createBrowserHistory

• createMemoryHistory

這三個有什麼區別呢：

createHashHistory

這是一個你會獲取到的默認 history ，若是你不指定某個 history 。它用到的是 URL 中的 hash（#）部分去建立形如 http://mtui.mtsee.com/#/help 的路由。
這個 支持 ie8＋ 的瀏覽器，可是由於是 hash 值，因此不推薦使用。

createBrowserHistory

Browser history 是由 React Router 建立瀏覽器應用推薦的 history。它使用 History API 在瀏覽器中被建立用於處理 URL，新建一個像這樣真實的 URL http://mtui.mtsee.com/help。

Memoryhistory

不會在地址欄被操做或讀取。

那麼問題來了~

使用reateHashHistory，由於這裏用的#hash 方式，真正的url沒變。變的只是hash值，因此咱們下次直接訪問http://mtui.mtsee.com/#/help 這個地址就能直接訪問，可是這種模式不利於SEO，不推薦使用。

使用createBrowserHistory的時候，由於是使用 History API處理url的，真實的url已經改變，當咱們從新刷新瀏覽器，內部已經重置，咱們下次再訪問地址http://mtui.mtsee.com/help 的時候，以前的history已經更新，至關於直接到服務器去請求這個url，固然咱們用的是前端路由，服務器確定不知道這個是啥咯，因此返回404頁面。

這裏須要在服務器去設置。網上相關的資料不多，找到了一篇文章：nginx-for-react ，可是我用的是阿帕奇，不想去安裝其餘服務器，因而本身琢磨了下，決定試試對404進行重定向。因而想到了一個簡單的方法：修改htaccess文件。

htaccess添加一句話：ErrorDocument 404 /index.html 

竟然搞定了~ 問題獲得解決~

那麼404頁面呢？這麼粗魯，老闆知道嗎？拋磚引玉，設置htaceess指定url重定向，本身去搗鼓啦，反正重定向到 /index.html 就能夠的~