はじめに

Auth0が発行するアクセストークンが無いと呼び出せないWebAPIを作成してみます。

管理画面にAPIを登録

Auth0の管理画面のAPIsのページを開き右上のCREATE APIを押します。

作成するWebAPIの情報としてNameとIdentifierを入力します。

Nameは機能に影響しないので後から見てなにを表しているかわかりやすい名前をつけたほうが良いです。

Identifierはテナント内で一意となる識別子であれば形式はなんでも良いですが、Auth0はURL形式を推奨しています。
Identifierは後から変更することができないので注意してください。

Singning AlogorithmはRS256とHS256の2択となっています。
RS256だと署名が、HS256だとHMACがトークンに付与されます。選択したアルゴリズムに合わせてWebAPIはトークンを検証します。
本記事ではRS256で設定を行います。

入力が完了したらCREATEを押すとAPIが登録されます。

登録したAPIのSettingsタブを開くとAPIの設定を変更できます。
この画面でこのAPI向けのアクセストークンの有効期限を変更したり、リフレッシュトークンの利用可否を設定することが可能です。

Permission設定

権限設定をやってみます。

Permissionsタブを開いてPermissionとDescriptionを設定します。

後ほど出てくるWebAPIのサンプルアプリケーションで定義されているread:messagesを追加します。

WebAPIの準備

WebAPIのサンプルアプリケーションがAuth0公式で用意されているのでそちらを利用します。
Auth0-SamplesのGitHubリポジトリにはいくつかAPIのサンプルがありますが本記事ではExpressのWebAPIのサンプルアプリケーションを使用します。

管理画面でAPIを登録するときにRS256を選択しているのでサンプルアプリケーションもそれに合わせて01-Authorization-RS256を使用します。

中に.env.exampleというファイルがあるので.envにリネームし中身を書き換えます。
AUTH0_AUDIENCEは先ほど管理画面で登録したAPIのIdentifierを設定しAUTH0_DOMAINにはAuth0のテナントのドメインを設定します。

.env

AUTH0_AUDIENCE={API_IDENTIFIER}
AUTH0_DOMAIN={DOMAIN}

設定が完了したらコマンドを入力してWebAPIを起動させます。

npm run start

成功すればlocalhost:3010で起動します。

アクセストークンの取得

準備したWebAPIにはAuth0が発行する専用のアクセストークンがないと呼び出せないAPIがあります。
WebAPIと同一テナントに登録されているアプリケーションであればどれからでも専用のアクセストークンを取得できますが
本記事では簡単に試すためにAPIを登録したときに自動で作成されるTest Applicationを利用します。

Machine to Machine Applicationsタブを開くとAPIと接続可能なアプリケーションの一覧が表示されます。
本記事で登録したAPIの場合はexample (Test Application)が自動で作成されたテストアプリケーションになります。

テストアプリケーションの右側のトグルボタンがAUTHORIZEDとなっていることを確認し>を押します。
PERMISSIONSの一覧が表示されるので先ほど登録したread:messagesにチェックをいれてUPDATEを押します。

次にTestタブを開くとテストアプリケーションからアクセストークンを取得する方法が記載されているのでその内容を参考にCLIでアクセストークンを取得します。

アクセストークンを取得するときにaudienceパラメーターで対象のAPIのIdentifierを指定することでそのAPI専用のアクセストークンを取得しています。
テナント名、クライアントID、クライアントシークレットには適切な値を設定してください。

curl --request POST \
     --url https://テナント名/oauth/token \
     --header 'content-type: application/json' \
     --data '{"client_id":"クライアントID","client_secret":"クライアントシークレット","audience":"https://example.com/","grant_type":"client_credentials"}'

成功すればアクセストークンが取得できます。

{
  "access_token": "eyJhbG...............",
  "token_type": "Bearer"
}

取得したアクセストークンはJWT形式になっています。
jwt.ioというサイトでアクセストークンをデコードして中に含まれている情報をみることができるので試してみてください。
アクセストークンの中にaudプロパティにIdentifierの値が入っていることとscopeプロパティにPermissionの内容が含まれていることが確認できます。

WebAPIを呼び出す

WebAPIをCLIで呼び出してみます。
WebAPIのサンプルアプリケーションにはpublic、private、private-scopedの3つのAPIが定義されているのでそれぞれ試します。

最初にpublicのAPIを呼び出してみます。
このAPIはアクセストークンがなくても呼び出し可能なのでアクセストークンを使用していません。

curl --request GET \
  --url http://localhost:3010/api/public

{"message":"Hello from a public endpoint! You don't need to be authenticated to see this."}

次にprivateのAPIを呼び出してみます。
このAPIはアクセストークンが必須なのでauthorizationヘッダーにアクセストークンを設定します。
アクセストークンには実際のアクセストークンを設定します。

curl --request GET \
  --url http://localhost:3010/api/private \
  --header 'authorization: Bearer アクセストークン'

{"message":"Hello from a private endpoint! You need to be authenticated to see this."}

アクセストークンなしで呼び出すとエラーになります。

curl --request GET \
  --url http://localhost:3010/api/private

{"message":"No authorization token was found"}

最後にprivate-scopedのAPIを呼び出します。
こちらも同様にアクセストークンには実際のアクセストークンを設定します。

curl --request GET \
  --url http://localhost:3010/api/private-scoped \
  --header 'authorization: Bearer アクセストークン'

{"message":"Hello from a private endpoint! You need to be authenticated and have a scope of read:messages to see this."}

private-scopedのAPIはアクセストークンの有無だけではなくPermissionを保持しているかまで判断しています。
試しにMachine to Machine Applicationsタブで設定したread:messagesのPermissionのチェックを外してテストアプリケーションがPermissionを持っていない状態で取得したアクセストークンを使ってAPIを呼び出すと下記のエラーメッセージが返ってきます。

Insufficient scope

おわりに

アクセストークンが無いと呼び出せないWebAPIを公式のサンプルアプリケーションを使って用意してみました。
Auth0はログイン機能だけではなくAPIを守る仕組みも提供してくれます。ぜひ活用してみてください。