JAWS-UG KyotoでCognito User Pool + Serverless Frameworkのハンズオンをやってきました #jawsug

明らかに２時間半で終わる内容じゃなかったですが、強引に完走させてきました。

ハンズオン内容

https://github.com/hideokamoto/serverless-cognito-hands-on/blob/master/README.md

最後に使った会員登録・ログイン・ログアウトなどができるサンプル

補足や余談など

1:”Amazon Cognito Identity SDK for JavaScript”について

Step4 / Step5 でCognito User Poolとの接続に使用したSDKは“Amazon Cognito Identity SDK for JavaScript”です。
Readmeにコードサンプルが乗っているので、今日作ったUserPoolを使って色々試してみてください。

使い方は「scriptタグで読み込む方法」と「webpackなどでビルドする方法」の２種類があり、ハンズオンで出てきたサンプルは後者の方法をとっています。

scriptタグでSDKを利用する場合

https://github.com/aws/amazon-cognito-identity-js/tree/master/distにあるJSファイルをダウンロードして、以下のようにHTMLから読み込みましょう。

    <script src="https://wp-kyoto.net/path/to/aws-cognito-sdk.min.js"></script>
    <script src="https://wp-kyoto.net/path/to/amazon-cognito-identity.min.js"></script>

webpackなどでビルドして利用する場合

npm install --save amazon-cognito-identity-jsでnode_modules/配下に展開されます。
そのあとはconst Cognito = require('amazon-cognito-identity-js')かES6記法で以下のようにして読み込みさせましょう。

import {
  AuthenticationDetails,
  CognitoUser,
  CognitoUserAttribute
} from 'amazon-cognito-identity-js'

2:バックエンドからCognitoにつなぎたい場合

Boto3のCognitoIdentityProviderやJSのAWS.CognitoIdentityServiceProviderを使いましょう。

adminXXXという関数にUserPoolId + 必要な値を渡してやることでよしなにできます。

adminがついてない関数は、initiateAuth()でAccessTokenを取得する必要があります。

3:デスクトップアプリにしたい場合

Step5のサンプルコード、よく見るとnpm run electron:startというコマンドが用意されてます。

npm run build後にこれを実行すると、Electronでデスクトップアプリにできます。

Electron使ってみたかったというだけで仕込んだので動作保証はできませんが、遊び程度になればと思います。

4:「コマンドラインやっぱり苦手」となった場合

安心してください、公式がしれっとダッシュボードアプリを作っています。
Serverless Dashboard

紹介記事：Serverless Dashboardを使ってみる。 | WP-kyoto

5:Cognito User PoolもServerless Frameworkで作りたくなった場合

CloudFormationがCognito User Poolに対応していないので、Custom Resourcesを使うしかありません。

SAM(Serverless Application Model)を使ったバージョンであれば、awslabsにサンプルがありましたので、よかったら試してみてください。
awslabs/aws-api-gateway-developer-portal

そのほか

クラスメソッドの中山さんが登壇された内容については、以下の記事から確認できます。
JAWS-UG京都「SERVERLESS祭 ～サーバレスでアプリを作ってみよう～」で発表してきました #jawsug