Cognitoが便利そうだけどPHPの既存システムも再利用するにはどうすればいい?」こんにちは、カフーブログのタカフです。本日の記事はたぶん役立つ人にはめちゃくちゃ役立つ記事かと思います。今開発しているアプリにおいてフロントエンドでユーザー認証にCognitoを使おうと思っていますが、サーバーサイド上でAPIを通じてそのユーザーのデータを取得する時などはそのユーザーかどうか検証しなくてはいけません。本記事では、Cognitoで認証されたユーザーがPHP製のAPIを通してデータ提供するにはどうするかをお答えします。公式ドキュメントにいい画像があったのでそのまま引用させて頂きます。ご覧の通り、Cognitoのユーザープールから認証処理で取得したアクセストークンを、バックエンドで検証してこのユーザーにだけ許可されたデータを取得する、というものです。Cognitoのユーザープールのセットアップまずはユーザー認証機構としてCognitoがなくてはならないので早速セットアップをしていきましょう。Cognitoの画面にアクセスして「ユーザープールの管理」から始めます。任意のプール名を入力して「ステップに従って設定する」を選択します。ユーザーログイン時にユーザー名は忘れがちなので、「Eメールアドレスおよび電話番号」の方を選択します。今時ユーザー名ログインってあまり見ないですよね。この選択をした場合は必ずどの標準属性を選択するかのところでemailをONにしてください。僕はこれをONにしてなくてログイン出来なくてハマりました。プール作成後には変更出来ないと記載されてるので作る時は仕様を要検討です。パスワード強度は、警告文言にマケズ、特殊文字と大文字を一旦無しとします。(amazon.co.jp自体は小文字だけでいけたような気がしますが。)ユーザーの自己サインアップはもちろんON「アプリクライアント」までは一旦デフォルト値とします。「アプリクライアントの追加」をします。アプリクライアントの設定です。今回作ろうとしているのはWebベースのスマホアプリなので365日としてます。FacebookアプリやTwitterアプリもスマホ上ではログインなんて初回くらいしか求められないですもんね。要件によっては最長の3650日でもいいかもです。「クライアントシークレットを生成」は今回ブラウザベースのアプリなのでOFFにします。最後に「プールの作成」でユーザープールの作成完了です。僕はjavascriptで作るスマホアプリなら圧倒的にFramework7をオススメします。https://kahoo.blog/app-developing-with-framework7/今回もFramework7をベースに作っていきます。僕の運営しているFramework7日本語サイトもあるよ。https://framework7.jp/ログインセッション確認では本題に入ります。アプリUIを開いた時に現在ログイン中かどうかを調べて、ログインしていないならログイン画面を出すようにします。ログイン中かどうを調べるには以下のコードとなります。ログインしていないので、ログイン画面を開く}ログインしてない場合は、一般的にはログイン画面を出します。Framework7だとこのあたり用意された部品を並べるだけなので楽です。会員登録してない人用に会員登録ページを促します。モックでは「無料会員登録はこちら」リンクで下記のような会員登録画面を開くようにしました。今回の会員登録のモック画面はこんな感じです。上記のような画面でメールアドレスとパスワードを入力して「無料会員登録」を押すとCognitoに対して仮登録をする処理の実装をします。ここまで到達したら成功したのでログイン画面にする。ここではリロードでトップに戻す。});});実際にこれで実行するとメールが届きます。現在のCognitoの管理画面では以下のような状態です。渡してやると、本登録のようになります。Cognitoの管理画面でもユーザーが追加されて、Eメール確認済みがtrueとなります。上記までの処理で会員登録が完了すればログインが可能となります。先ほどのログイン画面での処理を実装します。メールアドレスとパスワードを入力してログインボタンを押下したら、Cognitoに対してログインする処理を実装します。入ればログイン処理が完了して、ローカルストレージにIDトークン・アクセストークン・更新トークンが保存されます。PHP製のAPIでアクセストークンの検証さぁここからがミソのコードとなります。結果としては以下のようなコードとなります。その前にまずjavascript側のコードです。HTTPリクエストのヘッダーのアクセストークンを乗せてajaxでリクエストします。});});Cognitoから取得できるアクセストークンの有効期限は1時間とかなのですが、それではスマホアプリのようにそもそもの人物認証があるデバイスではあまり適していません。先ほどCoginitoで設定した有効期限を365日とした更新トークンというのを使います。トークンを取得すれば内部で更新トークンを使って最新のアクセストークンを取得できるそうです。次にPHP側のコードです。ポイントは、クライアントから送られてきたアクセストークン(JsonWebToken)をBase64デコードして、Cognitoの発行する公開鍵と付き合わせる、です。公式ドキュメントに詳しい解説がアップされています。検証用にhttps://packagist.org/packages/firebase/php-jwt公開鍵変換用にhttps://packagist.org/packages/codercat/jwk-to-pemを使っています。composerからインストールしました。Tokenを公開鍵で検証もかねてデコードします。"errro";}無事decord出来るところまで処理が通れば検証OKということになります。安心してこのユーザーのデータを提供出来ます。まとめ結構な長文記事となってしまいました。Cognitoを使ったアプリ開発で、バックエンドはPHPを使った場合はこれがベースになるかと思います。どんな環境でもつかいまわせることでしょう。お役にたてたらこのツイートのいいね!をお願い致します。CognitoとPHPを使った役立つ記事を書きました。個人的には10いいね!はもらいたいくらいの記事。コメントをキャンセルメールアドレスが公開されることはありません。@kahoo365マナブログに感化されたエンジニアブロガー。ITエンジニア歴は早いもので15年程。Web系技術とオススメPCの記事を中心に情報発信していきます。今は週3六本木でエンジニア業、週2柏でブログ・自社サービス業にいそしむ日々。株式会社カフーの社長さん。MeTwitter人気記事1【レビュー】半年使ってわかった。最近のコメント【レビュー】半年使ってわかった。【レビュー】半年使ってわかった。【レビュー】半年使ってわかった。【レビュー】半年使ってわかった。【レビュー】半年使ってわかった。