防止反應路由器中的深層鏈接

Question

在我的應用程序中，我希望應用程序的某些部分無法深層鏈接到。例如，我們的用戶有一份調查列表，我想如果有人試圖直接直接進行特定調查，例如/survey/1，那麼路由器會對此進行迴應，並立即將其重定向回/survey，他們將不得不選擇一個他們想要的。我試圖寫onEnter鉤子，但它們看起來很麻煩，因爲我能夠讓它們正確行爲的唯一方法是存儲一些全局狀態，說明它們已經到了主頁面並且每次都檢查路線被導航到。

林在我的應用程序中使用pushState的，如果說有什麼區別和反應路由器2.0

我想盡量避免寫服務器重寫規則這個因爲在我的應用程序有很多的領域該規則適用的地方。

Answer 1

我有一個建議是類似onEnter鉤：

• 纏上如果深層鏈接被允許或不允許其驗證功能的survey/:id路線的組件，讓我們調用這個函數preventDeepLinking
• preventDeepLinking函數檢查位置狀態是否包含某個標誌，比如說allowDeep。從您的應用的另一個頁面導航時，此標誌將設置爲位置狀態。顯然，當用戶試圖直接導航到調查頁面時，該標誌不會被設置。
• preventDeepLinking函數僅在允許深度鏈接的情況下呈現包裝的組件，否則將重定向到更高的路由。

我在codepen.io上創建了一個示例。您可以在Pen的調試視圖中使用它：http://s.codepen.io/alexchiri/debug/GZoRze。

在調試視圖中，單擊用戶鏈接，然後單擊列表中的特定用戶。它的名字將顯示在下面。注意它的id是url的一部分。刪除包含?_的散列，然後按Enter鍵。您將被重定向到/users。

筆的代碼是在這裏：http://codepen.io/alexchiri/pen/GZoRze

的preventDeepLinking功能得到改善，但這只是爲了證明這一點。另外，我會在反應路由器中使用browserHistory，但由於某種原因，我無法使用codepen運行它。

希望這會有所幫助。