はじめに
Instapage というサービスをご存知でしょうか？
このサービスは簡単に言うと LP 作成サービスです。
以下のような LP をコーディングを一切することなく作成することができる便利なサービスです。
いくつか Instapage に関する日本語の記事もあります。
これは私の同僚が書いた記事。
この Instapage を私のチームのマーケターも使っていたのですが、以下のような相談を受けました。
「LP でユーザーがコンバージョンしたらすぐにコンタクトを取りたいのですが、コンバージョンしたら Slack に通知させることってできませんかね...？」
少し調べてみると Instapage そのものに Slack 連携機能はありませんでしたが、Webhook はあったのでこれを使って Slack に通知させることにしました。
解決策
以下のように AWS の API Gateway + Lambda を使って Slack 通知を実現することにしました。
Instapage から Webhook を API Gateway に飛ばして、それを lambda を用いて slack の Incoming Webhook を使って通知させるようにしました。
実装
AWS
まずは AWS 側の設定です。まずは API Gateway のコンソールから REST API を作成します。
そして POST メソッドを作成して「API のデプロイ」を行います。
この辺はクラスメソッドの以下の記事を参考にしていただけると良いと思います。
次に Lambda の設定をします。Lambda のトリガーに先程作った API Gateway を設定します。
そして Lambda 関数を実装します。今回は Ruby で以下のように書きました。
require 'slack-notifier' def post_slack(event:, context:) user_name = event['user_name'] content = event['content'] text = "名前：#{user_name}\n\n" + content Slack::Notifier.new( 'webhook_urlをここに入れる', channel: '#チャンネル名', username: 'LPからの問い合わせがありました', attachments: [{ 'text': text }] ).ping '' end
今回は slack-notifier という gem を使っています。
これで AWS 側の設定は終了です。
Instapage
次は Instapage 側の設定です。これは公式ドキュメント通りに設定していくと良いです。以下では公式ドキュメントの画像を引用しながら説明していきます。
まずは Form Integration の設定画面にいきます。
次に Webhook のエンドポイントに先程デプロイした API の URL を入力します。
そして次のトークンは空欄で進み、method は POST + JSON を選択します。
次の Fields は名前入力欄の Webhook Fields には Lambda で event['user_name'] で取って来ているので user_name として、問い合わせ内容入力欄は同様の理由で content とします。
これで設定完了です。無事、Slack に通知されるようになりました。
終わりに
LP の実装ってぶっちゃけめんどくさいですよね。。作業ゲーになる上にコーディング量が多くなりがちで時間は掛かるので。
LP 作成をマーケターの方にやってもらえるのは本当にありがたくて、そのおかげでプロダクト開発に多くの時間を使えるようになるので今回の Slack 通知の実装はマーケターに少し恩返しができて良かったなと思いました。