Okta

オクタ

はじめに

Auth0では、OAuth2.0(RFC6749)で定義されている「Authorization Code Flow」「Authorization Code Flow with PKCE(Proof Key for Code Exchange)」「Implicit Flow」など、各種認証認可フローに対応しています。Auth0及びAuth0で提供されるSDKを利用すると、各フローを簡単に実装できます。

本ページでは、Authentication Code Flow(RFC6749 4.1)を例として、Auth0利用時におけるシーケンスを確認します。確認にあたり、必要となるAuth0設定とアクセストークン/IDトークン取得までの具体的な手続きを紹介します。

前提

本ページ記載の機能及び設定に関する内容は、2023年1月現在の情報となります。

Auth0におけるAuthorization Code Flow

Auth0におけるAuthorization Code Flowのシーケンスは、以下の通りです。

  • ユーザ:アプリ上のログインリンクをクリック
  • アプリ:ユーザをAuth0 /authorize(認証エンドポイント)へリダイレクト
  • Auth0:ログイン画面及びアクセス許可画面へリダイレクト
  • ユーザ:認証及びアクセス許可同意操作を実施
  • Auth0:認可コードと共に、アプリケーションへリダイレクト
  • アプリ:アプリのクライアントID及びクライアントシークレットと共に、認可コードをAuth0 /oauth/token(トークン取得エンドポイント)へ送信
  • Auth0:認可コード、アプリのクライアントID及びクライアントシークレットを検証
  • Auth0:IDトークンとアクセストークンを応答
  • アプリ:アクセストークンを利用して、リソースサーバのAPIエンドポイントに対して情報を要求
  • API:アクセストークンの検証、要求された情報を応答

事前設定

上記シーケンスの確認にあたり、Auth0側で必要な事前設定を以下の通りです。

※本手順では、リソースサーバとして「https://example.com」を指定しますが、実際にはリソースを提供するものではありません。

  • Application設定
  • Auth0管理画面で、[Applications] > [Applications]をクリック
  • Applicationを新規作成
  • Single Page Applicationを選択
Single Page Applicationを選択
  • Allowed Callback URLsとして、リソースサーバのURLを登録
Allowed Callback URLsとして、リソースサーバのURLを登録
  • 作成後、払い出されたClient IDとClient Secret値を確認
作成後、払い出されたClient IDとClient Secret値を確認
  • API設定
  • Auth0管理画面で、[Applications] > [APIs]をクリック
  • APIを新規作成
  • IdentifierとしてリソースサーバのURLを登録
IdentifierとしてリソースサーバのURLを登録

確認手順概要

Auth0におけるAuthorization Code Flowのシーケンスを確認します。確認手順の概要は、以下の通りです。

  • Auth0 /authorizeエンドポイントへ認可コードをリクエスト
  • Auth0による認証画面表示:ユーザ認証を実施
  • 1.で指定したリダイレクト先へ遷移:URLから認可コードを確認
  • Auth0 /oauth/tokenエンドポイントにアクセスし、アクセストークンとIDトークンを取得
  • 取得したアクセストークンとIDトークンを確認
  • 取得したアクセストークンを利用してリソースサーバのAPIへリクエスト

確認手順

1. Auth0 /authorizeエンドポイントへ認可コードをリクエスト

Webブラウザで以下URLへアクセス

https://<YOUR_AUTH0_TENANT_NAME>.<REGION_DOMAIN>.auth0.com/authorize?audience=https://example.com&response_type=code&scope=openid profile email&client_id=kqapeCKisQFv3ensODztuWSvX4dYzDzz&redirect_uri=https://example.com

補足

  • <YOUR_AUTH0_TENANT_NAME>:Auth0テナント名
  • <REGION_DOMAIN>:Auth0テナントリージョン名
  • audience=https://example.com:事前設定におけるAPI設定のIdentifier
  • response_type=code&scope=openid:Authorization Code Flow利用+IDトークン取得
  • client_id:事前設定におけるApplication設定のClient ID
  • redirect_uri:認証完了後のリダイレクト先URL
2. Auth0による認証画面表示:ユーザ認証を実施
Auth0による認証画面表示:ユーザ認証を実施
3. 1.で指定したリダイレクト先へ遷移:URLから認可コードを確認
1.で指定したリダイレクト先へ遷移:URLから認可コードを確認
https://example.com/?code=LfsgBMfG4Gs_TxysEr_6yXREFb2W10a0UrL9VIwEzZpjz
4. Auth0 /oauth/tokenエンドポイントにアクセスし、アクセストークンとIDトークンを取得
> curl -X POST --url 'https://<YOUR_AUTH0_TENANT_NAME>.<REGION_DOMAIN>.auth0.com/oauth/token' --header 'content-type: application/x-www-form-urlencoded' --data 'grant_type=authorization_code&client_id=kqapeCKisQFv3ensODztuWSvX4dYzDzz&client_secret=gp2_bmVL-1qgHiZvh5Cv2GwxkLBard8fZD8UBBUYM5AQ5wD-_pfcuSyokX133GSo&code=LfsgBMfG4Gs_TxysEr_6yXREFb2W10a0UrL9VIwEzZpjz&redirect_uri=https://example.com'

