Twilio x SendGrid x Bluemix実践ハンズオン

Twilio x SendGrid x Bluemix 実践ハンズオン

2016 年 1 月 23 日

ハンズオンのゴール

Bluemix

Webフォーム

Web フォームから情報が登録された際、管理者宛にメールを送信します

前提条件

Bluemix アカウントBluemix CLI のインストールGit のインストール

作業の流れ

1. SendGrid サービスの追加2. API キーの生成3. Cloud Foundry アプリの追加4. 環境変数の設定5. サンプルコードの取得6. デプロイと動作確認

SendGrid サービスの追加

SendGrid サービスの追加

Bluemix 経由で SendGrid のアカウントを作成します

SendGrid サービスの追加

1. 「サービス & API 」を選択

2. 「 sendgrid 」で検索

3. 「 SendGrid 」を選択

SendGrid サービスの追加

4. 「 Free package 」を選択

6. サービス配下に「 SendGrid 」ができたことを確認して選択

5. 「作成」を選択

SendGrid サービスの追加

7. SENDGRID ダッシュボードを開く

8. SendGrid ダッシュボードが表示されることを確認

API キーの生成

API キーとは

SendGrid に API 経由でアクセスするための認証情報

API キーの生成

1. 「 SETTINGS > API Keys 」を選択

5. 「 Save 」を選択

3. 名前を入力

2. 「 Generate API Key 」を選択

4. 「 Mail Send 」のFULL ACCESS を選択

API キーの生成

6. API キー

二度と表示されないので Bluemix の環境変数に保存（後述）するまで画面は開いておきます

Cloud Foundry アプリの

追加

Cloud Foundry アプリの追加Bluemix 上に PHP の実行環境を作成します。

Cloud Foundry アプリの追加

1. 「 Cloud Foundry アプリ」を選択 2. 「 WEB 」を選択

Cloud Foundry アプリの追加3. 「 PHP 」を選択

5. 「アプリ名」を入力して完了4. 「続行」を選択

Cloud Foundry アプリの追加

6. 「アプリは稼働しています」となっていることを確認

環境変数の設定

サンプルコードの取得環境変数に SendGrid の API キーなどを設定してアプリケーションから使用できるようにします。

環境変数の設定

2. 環境変数を作成・ API_KEY ：先ほど生成した APIキー・ TO ：メールの宛先・ FROM ：メールの送信元

1. 「ユーザー定義」を選択

サンプルコードの取得

サンプルコードの取得Git を利用してサンプルコードを取得します。

リポジトリhttps://github.com/SendGridJP/form-example-php

$ git clone https://github.com/SendGridJP/form-example-php$ cd form-example-php

コマンドラインで取得する場合

1. 「 Git Bash 」を選択

2. 上記コマンドラインを実行

GUI で取得する場合

1. 「 Git GUI 」を選択

2. 「 Clone Existing… 」を選択

GUI で取得する場合3. 「 Source Location 」にリポジトリ URL を入力

4. 「 Target Directory 」に適当なフォルダパスを入力

5. 「 Clone 」を選択

GUI で取得する場合6. 閉じる

7. Target Direcotry を確認

デプロイと動作確認

デプロイと動作確認サンプルコードを Bluemix にデプロイして動作を確認します。

デプロイと動作確認

1. 取得したサンプルコードを手順に従ってデプロイします※スターター・コードは必要ありません

2. ブラウザからアプリにアクセス

デプロイと動作確認

3. フォームに入力して「 Send 」を選択

4. 送信リクエスト成功

デプロイと動作確認

5. 「 Processed 」と「 Delivered 」を確認

デプロイと動作確認6. メールボックスに以下のようなメールが届いていることを確認

デプロイと動作確認メールが迷惑メールフォルダに入る場合、

・レピュテーションが低い（送信実績がない）　→ https://sendgrid.kke.co.jp/blog/?p=4494・独自ドメイン（ Whitelabel ）設定されていない　→ https://sendgrid.kke.co.jp/blog/?p=3861

などの原因が考えられます。

参考情報

メール送信Node.js 、 Ruby 、 C# 、 Python 、 Java などからメールを送信するサンプルコード　→ https://sendgrid.kke.co.jp/blog/?p=1295

Webhook・ Event Webhook について　→ https://sendgrid.kke.co.jp/blog/?p=753・ Parse Webhook テクニカルガイド　→ https://sendgrid.kke.co.jp/blog/?p=827・サンプルコード　→ PHP ： https://github.com/SendGridJP/webhook-php-example　→ Node.js(express) ： https://github.com/SendGridJP/webhook-express-example　→ Java(liberty) ： https://github.com/SendGridJP/webhook-liberty-example　→ Ruby on Rails ： https://github.com/SendGridJP/webhook-rails-example