Edited at

Cognitoのユーザプールでの認証するところまでを最速でやる


概要

cognitoのユーザプール認証をやる。


  • AWSコンソールでCognitoユーザプールへ登録したユーザを認証する。

  • Amplify使うと色々速い気がするけど、一旦、AWSの公式にに記載されている方法で。。

  • ※実質、Githubに書かれてる手順をなぞるだけになるけど。。


手順


Amazon Cognito Identity SDK for JavaScript をローカルに落とす

どこかのCDNに上がってない?ので、npmで自分でinstallする。

※元ネタ@SDK公式


package.jsonを用意


package.json

{

"private": true
}


npm install する

npm install --save-dev webpack json-loader

npm install --save amazon-cognito-identity-js

node_modules\amazon-cognito-identity-js\dist の中の amazon-cognito-identity.js を後で使う。


ユーザプールの認証をするためのjsの用意

公式ユーザの認証 項に記載されているjavascriptをjsファイルにコピペする。

ここでは test.js というファイル名で保存することにする。

下記注意。


  • username, password をユーザプールにユーザを登録した時のものに書き換える。

  • UserPoolId, ClientId も書き換える。


  • UserPoolIdに入力する値はユーザプールの管理画面の↓の赤枠部分

    image.png


  • ClientIdに入力する値は、画面下の方にある アプリクライアント の右の方にあるエンピツボタンを押し、表示される画面の中の アプリクライアント ID の値。

    image.png



認証を実行する

適当なhtmlを作成し、javascriptとして、amazon-cognito-identity.jstest.js をhtml内で読み込む。

<script src="amazon-cognito-identity.js"></script>

<script src="test.js"></script>

htmlをブラウザで表示し、公式からコピペしたjs内の authenticateUser()onSuccess()result の内の accessToken, IdToken, refreshToken に値が入っていれば成功。


認証できない時

↓のようなエラーが出る場合

TypeError: callback.newPasswordRequired is not a function

コンソールからユーザを登録した場合、初回認証時に強制的にパスワードを変える必要がある。

ので、test.jsauthenticateUser に↓のメソッドを追加する。

※パスワードが password になるのでそこは任意で。

※追加してもエラーが出る場合、リクエストへのレスポンスの内容を見ると何が悪いか書いてあるのでそれ見ながら修正する。

公式の元ネタ

newPasswordRequired: function (userAttributes, requiredAttributes) {

cognitoUser.completeNewPasswordChallenge("password", {}, this)
}


IDプールを使って一時クレデンシャルを取得する

こっち