KaQiita

新米 Web エンジニアが適当なことを書いてます。温かく見守ってやってください。

Instapage の LP がコンバージョンしたら Slack に通知するようにした話

はじめに

Instapage というサービスをご存知でしょうか?

このサービスは簡単に言うと LP 作成サービスです。

instapage.com

以下のような LP をコーディングを一切することなく作成することができる便利なサービスです。

f:id:KakkiiiiKyg:20200712204015p:plain

いくつか Instapage に関する日本語の記事もあります。

www.ptengine.jp

これは私の同僚が書いた記事。

note.com

この Instapage を私のチームのマーケターも使っていたのですが、以下のような相談を受けました。

「LP でユーザーがコンバージョンしたらすぐにコンタクトを取りたいのですが、コンバージョンしたら Slack に通知させることってできませんかね...?」

少し調べてみると Instapage そのものに Slack 連携機能はありませんでしたが、Webhook はあったのでこれを使って Slack に通知させることにしました。

解決策

以下のように AWSAPI Gateway + Lambda を使って Slack 通知を実現することにしました。

f:id:KakkiiiiKyg:20200712205602p:plain

Instapage から Webhook を API Gateway に飛ばして、それを lambda を用いて slack の Incoming Webhook を使って通知させるようにしました。

実装

AWS

まずは AWS 側の設定です。まずは API Gateway のコンソールから REST API を作成します。

f:id:KakkiiiiKyg:20200712210602p:plain

そして POST メソッドを作成して「API のデプロイ」を行います。

この辺はクラスメソッドの以下の記事を参考にしていただけると良いと思います。

dev.classmethod.jp

次に Lambda の設定をします。Lambda のトリガーに先程作った API Gateway を設定します。

f:id:KakkiiiiKyg:20200712211039p:plain

そして 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 の設定画面にいきます。

f:id:KakkiiiiKyg:20200712212228p:plain

次に Webhook のエンドポイントに先程デプロイした API の URL を入力します。

そして次のトークンは空欄で進み、method は POST + JSON を選択します。

f:id:KakkiiiiKyg:20200712212618p:plain

次の Fields は名前入力欄の Webhook Fields には Lambda で event['user_name'] で取って来ているので user_name として、問い合わせ内容入力欄は同様の理由で content とします。

これで設定完了です。無事、Slack に通知されるようになりました。

f:id:KakkiiiiKyg:20200712213124p:plain

終わりに

LP の実装ってぶっちゃけめんどくさいですよね。。作業ゲーになる上にコーディング量が多くなりがちで時間は掛かるので。

LP 作成をマーケターの方にやってもらえるのは本当にありがたくて、そのおかげでプロダクト開発に多くの時間を使えるようになるので今回の Slack 通知の実装はマーケターに少し恩返しができて良かったなと思いました。