Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

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

553 views

Published on

SendGridハンズオンの資料

Published in: Internet
  • Be the first to comment

  • Be the first to like this

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

  1. 1. Twilio x SendGrid x Bluemix実践ハンズオン 2016年1月23日
  2. 2. ハンズオンのゴール Bluemix Web フォーム Webフォームから情報が登録された際、 管理者宛にメールを送信します
  3. 3. 前提条件 Bluemixアカウント Bluemix CLIのインストール Gitのインストール
  4. 4. 作業の流れ 1. SendGridサービスの追加 2. APIキーの生成 3. Cloud Foundryアプリの追加 4. 環境変数の設定 5. サンプルコードの取得 6. デプロイと動作確認
  5. 5. SendGridサービスの 追加
  6. 6. SendGridサービスの追加 Bluemix経由でSendGridのアカウント を作成します
  7. 7. SendGridサービスの追加 1. 「サービス & API」を選択 2. 「sendgrid」で検索 3. 「SendGrid」を選択
  8. 8. SendGridサービスの追加 4. 「Free package」を選択 6. サービス配下に「SendGrid」 ができたことを確認して選択 5. 「作成」を選択
  9. 9. SendGridサービスの追加 7. SENDGRID ダッシュ ボードを開く 8. SendGridダッシュボード が表示されることを確認
  10. 10. APIキーの生成
  11. 11. APIキーとは SendGridにAPI経由でアクセスするための 認証情報
  12. 12. APIキーの生成 1. 「SETTINGS > API Keys」 を選択 5. 「Save」を選択 3. 名前を入力 2. 「Generate API Key」を選択 4. 「Mail Send」の FULL ACCESSを選択
  13. 13. APIキーの生成 6. APIキー 二度と表示されないのでBluemixの環境変数に保存(後述) するまで画面は開いておきます
  14. 14. Cloud Foundryアプリの 追加
  15. 15. Cloud Foundryアプリの追加 Bluemix上にPHPの実行環境を作成します。
  16. 16. Cloud Foundryアプリの追加 1. 「Cloud Foundry アプリ」を選択 2. 「WEB」を選択
  17. 17. Cloud Foundryアプリの追加 3. 「PHP」を選択 5. 「アプリ名」を 入力して完了 4. 「続行」を選択
  18. 18. Cloud Foundryアプリの追加 6. 「アプリは稼働しています」 となっていることを確認
  19. 19. 環境変数の設定
  20. 20. サンプルコードの取得 環境変数にSendGridのAPIキーなどを設定してアプリ ケーションから使用できるようにします。
  21. 21. 環境変数の設定 2. 環境変数を作成 ・API_KEY:先ほど生成したAPIキー ・TO:メールの宛先 ・FROM:メールの送信元 1. 「ユーザー定義」を選択
  22. 22. サンプルコードの取得
  23. 23. サンプルコードの取得 Gitを利用してサンプルコードを取得します。 リポジトリ https://github.com/SendGridJP/form-example-php
  24. 24. $ git clone https://github.com/SendGridJP/form-example-php $ cd form-example-php コマンドラインで取得する場合 1. 「Git Bash」を選択 2. 上記コマンドラインを実行
  25. 25. GUIで取得する場合 1. 「Git GUI」を選択 2. 「Clone Existing…」を選択
  26. 26. GUIで取得する場合 3. 「Source Location」にリポジトリURLを入力 4. 「Target Directory」 に適当なフォルダパスを 入力 5. 「Clone」を選択
  27. 27. GUIで取得する場合 6. 閉じる 7. Target Direcotryを確認
  28. 28. デプロイと動作確認
  29. 29. デプロイと動作確認 サンプルコードをBluemixにデプロイして動作を確認し ます。
  30. 30. デプロイと動作確認 1. 取得したサンプルコードを手順に従って デプロイします ※スターター・コードは必要ありません 2. ブラウザからアプリにアクセス
  31. 31. デプロイと動作確認 3. フォームに入力し て「Send」を選択 4. 送信リクエスト成功
  32. 32. デプロイと動作確認 5. 「Processed」と「Delivered」を確認
  33. 33. デプロイと動作確認 6. メールボックスに以下のような メールが届いていることを確認
  34. 34. デプロイと動作確認 メールが迷惑メールフォルダに入る場合、 ・レピュテーションが低い(送信実績がない) →https://sendgrid.kke.co.jp/blog/?p=4494 ・独自ドメイン(Whitelabel)設定されていない →https://sendgrid.kke.co.jp/blog/?p=3861 などの原因が考えられます。
  35. 35. 参考情報
  36. 36. メール送信 Node.js、Ruby、C#、Python、Javaなどからメールを 送信するサンプルコード →https://sendgrid.kke.co.jp/blog/?p=1295
  37. 37. 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

×