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 キーが含まれているかどうかを確認し、含まれている場合は、window.location.href または window.location.replace() を使用してユーザーをリダイレクトします。

オプション 3: HTML フォームを使用する

fetch() を使用する必要がない場合は、ログインに従来の HTML フォームを使用することを検討してください。ユーザーがフォームを送信すると、POST リクエストがサーバーに送信されます。その後、サーバーは RedirectResponse を返すことができ、ブラウザはユーザーをターゲット URL に自動的にリダイレクトします。

以上がJavaScript Fetch API を使用してログイン後にユーザーをリダイレクトするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。