如何使用 JavaScript Fetch API 登入後重新導向使用者？

登入後如何使用 JavaScript Fetch API 將使用者重新導向到另一個頁面？

使用fetch() API 向伺服器發出POST 請求進行登入時，可以使用以下選項之一將使用者重新導向至另一個頁面：

選項1：傳回RedirectResponse

預設情況下，JavaScript 中的fetch() 函數會自動遵循重定向。因此，當伺服器傳回 RedirectResponse 時，fetch() 請求將遵循重新導向並從重定向 URL 傳回回應。

要確定回應是否是重新導向的結果，請檢查 Response.redirected是真的。如果是這樣，Response.url 將包含任何重定向後的最終 URL。使用 window.location.href 或 window.location.replace() 將使用者重新導向至目標 URL。

選項2：使用重定向URL 傳回JSON

而不是回傳RedirectResponse，伺服器可以傳回包含目標URL 作為鍵值對的JSON 回應（例如，{ "url": "/welcome " }）。在客戶端，檢查 JSON 回應是否包含 url key，如果包含，則使用 window.location.href 或 window.location.replace() 重定向使用者。

選項 3：使用 HTML 表單

如果不需要使用 fetch()，請考慮使用傳統的 HTML 表單進行登入。當使用者提交表單時，將向伺服器發送 POST 請求。然後伺服器可以返回 RedirectResponse，瀏覽器將自動將使用者重新導向到目標 URL。

以上是如何使用 JavaScript Fetch API 登入後重新導向使用者？的詳細內容。更多資訊請關注PHP中文網其他相關文章！