Cross-Originリソース共有を構成する

Before you start

セキュリティ上の理由により、アプリケーションのオリジンURLが承認済みURLのリストに含まれている必要があります。アプリケーションのAllowed Callback URLs（許可されているコールバックURL）に追加されていない場合は、Allowed Origins (CORS)（許可されているオリジン（CORS））のリストに追加する必要があります。
Allowed Web Origins（許可されているWebオリジン）が、アプリケーションのSettings（設定）ビューで要求を行うドメインに設定されていることを確認してください。URLはサブドメインにワイルドカードを含めることができますが、ドメインURLの後に相対パスは使用できません。詳細については、「サブドメインのプレースホルダー」をお読みください。
カスタムドメインを有効化しない場合は、cross-origin認証のフォールバックとして、Auth0.jsを使う検証ページを作成する必要があります。

Auth0では、ユニバーサルログインを通じた認証トランザクションの処理を強く推奨しています。そうすることにより、ユーザーの認証が最も簡単で安全になります。ただし、状況によっては、ログインをアプリケーションに直接埋め込む必要がある場合もあります。埋め込みログインが必要な場合は、アプリケーションでcross-originリソース共有（CORS）を構成する必要があります。

CORSは、Auth0 Dashboardを使用して構成できます。

cross-origin認証を構成する

［Dashboard］>［Applications（アプリケーション）］>［Applications（アプリケーション）］の順に移動し、アプリケーションの名前をクリックして表示します。
［Cross-Origin Authentication（Cross-Origin認証）］で、［Allow Cross-Origin Authentication（Cross-Origin認証を許可する）］をオンに切り替えます。
［Allowed Origins (CORS)（許可されているオリジン（CORS））］に、アプリケーションのオリジンURLを入力します。オリジンについての詳細は、Mozilla MDN Web Docs の「Origin」をご覧ください。
［Save Changes（変更を保存）］をクリックします。

アプリケーションにCORSを使う必要がない場合は、［Allow Cross-Origin Authentication（cross-origin認証を許可する）］が無効であることを確認してください。

cross-origin検証ページを作成する

状況によっては、サードパーティのクッキーを利用できない場合があります。特定のバージョンのブラウザーではサードパーティのクッキーがサポートされておらず、仮にサポートされていても、ユーザーの設定で無効にされている場合があります。

サポートされているブラウザーでは、サードパーティのクッキーが無効になっている場合に対応するために、アプリケーションの専用ページでAuth0.js SDKのcrossOriginVerificationメソッドを使用できます。

Chrome、Opera、Safariなど、サポートされていないブラウザーでは、サードパーティのクッキーが無効になっている場合、カスタムドメインを有効にしない限り、cross-origin認証は機能しません。

Safariの構成では、「サイト越えトラッキングを防ぐ」設定としてインテリジェントトラッキング防止機能が使用されています。その結果、残念ながら認証にサードパーティクッキーを役立てることもできなくなります。ここで、トークンの更新に及ぶ影響の一例をご紹介します。

アプリケーション内で、Auth0.jsのWebAuthをインスタンス化するページを作成します。crossOriginVerificationを直ちに呼び出します。ページの名前は自由に指定できます。
codeblockOld.header.login.configureSnippet
```


<head>
  <script src="https://cdn.auth0.com/js/auth0/9.11/auth0.min.js"></script>
  <script type="text/javascript">
    var auth0Client = new auth0.WebAuth({
      clientID: '{yourClientId}',
      domain: '{yourDomain}'
    });
    auth0Client.crossOriginVerification();
  </script>
</head>
```
Was this helpful?
/
サードパーティのクッキーが利用できない場合、Auth0.jsは異なるcross-origin検証フローを呼び出すためにiframeをレンダリングします。
［Dashboard］>［Applications（アプリケーション）］>［Applications（アプリケーション）］の順に移動し、アプリケーションを選択して表示します。
［Cross-Origin Authentication（Cross-Origin認証）］で、作成したコールバックページのURLを「Cross-Origin Verification Fallback URL（Cross-Origin検証URL） 」フィールドに追加します。
運用環境では、ページのURLがlocalhostをポイントしていないことを確認してください。ページは埋め込みログインフォームがホストされているのと同じドメイン内にあり、httpsスキーマのURL形式でなくてはなりません。
［Save Changes（変更を保存）］をクリックします。

詳細については、GitHubのcross-origin認証サンプルをご覧ください。

エラーコードと説明

エラーの説明は、人間が判読できるように書かれています。いつでも変更される可能性があり、コードで解析することはできません。

Auth0.js v9（およびLock）が埋め込みログインに使用されると、/co/authenticateエンドポイントが呼び出され、以下のエラーが発生します。

ステータス	コード	説明
`400`	`invalid_request`	無効な要求本文。client_id、credential_type、username、otp、realmのすべてが必要で、これ以外があってはなりません。
`400`	`unsupported_credential_type`	不明な資格情報タイプのパラメーター。
`400`	`invalid_request`	不明な領域の存在しない接続。
`401`	`unauthorized_client`	クロスオリジンのログインは許可されていません。
`401`	`password_leaked`	使用しているパスワードは（このアプリケーションではなく）データ侵害により以前開示されたため、このログイン試行はブロックされました。
`403`	`access_denied`	間違ったメールアドレスまたはパスワード。
`403`	`access_denied`	認証エラー
`403`	`blocked_user`	ブロックされているユーザー
`429`	`too_many_attempts`	複数の連続したログイン試行の後にアカウントがブロックされました。ご希望の連絡方法を使用して、ブロック解除の手順を記載した通知を送信しました。
`429`	`too_many_attempts`	疑わしいログイン動作を検知したため、今後の試行はブロックされます。管理者に問い合わせてください。

さらに、errorまたはerror_descriptionプロパティがない一般的な403 エラーも発生する可能性があります。応答のボディは、次のようになります：

Origin https://test.app is not allowed.（オリジンのhttps://test.appは許可されていません）

ブラウザーテストのサポート

以下のブラウザーでは、サードパーティのクッキーが無効になっている場合でもcross-origin認証を使用できます。

Microsoft Internet Explorer

SameSiteクッキー属性

これまで、samesiteクッキー属性にはtrue、false、strict、laxのオプションがありました。属性が手動で設定されていない場合、Auth0はデフォルト値のfalseを使用していました。

2020年2月より、Google Chrome v80によるクッキーの取り扱いが変更され、Auth0はこれを受けて以下の変更を行いました。

samesite属性のないクッキーにはlaxが設定されます。
sameSite=noneのクッキーにはセキュリティ保護が必要です。保護されていない場合、ブラウザーのcookie jarには保存できません。

これらの変更はセキュリティを強化し、クロスサイトリクエストフォージェリ（CSRF）攻撃からの防御を目的にしています。

はじめに