在ReactJS 中處理GET 請求重定向和CORS 錯誤

當ReactJS 應用程式向伺服器發送GET 請求並接收時遇到CORS錯誤302 重定向可能是一個令人沮喪的問題。以下提供了此問題的解決方案：

要解決您的場景中的 CORS 錯誤，其中 ReactJS 前端 (f.com) 請求路徑“/users”處的後端伺服器(b.com)，且後端重新導向至SSO登入頁面（sso.example.com/login），您可以採用以下方法：

用戶端重新導向：

更直接地在瀏覽器中處理客戶端的重定向。這樣，可以避免 CORS 問題，因為重新導向是直接到 SSO 網站 URL。

執行客戶端重定向：

選項1：使用React Router（複雜） )

• 使用React 路由器在React 中實現重定向。
• 請參閱文件：使用React 路由器V4 以程式方式導覽

選項2：使用純JavaScript（簡單）

• 使用window.location.href 屬性直接重定向瀏覽器。
• 確保瀏覽器不會出現潛在問題

• 程式碼範例：

  window.location.href = "https://www.example.com";

• 更多資訊請見：https://appendto.com/2016/04/javascript-redirect-how-to-redirect-a -web-page-with-javascript/

透過實現其中之一重定向策略，您可以成功處理GET 請求重定向，同時避免ReactJS 應用程式中的CORS 錯誤。