補足

  • grant_type=authorization_code:Authorization Code Flow利用
  • client_id:事前設定におけるApplication設定のClient ID
  • client_secret:事前設定におけるApplication設定のClient Secret
  • code:3.で取得した認可コード
取得結果
{
	"access_token":"eyJhbGciOiJSUzI1NiIsInR5cCI6Ikp...(略)...VCIsImtpYXNwzy896vw",
	"id_token":"eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVC...(略)...DMWec6Qrv7nR4R8Aw",
	"scope":"openid profile email",
	"expires_in":86400,
	"token_type":"Bearer“
}
5. 取得したアクセストークンとIDトークンを確認

jwt.ioにてアクセストークン、IDトークンをデコード

アクセストークンのデコード結果
{
	"iss": "https://<your_auth0_tenant_name>.<region_domain>.auth0.com/",
	"sub": "auth0|63914fc35f596748bf001439",
	"aud": [
	"https://example.com",
	"https://<your_auth0_tenant_name>.<region_domain>.auth0.com/userinfo"
	],
	"iat": 1672296731,
	"exp": 1672383131,
	"azp": "kqapeCKisQFv3ensODztuWSvX4dYzDzz",
	"scope": "openid profile email"
}

補足

  • リソースサーバ(audクレーム)として、認可コードリクエスト時にaudienceパラメータで指定した対象に加えて、Auth0 /userinfoエンドポイント(ログインユーザ情報取得)が自動的に追加されます。
    Multiple audience - Auth0 docs
  • アクセストークンの有効期限(expクレーム)は、デフォルト設定で86,400秒(24時間)となります。有効期限は、API設定にて変更可能です。
    Update Access Token Lifetime - Auth0 docs
IDトークンのデコード結果
{
  "nickname": "xxxxxxxx",
  "name": "xxxxxxx@xxxxxxxx.co.jp",
  "picture": "https://s.gravatar.com/avatar/24b5f30a0fe65625e5afb...(略)...%2Fim.png",
  "updated_at": "2022-12-27T10:50:42.856Z",
  "email": "xxxxxxx@xxxxxxxx.co.jp",
  "email_verified": true,
  "iss": "https://<your_auth0_tenant_name>.<region_domain>.auth0.com/",
  "sub": "auth0|63914fc35f596748bf001439",
  "aud": "kqapeCKisQFv3ensODztuWSvX4dYzDzz",
  "iat": 1672296731,
  "exp": 1672332731,
  "sid": "SqBjbek-b0pWC5zmampoHm4M3Rnl_pVL"
}

補足

  • IDトークンの有効期限(expクレーム)は、デフォルト設定で36,000秒(10時間)となります。有効期限は、Application設定にて変更可能です。
    Update ID Token Lifetime - Auth0 docs
6. 取得したアクセストークンを利用してリソースサーバのAPIへリクエスト

Auth0 /userinfoエンドポイントに対して、ログインユーザ情報をリクエスト

> curl --request GET --url 'https://<YOUR_AUTH0_TENANT_NAME>.<REGION_DOMAIN>.auth0.com/userinfo' --header 'Authorization: Bearer eyJhbGciOiJSUzI1NiIsInR5cCI6Ikp...(略)...VCIsImtpYXNwzy896vw' --header 'Content-Type: application/json'
取得結果
{
	"sub":"auth0|63914fc35f596748bf001439",
	"nickname":"xxxxxxxx",
	"name":"xxxxxxx@xxxxxxxx.co.jp",
	"picture":" https://s.gravatar.com/avatar/24b5f30a0fe65625e5afb...(略)...%2Fim.png",
	"updated_at":"2022-12-27T10:50:42.856Z",
	"email":"xxxxxxx@xxxxxxxx.co.jp",
	"email_verified":true
}

おわりに

Auth0におけるAuthorization Code Flowの動きとして、認可コードのリクエストからアクセストークン/IDトークンの発行までをご紹介しました。Authentication Code Flowの動きとAuth0による実装の理解に役立てていただければ幸いです。

参考

お問い合わせ・資料請求

株式会社マクニカ  Okta 担当

月~金 8:45~17:30