Challenge Engineer Life !

エンジニア人生を楽しみたい!仕事や趣味で学んだ技術的なことを書いていくブログです。

SendGrid LabsのThreadsを利用したイベントドリブンな自動メール送信

最近クラウドメールサービスのSendGridで色々と遊んだりしているのですが、色々調べていたら「Threads」なるサービスを見つけました。

threads.io

これはSendGrid Labs(SendGridの中で先端的な取り組みしてるチーム?ですかね?)が提供しているサービスの1つです。

labs.sendgrid.com

トップページで「AUTOMATED BEHAVIOR-DRIVEN EMAIL」とありますが、何かのイベントを契機にSendGrid経由でメール送信するのを簡単にしてくれるサービスです。
2015/8/1現在ではまだベータ版で、無償で使えます。なのでSendGridアカウント持ってる人は色々遊べるのではないかなーと。

f:id:kikutaro777:20150801022107j:plain

イベントは大きく分けて、次の2つの方法によって起こせます

  1. 直接JavaScriptでThreadsを呼ぶ
  2. Segment.comというサービスからThreadsと連携する

両方とも試して簡単にできたので、まず今回は1の方法についてまとめてみます。

設定の流れ

Threadsにユーザ登録して、ログインすると以下のようなDashboardが表示されています。

f:id:kikutaro777:20150801022728j:plain

手順がわかりやすい図になってる形ですね。

  1. イベントの送信(Send events)
  2. SendGridとの接続設定(Connect SendGrid)
  3. 送信元メールの設定(Add Sender)
  4. 送信メールテンプレートの設定(Create Template)
  5. ワークフロー(発火条件)の設定(Create Workflow)

です。

イベントの送信(Send events)

ここでは前述した2つのイベント送信の方法の説明があります。
Segment.comを利用する際にはEvent Keyが必要なのですが、その情報も表示されています(左下)。

f:id:kikutaro777:20150801023941j:plain

で、この右側にある「Live Log」ですが、イベント送信するとここがリアルタイムで更新されていきます。

f:id:kikutaro777:20150801024508j:plain

英語の説明にもあるように、表示されているJavaScriptをコピペするだけでいいです(^^;簡単
今回は自分のローカルに立ってるWebサーバのHTMLに埋め込みました。

<!DOCTYPE html>
<html>
    <head>
        <title>Start Page</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    </head>
    
    <body>
        <h1>Threadsで遊んでみる!</h1>
        <script type="text/javascript">
          <!-- Threads画面でCopyしたJSを張り付けるだけ -->
        </script>
    </body>
</html>

表示してみます。

f:id:kikutaro777:20150801024814j:plain

で、Live Logみてみると

f:id:kikutaro777:20150801024831j:plain

出てきた!

クリックすると、もう少し詳細な属性情報が確認できます。

f:id:kikutaro777:20150801024959j:plain

sourceで「threads」となってますが、例えばこれがsegment.com利用すると下図のように「segment」とでます。

f:id:kikutaro777:20150801025257j:plain

これだけでも何か楽しい(^^;

この後の設定は、このLive Logで出るイベントが契機としてSendGrid経由でメール送信できるようにするものです。

SendGridとの接続設定(Connect SendGrid)

SendGridのアカウントがあれば「connect」を押します。(なければ作成が必要です)

f:id:kikutaro777:20150801025522j:plain

SendGrid側への各種操作のパーミッションが求められるので許可します。

f:id:kikutaro777:20150801025736j:plain

これだけ。設定が完了するとDashboardで「Completed」に変わるので、どこまで設定完了してるか、わかりやすいです。

f:id:kikutaro777:20150801025756j:plain

送信元メールの設定(Add Sender)

メールの送信元情報を設定します。From emailは一応Verifyの確認メールがそこに飛ぶので許可する必要があります。

f:id:kikutaro777:20150801030020j:plain

Verifyが完了すると一覧で「Verified」とStatusが変わるので、これで準備OKです。

f:id:kikutaro777:20150801030238j:plain

送信メールテンプレートの設定(Create Template)

続けて送信するメールのテンプレートを設定します。
この辺、SendGridのテンプレートとか引っ張ってくれると楽なんだけどなぁ、と思いつつ、ちょっと見当たらなかった。

f:id:kikutaro777:20150801030539j:plain

Senderの所はプルダウン式に、先ほど登録したSender情報がでてくるので選ぶだけです。
テンプレートはHTMLとPlain-text、それぞれで書けます。

あとは保存するだけ。

  1. ワークフロー(発火条件)の設定(Create Workflow)

最後に、イベントをベースにどういう条件で発火させるのか、をワークフローで設定します。

f:id:kikutaro777:20150801031401j:plain

とりあえず試したのは、該当URLのWebページが開かれたら、ある特定のメールアドレスにメールを飛ばすというものです。
Conditionで「Page View」を選んで、Single Actionで「Send email」を選択してます。

ちなみにConditionとSingle Actionの他メニューとしては次のようなものがあります。

f:id:kikutaro777:20150801031625j:plain

f:id:kikutaro777:20150801031901j:plain

User Trait辺りはまだよくわかってないです(´・ω・`)

特定のメールアドレスはSpecific emailを選ぶと、メアドが打てます。

f:id:kikutaro777:20150801032041j:plain

これで全て「Completed」になり準備万端です。

f:id:kikutaro777:20150801032314j:plain

Identifyの追加

で、再び最初のLive Logで確認しながらイベントを起こしたのですが、メールが送信されない orz

な、なぜ、と調べたらIdentifyをつけないといけないとのことです。support.threads.io

最初にコピペしたJavaScriptにidentifyの呼び出しを追加

threads.load("igVCDv"),threads.page()}}(window,document);
threads.identify('userId', { email: 'userId@xxxx.co.jp' });

Live LogみるとIdentifyも識別されて、無事メールが飛びました!
f:id:kikutaro777:20150801032900j:plain

受信したメール

f:id:kikutaro777:20150801033013j:plain

ちゃんとトリガーかかるとWorkflowsのStatsで「X times triggered」のところに回数がでるので、発火したかどうか確認できます。

f:id:kikutaro777:20150801033151j:plain

細かく書いたので、長く感じますが、既にアカウントとか持ってたりすれば5~10分くらいでできちゃうかと。

時間取れれば次にSegment.comから使ったほうも書きたい。そちらだとJavaからも遊べるんかな。

にほんブログ村 IT技術ブログへ
にほんブログ村 にほんブログ村 IT技術ブログ Javaへ
にほんブログ村