【Postman】Cognitoのアクセストークン・IDトークン取得を自動化する

f:id:hesma2:20210207134224p:plain

PostmanでAPIのテストをする際に、毎回何かしらの手段でCognitoのトークンを取得してAuthorizationヘッダーにコピペするのはとても面倒です。
そのトークンを楽に取得して複数のAPIで使いまわせるようにできないか、試してみたので共有します。

動作環境

MacOS Catalina 10.15.7
Postman 8.0.4

これまではどうしていたのか

サービスにログインした後、開発者ツールを呼び出してLocalStorageからトークンをコピー。
その後Postmanの環境変数を上書きする、というなんとも面倒なことをしていました。

f:id:hesma2:20210207140105p:plain
環境変数にコピペ

f:id:hesma2:20210207140159p:plain
Authorizationタブでは {{token}} を指定していた

OAuth2.0でトークンを取得する

まずはCognito側の設定を行います。

アプリクライアントの作成

f:id:hesma2:20210207140841p:plain
Cognitoユーザープールのアプリクライアントの作成

f:id:hesma2:20210207141015p:plain
このアプリクライアントIDを後で使用します

アプリクライアントの設定

アプリの統合 > アプリクライアントの設定

  • 有効なIDプロバイダのCognito User Poolにチェック
  • コールバックURLを https://https://oauth.pstmn.io/v1/callback に設定
  • OAuthフローで Implicit grant にチェック
  • OAuthスコープで openid にチェック(アプリで必要な情報があれば他にもチェック)

f:id:hesma2:20210207141534p:plain
アプリクライアントの設定

ドメイン名の設定

アプリの統合 > ドメイン

f:id:hesma2:20210207141955p:plain
ドメイン名を設定

PostmanのOAuth2.0でトークンを取得

AuthorizationタブでOAuth2.0を選択、Configure New TokenでCognitoユーザープールのアプリクライアントの情報を入力

  • Token Nameは任意の名前を入力
  • Grant Typeは Implicit
  • Callback URLの下の「Authorize using browser」にチェック
  • Auth URLに設定したドメイン名 + authorizeのURLを入力
  • ClientIDにアプリクライアントIDを入力(環境変数に入れることを推奨されます)
  • Scopeに openid を設定

f:id:hesma2:20210207142301p:plain
OAuth2.0でConfigure New Tokenを設定

Get New Access Token をクリック

ブラウザに新しいタブが作られるので、ユーザープールに登録されたユーザーでログインすることでトークンが取得できます。

f:id:hesma2:20210207142449p:plain
トークン取得に成功

MANAGE ACCESS TOKENSにトークンが追加されます

f:id:hesma2:20210207142539p:plain
取得できたトーク

Access Token以外にも、いくつかの項目が同時に取得されています。

  • Token Type
  • id_token
  • expires_in

最後に、User Tokenをクリックすることで自動的にリクエストヘッダーにアクセストークンが追加されます!

f:id:hesma2:20210207143003p:plain
自動で追加されたトーク

もう少し便利にするために

このトークン取得 -> 追加を全てのリクエストで行うのは面倒なので、Collectionsで設定してあげましょう。

f:id:hesma2:20210207143211p:plain
Collectionの・

リクエストと同様にAuthorizationタブがあるので、ここからトークンを取得 -> 追加を行いましょう。

そうすることで、このCollection内のリクエスト全てのヘッダーにアクセストークンが追加されます!!

アクセストークンじゃなくてIDトークンを自動で追加したいんだけど・・・

この方法で追加されるのはアクセストークンで、IDトークンの方は選択できません...
取得自体は楽にできたけど、IDトークンを使うにはコピペが必要です、残念ながら...

私自信IDトークンが必要だったので、他の手段がないかネットを漁りました。
結論から言うと見つかりませんでした...

以降は、ダメだった方法を、なぜダメだったのか紹介します。

IDトークンをいい感じに取得したい!

【ダメだった】MANAGE ACCESS TOKENSからIDトークンを選択して貼り付けられないの!?

f:id:hesma2:20210207142539p:plain
取得したトークンの情報が見れるこれ

同じような問合せやIssueが存在していましたが、まだ解決はされていないようです。(2021年2月7日時点)

community.postman.com

github.com

github.com

【できなくもない】Cognitoのトークンエンドポイントから取得して環境変数にscriptで格納する

前提として、Cognitoユーザープールのアプリクライアントの設定を変更する必要があります。
具体的には、OAuthフローで Client credentials を許可します。

私の環境では Client credentials への変更は許可されておらず断念しましたが...

f:id:hesma2:20210207144845p:plain

PostmanでCognitoのトークンエンドポイントへのリクエストを作成します。
トークンエンドポイントのURLやパラメータについては下記URLを参照ください。

docs.aws.amazon.com

f:id:hesma2:20210207145142p:plain
トークンエンドポイントへのリクエストを作成

リクエストの結果からトークンを取得して環境変数に格納するスクリプトを、Tests に記述します。
本来はテストに使われますが、リクエストの後に実行されることから Post-request Scripts として使用することも可能です。

f:id:hesma2:20210207145941p:plain
※ イメージです

ここまでできるのであれば、Pre-request Scriptsでトークンの有効期限チェック -> トークン取得 -> 環境変数格納を実装することも可能かもしれません。

gist.github.com

【ダメだった】AuthorizationタブのOAuth2.0でできることを、自前のリクエストとスクリプトで再現する

OAuthフローで Client credentials を許可できなかった私。
次に考えたのは、AuthorizationタブのOAuth2.0でできることを、自前のリクエストとスクリプトで再現することでした。

まずは認可エンドポイントへのリクエストを作ります。
認可エンドポイントについてはこちら

docs.aws.amazon.com

f:id:hesma2:20210207151049p:plain
認可エンドポイントへのリクエストを作成

このリクエストを実行すると、ブラウザの新規タブが立ち上がる。
そこでログインが成功すると、アクセストークンやIDトークンがレスポンスとして帰ってくる。
それをTestsのスクリプト環境変数に格納すれば...

なんてことを妄想していました。

結果としては、ログインを促すポップアップなりブラウザなりが立ち上がりませんでした。

f:id:hesma2:20210207151438p:plain
リダイレクト先で表示されるhtmlがレスポンスとして返ってくるだけ

f:id:hesma2:20210207151518p:plain
ブレビューで表示できるがSignInはできない

他にもPre-request Scriptsでリクエストを送ってみたりしましたが、結果として実現はなりませんでした。(技術や知識不足も否めませんが...)

まとめ

  • アクセストークンの取得なら自動化できる
  • IDトークンの取得は一部自動化できる
    • CognitoユーザープールのアプリクライアントでClient credentials のフローを許可できる場合
    • それ以外の場合は、取得自体は簡単にできるがそれを利用するためにコピペが必要