> ## Documentation Index
> Fetch the complete documentation index at: https://translations.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

> Form Post を使用する Implicit Flow の仕組みと、ユーザー認証に ID トークンだけが必要な従来型の Web アプリでこれを使うべき理由を学びます。

# Form Post を使用する Implicit Flow

<Warning>
  「implicit」という名称に惑わされないでください。OAuth では現在、SPA でアクセストークンを取得するための Implicit grant の使用は推奨されていませんが、Form Post を使用する Implicit Flow が対象とするシナリオはそれとはまったく異なり、SPA での利用が非推奨になった原因である**セキュリティ上の問題の影響を受けません**。具体的には、Form Post を使用する Implicit Flow は SPA ではなく従来型の Web アプリに適用されます。取得するのはアクセストークンではなく ID トークンであり、その用途もまったく異なります。また、このフローではトークンを URL フラグメントに含める方式 (SPA の場合) ではなく POST を使用するため、ブラウザー履歴への攻撃やリダイレクトヘッダーなどを通じてトークンの一部が露出するリスクを避けられます。
</Warning>

従来型の Web アプリでのサインインは、<Tooltip tip="OpenID: アプリケーションがログイン情報を収集・保存しなくてもユーザーの本人確認を行えるようにする、認証のためのオープン標準です。" cta="用語集を見る" href="/docs/ja-jp/glossary?term=OpenID">OpenID</Tooltip> Connect (OIDC) のさまざまなフローを使って実現できます。一般的なフローの 1 つでは、アプリのバックエンドで実行される認可コードフローを使って <Tooltip tip="ID トークン: リソースへのアクセスではなく、クライアント自身のための資格情報です。" cta="用語集を見る" href="/docs/ja-jp/glossary?term=ID+token">ID トークン</Tooltip> を取得します。この方法は効果的で堅牢ですが、Web アプリでシークレットを取得して管理する必要があります。必要なのがサインインの実装だけで、API を呼び出すための <Tooltip tip="アクセストークン: API へのアクセスに使用される、opaque な文字列または JWT 形式の認可資格情報です。" cta="用語集を見る" href="/docs/ja-jp/glossary?term=access+tokens">アクセストークン</Tooltip> を取得する必要がないのであれば、その負担は避けられます。

Form Post を使用する Implicit Flow では、<Tooltip tip="Security Assertion Markup Language (SAML): パスワードを使わずに 2 者間で認証情報をやり取りできるようにする標準化プロトコルです。" cta="用語集を見る" href="/docs/ja-jp/glossary?term=SAML">SAML</Tooltip> や WS-Federation と非常によく似た方法で、OIDC を使って Web サインインを実装します。Web アプリはシークレットや追加のバックエンド呼び出しを必要とせず、フロントチャネル経由でトークンを要求し、取得できます。この方法であれば、アプリケーション内でシークレットを取得、維持、使用、保護する必要はありません。

<div id="how-it-works">
  ## 仕組み
</div>

<Warning>
  このフローは、ログインのみのユースケースで使用してください。ユーザーのログイン時に API を呼び出すためのアクセストークンもリクエストする必要がある場合は、[PKCE を使用した Authorization Code フロー](/docs/ja-jp/get-started/authentication-and-authorization-flow/authorization-code-flow-with-pkce) または [Hybrid Flow](/docs/ja-jp/get-started/authentication-and-authorization-flow/hybrid-flow) を使用してください。
</Warning>

<Frame>
  <img src="https://mintcdn.com/translations/6GE5Z24GDCZehiJ9/docs/images/cdy7uua7fh8z/6m0uE4E7Hpzbdhyh9dEuYK/e36c910ff47a7540bf27e23c02822624/auth-sequence-implicit-form-post.png?fit=max&auto=format&n=6GE5Z24GDCZehiJ9&q=85&s=fc91df5d31b18b14d5fa8177e1537fcf" alt="Flows - form_post を使用した Implicit - 認可シーケンス図" width="1500" height="712" data-path="docs/images/cdy7uua7fh8z/6m0uE4E7Hpzbdhyh9dEuYK/e36c910ff47a7540bf27e23c02822624/auth-sequence-implicit-form-post.png" />
</Frame>

1. ユーザーがアプリで **Login** をクリックします。
2. Auth0 の SDK は、要求する認証情報の種類を示す `response_type` パラメータ `id_token` を付けて、ユーザーを Auth0 Authorization Server (`/authorize` エンドポイント) にリダイレクトします。また、セキュリティを確保するため、`response_mode` パラメータ `form_post` も渡します。
3. Auth0 Authorization Server は、ユーザーをログインおよび認可の prompt にリダイレクトします。
4. ユーザーは設定済みのログインオプションのいずれかで認証し、Auth0 がアプリに付与する permissions の一覧を示す同意ページが表示されることがあります。
5. Auth0 Authorization Server は、ID トークンとともにユーザーをアプリにリダイレクトします。

<div id="how-to-implement-it">
  ## 実装方法
</div>

[Express OpenID Connect SDK](https://www.npmjs.com/package/express-openid-connect) を使用して、Form Post を使用した Implicit Flow を安全に実装できます。

<Callout icon="file-lines" color="#0EA5E9" iconType="regular">
  [Auth0 Single-Page App SDK](/docs/ja-jp/libraries/auth0-single-page-app-sdk) と [Single-Page Quickstarts](/docs/ja-jp/quickstart/spa) は新しい推奨事項に沿っており、[PKCE を使用した Authorization Code フロー](/docs/ja-jp/get-started/authentication-and-authorization-flow/authorization-code-flow-with-pkce) を使用します。
</Callout>

最後に、チュートリアルに従って API エンドポイントを使用し、[Form Post を使用した Implicit Flow でログインを追加する](/docs/ja-jp/get-started/authentication-and-authorization-flow/implicit-flow-with-form-post/add-login-using-the-implicit-flow-with-form-post)こともできます。

<div id="learn-more">
  ## 詳細はこちら
</div>

* [Auth0 ルール](/docs/ja-jp/customize/rules)
* [Auth0 フック](/docs/ja-jp/customize/hooks)
* [トークン](/docs/ja-jp/secure/tokens)
* [トークンのベストプラクティス](/docs/ja-jp/secure/tokens/token-best-practices)
* [どの OAuth 2.0 フローを使用すべきですか？](/docs/ja-jp/get-started/authentication-and-authorization-flow/which-oauth-2-0-flow-should-i-use)
* [Implicit Flow を使用する際のリプレイ攻撃対策](/docs/ja-jp/get-started/authentication-and-authorization-flow/implicit-flow-with-form-post/mitigate-replay-attacks-when-using-the-implicit-flow)