Upload
katsumi-takahashi
View
675
Download
0
Embed Size (px)
Citation preview
自己紹介
髙橋克己(たかはしかつみ)
facebook: http://fb.com/katsumi.takahashi
グローバル・インターネット・ジャパン株式会社 代表取締役
独立系ソフトハウスに勤務後、1994年に独立。主に、通信事業者向けの研修の企画・運営と、Webサービスの開発を中心に事業を展開。フルスタックエンジニア。Twilio-UG 東京メンバー。
Twilioの素晴らしいところ• 電話とWebが統合されている • 電話屋さん以外でも電話を扱える • 本社(SF)がイケイケ
7月のシリーズE投資ラウンドで1億3000万ドルを調達!時価総額は10億ドル超!
「Twilioは簡単です」(100回以上は聞いたフレーズw)
<?php header("content-type: text/xml"); echo "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n"; ?> <Response> <Say>こんにちは</Say> </Response>
わずか数行で電話とWebが連携します
Status Callbackのトリガー(発信時)• Initiated:Twilioが発信した時 • Ringing:相手側を呼び出している時 • Answered:相手が応答した時 • Completed (デフォルト):切断された時 • Completed以外は有料です($0.0001/event)
• 何を通知してくれるのか(これ以外の情報が付加されることもあります)
Status Callbackの内容
CallSid 通話の識別子
AccountSid ユーザのTwilioアカウントID
From 発信者番号(E.164フォーマット)
To 宛先番号(E.164フォーマット)
CallStatus 通話の状態(後ページ)
ApiVersion Twilio APIのバージョン
Direction 着信 or 発信(inbound/outbound-api/outbound-dial)
ForwardedFrom 転送されたかどうか(日本では通知されない)
CallerName 発信者IDの検索結果(オプション、1.5円/回)
+26696687は非通知発信です
Updateって?• 現在通話中の通話を変更する必殺技 • /2010-04-01/Accounts/{AccountSid}/Calls/{CallSid}にPOST
Helperライブラリ(Node.js)での利用例
どんな時に使うの?• 相手の反応を待たずに、次の動作を行いたい
• 準備ができるまで待たせて、準備ができたら対応する。 • 強制的に切断する。 • 途中で別の通話先にリダイレクトする。
<Gather>ではできない操作はupdateで
今回のハンズオンでも利用します• 相手に<Play>で音声を流す。 • 次に伝えたい文章を作成する。 • 相手の反応を待たずに、次の<Play>を実行する。
Twilio 相手先サーバCall() ダイヤリング
応答Request URL
TwiML wav再生
Update()
Request URL
TwiML wav再生
<Gather>は入らない
Node.jsって?• JavaScriptを用いた、Non-blocking I/O環境 • 実質シングルスレッド(イベントループ型) • 内部にGoogle V8(高速なJavaScript実行環境)を採用 • パッケージ管理(npm) もちろんTwilioのライブラリもある • Webサーバー自身をNode.jsで作成可能 • ExpressやSocket.ioなど、有用なフレームワークがある • io.js(Node.jsのFork)と和解し、Node.jsは4.xへ
Socket.ioって?• リアルタイムWebを実現するNode.js用のサーバライブラリとブラウザ用のJavaScriptライブラリ
• WebSocket以外に、ポーリングなどをサポートすることで、ブラウザ依存せずにリアルタイムWebが可能
• 0.9系と1.0系で仕様がだいぶ変わった点に注意 • socket.emit(event, data)でイベントを送信 • socket.on(event, callback)でイベントを受信
Twilioとの相性は?• 電話はそもそも、相手とつながった後は双方向通信。 • 音声通話と連動させたWebアプリでは、リアルタイムWebが必要になる。 • 例えば、
• 音声を電話で聞かせながらスライドを表示させるようなサービス。
• チャットと連動して音声を流すサービス(今回のハンズオン)。
Twilio用にSocket Clientを用意Socket serverブラウザ
Socket Client Twilio 通話先
TwilioはSocket非対応
Twilio用 Socket Client
emit()
emit()
emit()emit()
RestAPI
詳しくは後ほどハンズオンで
RestAPI
どんなアプリケーションなのか• ブラウザから電話をかける(話者も選べる) • 電話が応答する(しばらく待てとガイダンス) • ブラウザで文字を入力する • エンターキーをトリガーにして、音声に変換(AITalk) • 音声データを再生(必殺技の「Update」を使う!) • 続けてブラウザで文字を入力する(以後繰り返し) • ブラウザから通話を切断する(再び「Update」炸裂!)
全体イメージ
Twilio
Socket サーバ
TwilioSocket
クライアント
Socket クライアント 電話機
Twilio制御
UserToCenter CenterToUser
CenterToTwilio
TwilioToCeter
Socket.ioのイベント名
PSTN
ブラウザ
heroku
AITalk制御
AITalk WebAPI
sio.js twilioClient.js
twi.js
ai.js
user.js Single Page Application