> ## 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 を使用したインプリシットフロー で利用する、暗号学的に安全な nonce を生成および検証する方法を説明します。

# Implicit Flow 使用時のリプレイ攻撃を軽減する

[Form Post を使用したインプリシットフロー](/ja/docs/get-started/authentication-and-authorization-flow/implicit-flow-with-form-post) の使用時にリプレイ攻撃を軽減するには、[OpenID Connect (OIDC) 仕様で要求されているとおり](https://openid.net/specs/openid-connect-core-1_0.html#ImplicitAuthRequest)、認証リクエストで <Tooltip tip="Nonce: 認証プロトコルでリプレイ攻撃を検出および防止するために一度だけ発行される任意の値。" cta="用語集を見る" href="/ja/docs/glossary?term=nonce">nonce</Tooltip> を送信する必要があります。

nonce はアプリケーションで生成され、認証リクエストの `nonce` クエリ文字列パラメータとして送信され、Auth0 から返される <Tooltip tip="IDトークン: リソースへのアクセスではなく、クライアント自体を対象とした資格情報。" cta="用語集を見る" href="/ja/docs/glossary?term=ID+Token">IDトークン</Tooltip> レスポンスに含まれます。これにより、アプリケーションは Auth0 からの IDトークン レスポンスを元の認証リクエストに対応付けることができます。

nonce をどこに含めるかについて詳しくは、[Add Login Using the Implicit Flow with Form Post](/ja/docs/get-started/authentication-and-authorization-flow/implicit-flow-with-form-post/add-login-using-the-implicit-flow-with-form-post) を参照してください。

<Callout icon="file-lines" color="#0EA5E9" iconType="regular">
  [Auth0.js](/ja/docs/libraries/auth0js) は、[クロスオリジン認証](/ja/docs/authenticate/login/cross-origin-authentication) の使用時に `state` パラメータと `nonce` パラメータを自動的に管理します。
</Callout>

<div id="generate-a-cryptographically-random-nonce">
  ## 暗号学的にランダムな nonce を生成する
</div>

暗号学的にランダムな nonce を生成する方法の 1 つは、[Nano ID](https://github.com/ai/nanoid) などのツールや同様のライブラリを使用することです。ただし、この方法ではそのツールを JavaScript コードにバンドルする必要があります。それが難しい場合は、[最新のブラウザー](http://caniuse.com/#feat=cryptography) では [Web Crypto API](https://www.w3.org/TR/WebCryptoAPI/) を使用して、nonce として利用できる暗号学的に安全なランダム文字列を生成できます。

```javascript lines theme={null}
function randomString(length) {
    var charset = '0123456789ABCDEFGHIJKLMNOPQRSTUVXYZabcdefghijklmnopqrstuvwxyz+/'
    result = ''

    while (length > 0) {
        var bytes = new Uint8Array(16);
        var random = window.crypto.getRandomValues(bytes);

        random.forEach(function(c) {
            if (length == 0) {
                return;
            }
            if (c < charset.length) {
                result += charset[c];
                length--;
            }
        });
    }
    return result;
}
```

<div id="persist-nonces-across-requests">
  ## リクエスト間で nonce を保持する
</div>

生成した nonce は、次のいずれかの方法で Web アプリケーション内に保持する必要があります。

* `HttpOnly` <Tooltip tip="セッション Cookie: 存在すると、ユーザーは認証済みと見なされます。" cta="用語集を見る" href="/ja/docs/glossary?term=session+cookie">セッション Cookie</Tooltip>
* HTML5 ローカルストレージの値

例:

```js lines theme={null}
window.localStorage.setItem('nonce', randomString(16));
```

<div id="validate-id-token">
  ## IDトークンを検証する
</div>

Auth0 から [IDトークン](/ja/docs/secure/tokens/id-tokens) が返されたら、このトークンは通常どおり[検証およびデコード](/ja/docs/secure/tokens/id-tokens/validate-id-tokens)する必要があります。
`nonce` クレームには、リクエストで送信した値と完全に同じ値が含まれている必要があります。
そうでない場合、アプリケーションは認証を拒否する必要があります。

```javascript lines theme={null}
var jwt = '...'; // 検証済みおよびデコード済みのIDトークン本文
if (jwt.nonce === window.localStorage.getItem('nonce')) {
    // Nonceは正常です
} else {
    // Nonceが不正です！トークンリプレイ攻撃が発生している可能性があります
}
```

<div id="learn-more">
  ## 詳細情報
</div>

* [Form Post を使用したインプリシットフロー](/ja/docs/get-started/authentication-and-authorization-flow/implicit-flow-with-form-post)
* [Form Post を使用したインプリシットフローにログインを追加する](/ja/docs/get-started/authentication-and-authorization-flow/implicit-flow-with-form-post/add-login-using-the-implicit-flow-with-form-post)
* [OIDC を使用したインプリシットフロー](/ja/docs/authenticate/login/oidc-conformant-authentication/oidc-adoption-implicit-flow)