TwilioのProgrammable Chatで動画を送信してみる
動画のやり取りができるチャットを作りたいと思い、TwilioのProgrammable ChatのMedia Messageの機能を検証してみました。
Programmable Chatとは
Programmable Chatは、リアルタイムのバックエンドを構築、またはスケーリングすることなくWebおよびネイティブのモバイル・アプリケーションへのチャット機能の追加を容易にします。 Chatは開発者のビジネスロジックに統合し、確実に使いこなすにあたって必要なAPiと機能を提供します。
出典: https://jp.twilio.com/docs/chat
要するに汎用的なチャット機能を提供してくれるサービスです。
基本的な機能について、以下の記事で紹介されていますのでご参照ください。
[Tutorial] Twilio Programmable Chatを使ってチャット機能を実装する
やってみる
今回はこちらのサンプルプロジェクト https://github.com/TwilioDevEd/sdk-starter-node に機能を加えて、ファイルをアップロードできるようにしてみます。
Twilioのセットアップ
まずはTwilioの設定を行います。
- Twilioのアカウント（フリープランで構いません）を作成します。
- Programmable Chatサービスを作成します。
- Programmable Chat > Base Configuration から Service SIDを控えておきます。
- Twilioの設定からアカウントSIDと、APIキーを発行してAPIキー、シークレットを控えておきます。
サンプルプロジェクト
サンプルプロジェクトをforkして、READMEに従い.envファイルに値を設定します。
そしてサンプルプロジェクトのChatページにMedia Messageを送受信する機能を追加しました。
npm start でローカルサーバを起動して http://localhost:3000/chat/ にアクセスすると以下のページが表示されます。
ファイルを選択してテキストエリアにカーソルがある状態でEnterキーを押すと、選択したファイルが送信されます。また、 load message の部分をクリックすると、Messageを読み込んで、MediaのTemporaryURLを取得してconsole.logに出力するようにしています。
以下はTwilioのコンソールで確認できたアップロードされたMediaです。
TemporaryUrlは以下の形式になります。有効期限は300秒のようです。
https://media.us1.twilio.com/{MediaのSID}?Expires={UnixTime}&Signature={省略}&Key-Pair-Id={省略}
感想
良い点
MediaへのアクセスはTemporaryUrl（一時的なURL）でアクセスするようになっており、Media Messageを参照する権限がある人、つまりチャンネルの参加者のみがそのURLを発行可能となっています。
また料金がMediaのデータ保存量だけで、トラフィック料金がかからないので費用面で優しいです。
制限や課題
Mediaの最大サイズは150MBに制限されています。動画で150MBというと、画質をスマートフォンでまあまあきれいに見られるレベルに落として、せいぜい5分程度の長さでしょうか。動画を送るにはギリギリのラインという感じです。
また、動画の変換処理などはありませんので、送信側で予め変換しておくか、Programmable ChatのWebhookの処理でどうにかする、ということになるかと思います。別のアイディアとして、Media Messageを使わずに、動画は別のサービスにアップロードしておいて、MessageのAttributesに動画のidだけを設定しておいて、動画は別のサービスから取得する、という方法も可能と思います。次回はその検証を行いたいと思います。
