kintoneでFAX受信箱をつくろう(サーバーレス編)


kintoneでFAX受信箱をつくろう(サーバーレス編)

はじめに

みなさん、こんにちは。
KDDIウェブコミュニケーションズのTwilio事業部エバンジェリストの高橋です。

以前、以下のような記事を書いたのですが(2,000以上のViewがあってびっくり)、これだとpythonのプログラムを用意しなくてはいけなくて、ちょっとハードルが高いです。
kintoneでFAX受信箱をつくろう

そこで今回は、Twilioのサーバーレス環境であるTwilio Functionsを使って、別にサーバーなどを用意しなくてもTwilioとkintoneだけでFAX受信をするしくみを作りたいと思います。

FAXには、Twilio FAXを利用します。Twilio FAXでは、050番号を使ったFAXの送受信をプログラムで制御可能なため、今回のように受信したFAXを自動的にkintoneに保存するようなソリューションでも活躍します。

準備

以下の環境が必要です。

  • Twilioアカウント(アカウントの作成方法→こちら
  • 着信用電話番号(Twilioで購入した050番号)
  • kintoneアカウント
  • Twilio CLI(インストール方法→こちら
  • Serverless Plugin(インストール方法→こちら

インストール

git clone https://github.com/mobilebiz/fax2kintone-function.git
cd fax2kintone-function
npm install
cp .env.sample .env
cp assets/twiml.sample.xml assets/twiml.xml

kintoneアプリの準備

assetsディレクトリの中に、FAX-APP.zipというテンプレートアプリがあるので、それをkintoneに読み込みます。

テンプレートアプリの読み込み方法については、こちらをご覧ください。

アプリが読み込めたら、次にAPIトークンを生成してください。今回使うAPIトークンでは、レコード閲覧の他に、レコード追加の権限が必要になりますので、チェックを入れておきます。

APIトークンの生成方法は、こちらを参考にしてください。なお、作成したAPIトークンはメモ帳などに保存しておいてください。

今回のアプリには以下の3つのフィールドが定義されています(フィールドコードは変更しないでください)。

フィールド名 フィールドコード 説明
受信日時 receivedDate FAXが格納された日時が自動的に設定されます
発信番号 from_ 発信者の電話番号がE.164形式で保存されます
添付ファイル pdf 受信したFAXデータがPDF形式で保存されます

.envファイルの編集

エディタで.envファイルを開き、以下の項目を編集します。

【注意】先頭の2行(ACCOUNT_SIDとAUTH_TOKEN)は編集しないようにしてください。

項目名 設定内容
MASTER_ACCOUNT_SID ACから始まるTwilioのAccountSid
KINTONE_DOMAIN ご自分のkintoneのサブドメイン名(xxxxx.cybozu.comのxxxxxの部分)
KINTONE_APP_ID 作成したkintoneのアプリID(アプリIDは、URLから判別可能です。https://(サブドメイン名).cybozu.com/k/(アプリのID)/)
KINTONE_API_TOKEN 先程控えておいたAPIトークン

ローカルテスト

以下のコマンドでローカル実行します。

npm start
(中略)
┌────────────────────────────────────────────────────────────────────────┐
│                                                                        │
│   Twilio functions available:                                          │
│   ├── [protected] /del-faxes | http://localhost:3000/del-faxes         │
│   └── [protected] /save2kintone | http://localhost:3000/save2kintone   │
│                                                                        │
│   Twilio assets available:                                             │
│   ├── /FAX-APP.zip | http://localhost:3000/FAX-APP.zip                 │
│   ├── /fax-sample.pdf | http://localhost:3000/fax-sample.pdf           │
│   ├── /twiml.sample.xml | http://localhost:3000/twiml.sample.xml       │
│   └── /twiml.xml | http://localhost:3000/twiml.xml                     │
│                                                                        │
└────────────────────────────────────────────────────────────────────────┘

上記のようにローカル起動が成功したら、以下のURLをブラウザで開きます。

http://localhost:3000/save2kintone?FaxStatus=received

画面上にOKと表示されて、kintoneアプリ側には1件データが登録されていれば成功です。

ローカル実行を終了するには、Ctrl-Cを押します。

サーバーにデプロイ

以下のコマンドでサーバーにデプロイします。

twilio serverless:deploy

(中略)

✔ Serverless project successfully deployed

Deployment Details
Domain: fax2kintone-function-XXXX-dev.twil.io
Service:
   fax2kintone-function (ZSxxxxxxxxxxxxxxxxxxxxxxx)
Environment:
   dev (ZExxxxxxxxxxxxxxxxxxxxxxx) 
Build SID:
   ZBxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
View Live Logs:
   https://www.twilio.com/console/assets/api/ZSxxxxxxxxxxxxxxxxxxxxxxxx/environment/ZExxxxxxxxxxxxxxxxxxxxxxxxxxxx
Functions:
   [protected] https://fax2kintone-function-XXXX-dev.twil.io/del-faxes
   [protected] https://fax2kintone-function-XXXX-dev.twil.io/save2kintone
Assets:
   https://fax2kintone-function-XXXX-dev.twil.io/FAX-APP.zip
   https://fax2kintone-function-XXXX-dev.twil.io/fax-sample.pdf
   https://fax2kintone-function-XXXX-dev.twil.io/twiml.sample.xml
   https://fax2kintone-function-XXXX-dev.twil.io/twiml.xml

表示された結果の中の、Functions項目にあるsave2kintoneへのリンクURLをメモ帳に保存してください。

assets/twiml.xmlの編集

エディタでassets/twiml.xmlを開きます。

3行目に書かれているaction=で指定しているURLを上でメモしたリンクURLに書き換えます(シングルクォーテーションを削除しないように気をつけてください)。

編集が完了したら、上書き保存します。

再度デプロイ

twiml.xmlを編集したので、もう一度以下のコマンドでデプロイします。

twilio serverless:deploy

(中略)

Functions:
   [protected] https://fax2kintone-function-XXXX-dev.twil.io/del-faxes
   [protected] https://fax2kintone-function-XXXX-dev.twil.io/save2kintone
Assets:
   https://fax2kintone-function-XXXX-dev.twil.io/FAX-APP.zip
   https://fax2kintone-function-XXXX-dev.twil.io/fax-sample.pdf
   https://fax2kintone-function-XXXX-dev.twil.io/twiml.sample.xml
   https://fax2kintone-function-XXXX-dev.twil.io/twiml.xml

デプロイが完了したら、最後に表示されたtwiml.xmlへのリンクURLをメモ帳に保存してください。

電話番号の設定

Twilioの管理コンソールにログインします。

  • スライドメニューからPhone Numbersを選択し、番号の管理 > アクティブな電話番号を選択します。
  • 購入済みの電話番号の一覧から、今回FAX着信に利用する電話番号を選択して設定画面を開きます(電話番号がリンクになっています)。
  • Voice & Faxセクションの中の、ACCESPT INCOMINGを、Faxesに変更します。
  • A FAX COMES INのプルダウンをWebhookにし、その右側の欄に先程メモしたtwiml.xmlのリンクURLを記載します。さらに右側のプルダウンからHTTP GETを選択します。
  • Saveボタンを押します。

テスト

以上ですべての設定が完了です。

設定した電話番号にFAXを送信してみて、kintoneに格納されることを確認してください。

補足

上記説明にはないのですが、FunctionsフォルダにはTwilio上のFAXリソースを削除するプログラム(del-faxes.protected.js)が入っています。Protectedなので、外部からは起動できませんが、ローカル実行時はhttp://localhost:3000/del-faxesで実行することができます。
特に使う必要はありませんが、使う場合は送信中のFAXを含めてTwilio上のFAXリソースがすべて削除されるので注意してください。

まとめ

Pythonプログラムが要らないとはいえ、CLIの準備とかそれなりにハードルが高かったかもしれませんね。
ただ、Twilio CLIとTwilio Functions(とくにServerless Plugin)は、開発に慣れている方であれば、ほとんどのことがコマンドベースで実行できるので、いっぱい触ってぜひ慣れてください。


Twilio(トゥイリオ)とは

https://cloudapi.kddi-web.com
Twilioは音声通話、メッセージング(SMS/チャット)、ビデオなどの 様々なコミュニケーション手段をアプリケーションやビジネスへ容易に組み込むことのできるクラウドAPIサービスです。初期費用不要な従量課金制で、各種開発言語に対応しているため、多くのハッカソンイベントやスタートアップなどにも、ご利用いただいております。