OutSystemsからTwilio APIを呼び出してSMSを送信
この記事はOutSystems Advent Calendar 2021、Twilioを使うためのコツ、TIPSなど、Twilioのことなら何でも共有しよう！のそれぞれ24日目です。23日目は@kata_junnさんのOutSystems が誘う Null がない世界の罠、@kimihomさんのTwilio 録音セキュリティの考察と実装でした。
はじめに
今回の記事ではOutSystemsからTwilioのAPIを呼び出してSMSを送信してみます。OutSystemsって何？TwilioでSMSを送信？という場合はこちらを
準備するもの
- OutSystemsアカウント
- Service Studio
- Twilioアカウント（作成方法）
- SMSを受信可能な携帯電話
Twilio APiを呼び出すために必要な情報を取得し、SMS送信可能な番号を取得する
この記事ではTwilioを使ってSMSを送信します。そのため、Twilio認証情報やTwilio番号の情報が必要になります。
Twilioの認証情報はコンソールから確認できます。それぞれ次の値を控えておきます。（Auth Tokenは初期状態で隠れているので念の為Showリンクをクリックし表示しましょう）
- Account SID
- Auth Token
どちらも重要な情報となるため取り扱いには注意します。
SMSを送信可能なTwilio番号をすでに保有している場合は同じ画面で確認できます。
もし、まだ購入していない場合は、こちらのハンズオンに沿ってSMS送信可能な伝番号を取得し、番号を控えておきます。その際、+から始まるE.164フォーマット（例: +8190xxxxyyyy）で控えておきます。
Service Studioを起動し、アプリケーションを作成
インストールしたService Studioを起動しアカウントにログインすると下記の画面からアプリケーションの作成ができます。New Applicationをクリックしまっさらな状態から作成するFrom screatchを選択しました。アプリケーションの種類はReactive Web Appを選択しています。
アプリケーションの名前はズバリSendSMS、何の捻りもありません。
次に提案通りSendSMSモジュールを作成します。
Twilio APIと接続
最初にSMSを送信するMessage resourceAPIを接続します。[Logic]パネルの[Integrations] - [REST]のコンテキストメニューから[Consume REST API...]を選択します。
次にメソッドを追加する方法を選択できますが、TwilioではOpenAPI Specをベータ版として公開しています。
Add multiple methodsを選択するとこのOpenAPI Specを読み込んで追加できます。URLまたはファイルを指定するポップアップにtwilio_api_v2010.jsonを指定します。
メソッド選択画面に一覧が表示されます。今回は、CreateMessageメソッドのみを選択しました。
メソッドで使用できるInput Parameterが自動的に作成されますが、今回使用するものは、AccountSid、Body、From、Toのみなのでほかのパラメータは削除しました。Output Parameterはそのままにしておきます。
また、[Data]タブの[Structures]にも自動的にStructureが作成されます。不要なものについても削除しました。
最後に認証情報を設定します。TwilioApi設定画面のUsernameとPasswordに先ほど確認したAccount SID、Auth Tokenを入力します。
送信画面を作成
今回はテストなので複雑な画面は作成しません。[Interface]タブを開き空のScreenを追加します。送信先と送信内容、送信ボタン、リクエストの結果を表すUIを設定しました。
また、変数も次のように定義しました。
| 変数名 | 型 | 内容 |
|---|---|---|
to |
text | 送信先の電話番号入力フィールドと接続 |
body |
text | 送信内容の入力フィールドと接続 |
response |
text | リクエスト結果を表すテキストエリアと接続 |
accountSid |
text | Twilioのアカウント情報、画面では入力しない |
from |
text | 送信元のTwilio番号、画面では入力しない |
accountSid、fromのDefault Valueに先ほど確認したAccount SIDおよびTwilio番号を指定します
そして、ボタンをクリックした場合のClient ActionSms_OnClickも定義してあります。
ボタンクリック時に呼び出すServer Actionを定義
画面のボタンをクリックした際にSMSを送信させます。Twilioが提供するAPIは基本的にサーバー側アプリケーションから利用することが多いので、Send_Smsという名前がついたServer Actionを作成しました。
このSend_SmsからTwilio APIを呼び出すために次のInput ParameterをServer Actionに追加します。
| 変数名 | 型 |
|---|---|
accountSid |
text |
to |
text |
body |
text |
またAPIからのレスポンスを受け取るために次のOutput Parameterを追加します。
| 変数名 | 型 |
|---|---|
response |
api_v2010_account_message |
このロジックでは先ほど作成したCreateMessageを呼び出し、responseにCreateMessage.Responseに渡すようにしています。
Sms_OnClickからServer Actionを呼び出しレスポンスを画面側の変数に設定
Sms_OnClickからSend_Smsを呼び出します。呼び出し時には画面側の変数をそれぞれServer Actionに渡します。
また、Server Actionから出力された情報のうち、SMSの識別子を表すsidを画面に渡しました。
SMSを送ってみる
アプリケーションをPublishし、テストメッセージを送信します。
携帯にはメッセージが来ました！
ただ、アプリケーション側ではレスポンスをうまくパースできていませんでした。
ちょっと原因がわからないので今回は問題が発生しているsubresource_urisそのものを削除しました。
もう一度メッセージを送ってみると...
今度はエラーが出ずにメッセージSIDが表示されました。やったね！
まとめ・感想
OutSystemsを初めて使ったので基本的な内容になりましたが、Twilio認証情報や番号を固定ではなく、入力できるようにすると予約リマインダーや一斉メッセージ送信アプリケーションをすぐ作れそうだな、と感じました。
今後も試していきたいと思います。
25日目は@taiponrockさんの「外部APIからのデータをテーブルへ表示させる」です。
Discussion