2023年5月1日を持ちまして、株式会社KDDIウェブコミュニケーションズのTwilioリセール事業が終了したため、本記事に記載されている内容は正確ではないことを予めご了承ください。

MESHを使って、Twilio経由で電話をかけてみる

はじめに

MESHとは、Sonyさんが提供しているIoTデバイスです。
ボタンや人感センサー、動きセンター、温度センサーなどが用意されていて、スマホのアプリ上でドラッグ・アンド・ドロップでそれぞれを接続し、思いついた機能を簡単に実装することができます。
今回は、このMESHを使って、Twilio経由で電話をかけてみたいと思います。

Twilioとは

たった数行でプログラムから電話をかけたり、電話を受けることができるAPIサービスです。
Twilioについては、こちらをご覧ください。

しくみ

MESHには、MESH SDKという外部のWebサービスと連携するためのしくみが用意されており、今回はこのSDKを使って、Twilioの機能を呼び出したいと思います。

システムフロー

MESHのスマホアプリ上に、MESHのボタンタグ（ボタンではなくても良いです）と、今回作成するTwilio用のタグを配置し、それぞれを接続します。
ボタンが押下されると、Twilioタグからajax経由でTwilioのRest APIをコールします。
Rest APIが電話をかけ、相手が応答したらTwilio上に予め作成しておいたTwiML Appsを呼び出すようにします。
TwiML Appsには、あらかじめ応答させたいメッセージを記述しておき、それを使って電話機に音声を流します。

なお、電話をかける相手を毎回変更したり、音声メッセージを都度変更したい場合などは、別途外部の公開サーバーを用意する必要がありますが、今回のように、決められた相手にのみ、決まったメッセージだけを流したい場合はサーバーを用意する必要はありません。

Twilio側の準備

まずは、Twilioのアカウントが必要です。
Twilioアカウントの取得は、こちらからできます。
今回のテストは、トライアルアカウントでも実行することができます。
アカウントを作成したら、050から始まる電話番号を１つ購入しておいてください。なお、トライアルアカウントの場合は、発信先として指定できるのは、認証済み電話番号のみとなりますので、ご注意ください。

Twilioをアカウントを取得したら、早速設定をしていきましょう。

TwiML Binsを作成する

相手に流したい音声を定義しておきます。
Twilioアカウントを使って、管理コンソールにログインします。
左側のボタンメニューをクリックし、スライドしてきた一覧の中から「デベロッパーセンター」を選択します。

デベロッパーセンターの一覧から、「TwiML Bins」を選択し、「＋」アイコンを押して、新しいTwiML Binsを作成します。

以下のようなTwiMLを作成します。
FRENDLY NAME:　MeshCall

TwiML

<?xml version="1.0" encoding="UTF-8"?>
<Response>
  <Say language="ja-JP">こんにちは。メッシュのボタンが押されたよ。</Say>
</Response>

上記TwiML内の「こんにちは。〜」の部分が、実際に電話がかかったあとに流れるメッセージになりますので、必要に応じて変更してください。
画面中央下部に、緑色で「Valid TwiML」と表示されるのを確認して、「Create」ボタンを押します。

TwiML Binsが作成できたら、画面上部にあるコピーアイコンを押して、作成したTwiML BinsのURLをコピーし、どこかにメモしておきます。

TwiML Appsを作成する

次に、いま作成したTwiML Binsを呼び出すためのTwiML Appsを作成します。
左側のボタンメニューを押して、スライドしたメニューの中から「電話番号」を選択します。

電話番号メニューの中の、「ツール」の中から「TwiML Apps」を選択し、さらに「＋」アイコンを押してTwiML Appsを新規で作成します。

フレンドリーネーム: MeshCall
REQUEST URL: 先程作成したTwiML BinsのURL

最後に「保存」ボタンを押します。

MESHのソフトウェアタグを作成するための情報を集める

このあとの作業で利用する情報をTwilio上から集めておきます。

AccountSIDとAuthToken

左側のホームボタンを押して、そこに表示されるACCOUNT SIDとAUTH TOKENを控えておきます。なお、AUTH TOKENについては、標準では見えないようになっているので、目のアイコンをクリックして確認してください。

TwiML AppsのSID

先ほど作成したTwiML Appsをもう一度開き、SIDを調べて控えておきます。

以上で、Twilio側の準備はすべて終了です。

MESH SDKを使って、ソフトウェアタグを作成する

MESH SDKのページに移動し、「Start using the MESH SDK」ボタンを押します。

「Create New Account」をクリックして、新規にユーザアカウントを作成します（メールによる本人確認があります）。

アカウントの作成が済んだら、作成したアカウントでログインをします。

タグを作成するには、「Create New Tag」を押します。

タグに適当な名前をつけます（図では「Twilio Call」）。
Functionにも名前をつけます（図では「Call」）。
Input Connectorの右側の「+」アイコンを押して、Input Connectorを一つ作成します。

Codeの中の「Execute」をクリックし、以下のコードを記載します。

JavaScript

// Twilio経由で電話をかけるAPI
var apiURL = "https://api.twilio.com/2010-04-01/Accounts/[ACCOUNT SID]/Calls.json";
 
//APIを叩く際のパラメータ
//プロパティの値を渡す
var data = {
    "To" : "+8190XXXXXXXX", // 発信先の電話番号（E.164形式）
    "From" : "+8150XXXXXXXX", // Twilioで購入した050番号（E.164形式）
    "ApplicationSid" : "[TwiML Apps SID]"
};
 
ajax ({
    url : apiURL,
    data : data,
    type : "post",
    timeout : 5000,
    success : function ( contents ) {
        log("Call success");
        callbackSuccess( {
            resultType : "continue",
        } );
    },
    error : function ( request, errorMessage ) {
        log("Call Error");
        callbackSuccess( {
            resultType : "continue",
        } );
    },
	beforeSend: function(xhr) {
		var credentials = Base64("[ACCOUNT SID]:[AUTH TOKEN]");
		xhr.setRequestHeader("Authorization", "Basic " + credentials);
	}
});
 
return {
    resultType : "pause"
};

// BASE64処理
function Base64(str) {
        return btoa(unescape(encodeURIComponent(str)));
};

コードの中に書かれている[ACCOUNT SID]、[AUTH TOKEN]、[TwiML Apps SID]は、先程控えておいた値に書き換えてください。
また、発信先の電話番号（トライアルアカウントでテストするときは、認証済み番号のみ指定が可能です）と、購入した電話番号も適切な値に書き換えてください。
電話番号の指定方法は、E.164形式となりますので、先頭の「0」を「+81」に書き換える必要があります（例：090-1234-5678→+819012345678）。

ここまで出来たら、画面上部のSaveボタンを押して、登録を完了します。
以上で、MESHのソフトウェアタグができました。

スマホのMESHアプリを使ってテストをする

スマホのMESHアプリを起動して、新しいレシピを作成します。

ボタンタグをペアリングしてください。

右上のメニューから「SDK」を選択します。

SDKのアカウントでログインします。

カスタムタグにSDKで作成したタグが表示されます。

画面上のタグには、Twilioのロゴが表示されていますが、今回の手順で作成した場合にはロゴは表示されません。

作成したソフトウェアタグを画面上にドラッグし、ボタンタグと紐付けます。

お疲れ様でした。以上で設定は全て終わりです。
あとは、MESHのボタンタグを押して電話がかかってくれば成功です。