（著者：クローバ株式会社 門屋 亮）
こんにちは。クローバの門屋です。kintoneには通知機能が標準搭載されているので、普段メールを送信する機会はあまりないのですが、それでもレコードが登録されたときに kintoneのユーザー以外に通知する場合など、kintone からメールを送信したいという要望はあると思います。 今回はプラグインを使って、セキュアにメールを送信する方法について説明します。
SendGridのアカウントを申し込む
kintoneにはメールを送信する機能がありませんので、外部のサービスを利用してメールを送信する必要があります。
今回はSendGridを使うことにしました。SendGridはアメリカのEメール配信に特化したクラウドサービスで、日本では構造計画研究所がローカライズを行っています。国内でも有名なクラウドベンダーがSendGridを利用していることで知られています。基本的には有料のサービスですが、月に12,000通のメール送信までは無料で利用することができます。
新規会員登録ページから、アカウントの登録を行います。プランはまずはFreeプランを選択してください。
※2022年10月時点で、登録には審査があるようです。情報は正確に入力してください。
APIキーを取得する
登録が完了すると、ダッシュボードにログインすることができます。「SETTING」メニューから、「API Keys」をクリックしてAPIキーの設定画面を開きます。
Create API Keyをクリックして新しいAPIキーを作成します。名前はなんでもよいのですが、ここではkintoneとしておきます。生成されたAPIキーはあとで使います。
これでSendGrid側の準備は完了です。
プラグイン作成の準備
今回はプラグインを作成してkintone からメールを送信します。なぜプラグインを作成するかというと、kintone のカスタマイズはJavaScriptを使用するため、ブラウザからSendGridのAPIキーが見えてしまう危険性があるためです。プラグインを利用すると、ブラウザとSendGrid との通信をkintone が中継する際に、kintone 側でヘッダーやデータに任意の情報を付加することができます。これにより、SendGridのAPIキーをkintoneの利用者に知られてしまうことがなくなります。
kintone プラグインの基本的な開発の手順については公開されているドキュメントを参照してください。
https://developer.cybozu.io/hc/ja/categories/200219390
ファイル構成
manifest.json
設定画面の実装
SendGridのAPIキーを設定する設定画面を実装します。
config.html
config.js
ここで注目していただきたいのが、kintone.plugin.app.setProxyConfig()メソッドを呼びだしている部分です。SendGridのAPIではAuthorizationヘッダにAPIキーを乗せて認証を行う仕様になっています。kintone.plugin.app.setProxyConfig()を実行して、指定したSendGridのURLとPOSTメソッドによるプロクシ通信で Authorizationヘッダを付与しています。 kintone.plugin.app.setProxyConfigの詳しい仕様については、公開されているドキュメントを参照してください。
https://developer.cybozu.io/hc/ja/articles/203661160
ユーザー画面の実装
ユーザー画面では、SendGridのAPI呼び出しをラップした新しいメソッドを作成します。 SendGridのAPI仕様は以下のようになっています。
https://sendgrid.kke.co.jp/docs/API_Reference/Web_API_v3/Mail/index.html
例)
| Request | POST https://api.sendgrid.com/v3/mail/send HTTP/1.1 |
| Request Body |
{
"personalizations": [
{
"to": [
{
"email": "john@example.com"
}
],
"subject": "Hello, World!"
}
],
"from": {
"email": "from_address@example.com"
},
"content": [
{
"type": "text/plain",
"value": "Hello, World!"
}
]
}
|
※今回はAPIキーを使用するため、api_userとapi_keyを指定する必要はありません。
desktop.js
パッケージング
こちらの手順を参考にパッケージングを行ってください。
プラグインの実行
プラグインをアプリにインストールして設定画面を開くと、このようになります。
APIキーを入力してOKボタンをクリックすると、APIキーが保存されます。 実際には、以下のようなカスタマイズJSから利用することを想定しています。
カスタマイズJS
レコードを保存すると、指定したアドレスにメールが送信されます。kintoneのレコードから送信先のアドレスを指定するといった応用が可能です。
いかがでしたでしょうか。プラグインの開発は敷居が高いように思われるかもしれませんが、1度やってみるとそれほど難しいものではありません。プラグイン開発で不明な点がありましたら、developer networkで質問してみてください！
このTipsは、2022年10月版で確認したものになります。
お世話になります。
受信者に表示されるＦｒｏｍ名を指定することはできますでしょうか？
k.kawahara 様
本記事では、本文中に記載のある通りSendGridの下記のAPIを利用しています。
https://sendgrid.kke.co.jp/docs/API_Reference/Web_API/mail.html
こちらのリファレンスを確認したところ、恐らく「fromname」が送信者名に該当するのではと思われます。
カスタマイズJSとプラグインのdesktop.jsにパラメータを追加してお試しください。
プラグインにパラメータを追加して実行したところうまくいきました。
ありがとうございました。
お世話になります。
こちらの本文の部分に改行を含めた文を送信したいのですが、
改行コードを入れても改行されません・・
どのように書けばよいでしょうか？
saito-y 様
いつもお世話になっております。developer network事務局です。
こちらはSendGrid側の仕様となります。
ネット上にいくつか設定方法がありましたので、そちらをご確認いただきたいです。
よろしくお願いいたします。
いつもお世話になっております。
このpluginはmobileでも利用可能でしょうか？
PCサイトでは動作するのですが、スマホでは未だ動作できていません。
よろしくお願いいたします。
sora 様
お世話になっております。cybozu developer network 運営事務局でございます。
大変申し訳ございませんが、おちらのプラグインはモバイルではご利用頂けません。
また、今後もモバイル対応は検討していませんので、宜しくお願い致します。
以上、どうぞよろしくお願いいたします。
ご回答頂きありがとうございました。
お世話になっております。
こちらの実装例は、Kintoneの画面にてレコードを登録した場合の実装例ですが、
外部フォームよりKintoneのAPIにてレコード登録した場合でもsendGridでメールを送信することは可能でしょうか。
また、その場合メール本文のカスタマイズはsendGrid側のシステムから行うのでしょうか。
Kakiuchi 様
APIによるレコード登録ではJavaScriptのイベントが発火しませんので、このカスタマイズは利用できなくなります。
一案ですが、kintoneのWebhook機能はREST APIによる登録でもアクションが動作するため、
Zapierなどを経由して実現はできるかもしれません。
（参考）【REST API × Webhook】お客様が来場した時、Slackに通知を送ってみよう！
ご担当者様
>APIによるレコード登録ではJavaScriptのイベントが発火しませんので、このカスタマイズは利用できなくなります。
>一案ですが、kintoneのWebhook機能はREST APIによる登録でもアクションが動作するため、Zapierなどを経由して実現はできるかもしれません。
ご回答いただき、ありがとうございました。
上記の件、承知いたしました。
Zapierでの実現は検討したのですが、「組織間のアクセス権」を有効にしている関係でwebhookを利用することができず、断念いたしました。
お世話になっております。
SendGrid kintone プラグインを使用して 一斉メール送信をしたいと考えております。
1レコード（1案件） に対して 複数のアドレスを指定して送信を行いたいのですが、何か良い方法がございましたらご教授頂けますでしょうか。
tereterekom 様
お世話になっております。cybozu developer network 運営でございます。
下記画像のtoの指定の箇所を複数受け取れるようにすることで実現自体は可能かと思います。
SendgridのAPI仕様については記事に示してあるとおり、こちらをご確認ください。
また、恐れ入りますが、こちらのコメント欄は記事内容のフィードバック目的となっているため、上記試してみてわからないなど、
記事から派生した技術的なご質問はcybozu developer コミュニティをご活用ください。
よろしくお願い致します。
いつもお世話になっております。
このpluginはiphoneでも利用可能でしょうか？（対応されましたでしょうか？）
PCサイトでは動作するのですが、iphoneでは動作できない状態ですが、こちらが仕様であるのか、障害であるのか切り分けができておらず、ご教示いただけますと幸いです。
よろしくお願いいたします。
kento.yamamoto 様
お世話になっております。cybozu developer network 事務局です。
本記事内で紹介しているプラグインは、モバイルに対応しておりません。
どうぞよろしくお願いいたします。
ご回答ありがとうございます。
モバイル対応というのは、iphone上でsafari等で操作する際も上記プラグインは対応していないということでしょうか？
もしくはモバイル用アプリは上記プラグインに対応していない、とうことでしょうか？
kento.yamamoto 様
お世話になっております。cybozu developer network 事務局です。
モバイル対応とは、モバイル版で kintone を表示した場合に対応することをいいます。
モバイルで PC 版の表示を行った場合、動作する可能性がありますが本記事では PC での動作を想定しております。
モバイルで PC 版の kintone を表示する方法については以下のヘルプサイトをご確認ください。