この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。
はじめに
こんにちは、中村です。 本日は、API GatewayとLambdaでLIFFアプリを構築します。CloudfrontやS3を使ったホスティングなどいろんな方法がありますが、APIリクエストしてデータを取得する仕組みの構築等が必要になります。しかし、API GatewayとLambdaを利用した方法であれば、LambdaからDynamoDBへアクセスしデータを取得する等で済みます。
API GatewayとLambdaでLIFFアプリを構築する
まずは、Lambdaを作成します。githubを参照してもらうとわかりますが、Lambdaのレスポンスは簡単なHTMLデータです。Lambdaプロキシ統合を利用するため、このようなレスポンスになります。
return {
statusCode: 200,
isBase64Encoded: false,
headers: {
'Content-Type': 'text/html'
},
body: html
}
次にAPI Gatewayです。API Gatewayのダッシュボードから、APIの作成をクリックして作成してください。作成が完了したら、GETメソッドを追加します。
リクエストの検証については、LIFFアプリ上で行なっているので特段設定はしません。統合リクエストでは、Lambdaプロキシ統合の使用にチェックを入れてください。
メソッドレスポンスにてLambdaのレスポンス本文はtext/htmlなのでコンテンツタイプを変更しておきます。
ここまで設定が完了したら、ステージを作成しAPIをデプロイしてください。デプロイ後はステージからAPIのURLを確認します。これを元にLIFFを設定するのでメモしておいてください。
次に、LINEボットへLIFFを紐づけていきます。LINE開発者コンソールにて紐付けたいボットのメニューからLIFFを開いてください。
LIFFの画面に遷移したら、追加ボタンをクリックし情報を入力していきます。完成すると、LIFFのURLが払い出されます。このURLにアクセスするとLIFFが起動します。
テスト
LINEでLIFFを開いてみましょう。まずは、アプリを承認するフローがあります。LIFFではAPIでメッセージ送信やプロフィールの確認が出来てしまうためです。同意するとLIFFが開きます。今回はわかりやすいようにLINEのユーザーIDをポップアップで表示しています。
API GatewayとLambdaでLIFFを表示することができました!
まとめ
LIFFのベースができました。Lambdaをバックエンドにすることでデータ取得方法が簡単に構築できると思います。
チャットボット開発は弊社にご相談ください。
またAmazon Connectのキャンペーンを行なっております。こちらもご相談お待ちしております。