Fix: 未知原因登入失敗

[Yuwen-ctw]

議題描述：

經第三方登入成功，並進入大廳後僅一瞬間，會立即轉變成登入失敗，導回登入頁。

分析：

1. 登入成功後第一個執行的 API ( /users/me ) 就已經攜帶錯誤的 token，該錯誤之 token 為 [token]。故接著檢查後端的回傳結果是否正確。
2. 透過 devTool 將傳輸速度調整為 slow 3G 後，觀察登入流程中 URL 之變化，可以確定登入成功後，後端有將正確的 token 放到 query string 中 ( /auth/token/eyJhbGciO..... )。故追查範疇只剩下取得 token 後在打第一個 API 前的這段期間，token 在前端的資料流向。

3. 最後透過 devTool 追查打包後的源碼，發現於 auth/[token].tsx 元件中，使用 Next.js 提供的 useRouter() API，取得 query string 時， Next.js 所回傳的結果就已經是 [token] (如下圖)，顯然不是預期的結果。

   目前依然無法理解為何 useRouter().query.token 會得到錯誤的結果，而且近期鮮少進行套件框架更新或異動程式碼，不知道為何會這樣。

解方

• 目前打算先改使用 Next.js 的 useSearchParams 來取得 token，目前在開發模式下可以正常運作，但需上線才可確定產品環境是否沒問題。
• (更) 感謝 @JohnsonMao 提醒，useSearchParams 並不適用，改以 useRouter.asPath 取得 token。