はじめに
例えば認証付きでAWS上で関数を実行したい時に、Amplify APIのfunctionディレクティブがとても便利でした。
今回はフロントエンドから特定のLambdaを呼び出す流れについてまとめさせていただきたいと思います。
https://docs.amplify.aws/cli/graphql-transformer/function/
実装
API導入
amplify add api
amplify add api
で追加します。
設定の詳細は省きますが、今回はfunctionディレクティブを利用するのでGraphQLにしてください。
schema.graphql
amplify/backend/api/gqllambda/schema.graphql
が生成されているので、こちらのファイルを編集して定義していきます。
type Query {
signup(
email: String!
password: String!
): String
@function(name: "signup-${env}")
}
今回はLambda上のsignup-${env}関数を呼び出すようなイメージとなります。
email/passwordのように引数を渡すことも出来ますし、${env}
を付与することで環境に応じてLambda関数を呼び分けることも出来ます。
また、他にも便利なディレクティブが多々あり、例えば@aws_cognito_user_pools
を付与することでユーザープール認証済みでないと呼び出せないようにしたりも出来ます。
https://docs.amplify.aws/cli/graphql-transformer/directives/
Push
amplify push
amplify push
で設定した内容をPushします。
呼び出し
フロントからの呼び出しです。
Push時に設定したファイルにschema.graphql
の内容が実装されているのでそれを利用します。
import { API, graphqlOperation } from 'aws-amplify'
import { signup } from '../graphql/queries'
await API.graphql(graphqlOperation(signup, { email: '', password: '' }))
TypeScriptで型を明確にしたい場合は、Push時に生成されたAPI定義ファイルをimportすることで対応出来ます。
おわりに
個人的に初めてサーバーレスでフロントエンドアプリケーションの開発をしたのですが、今回のように「なんかLambda用意してフロントから呼び出したいなー」というユースケースはままありました。
誰かの役に立てば幸いです。
何か改善や問題等あればコメントいただけると嬉しいです!
宣伝
株式会社start-up studioでは、コーポーレートガバナンス領域のDX推進を目指しております。
その第一弾として、複雑・膨大・専門的という三重苦を抱える決算開示業務のプロセスを劇的に効率化する「Uniforce -決算開示業務ナビゲーション- 」をリリースしました。
ご興味のある方はお問い合わせください!
https://startup-studio.co.jp/news/e4spzygrs/