[twilio] Twilio受信管理アプリを作る (AmazonLinux + nginx + php-fpm + Twilio PHP SDK)


PHPで、Twilioに蓄積された録音メッセージの一覧を表示してみます。
また、録音データの再生や削除もできるようにしてみます。


# 前提条件

## 公開サーバ環境

* (参考) Amazon Linux環境の構築
   * キーペアの作成 (新規): http://qiita.com/tcsh/items/59303d9506ca7d13f744
   * インスタンスの作成 (Public): http://qiita.com/tcsh/items/ae8f1f0d706237327c5a


## Webサーバ + PHP環境

* Twilio Post用サーバ環境を構築してみる (AmazonLinux + nginx + php-fpm): 



## Twilioのアカウント

* Twilioのアカウントを保有していること。
  * Twilioの電話番号
  * Twilioの認証情報 (ACCOUNT SID / AUTH TOKEN)


## Twilio+PHP環境

* PHP (5.4以上を想定)
* Twilio PHP SDK

(参考) Twilioで電話にメッセージを送る (クライアント環境: Twilio PHP SDK): http://qiita.com/tcsh/items/d0449909f20916fff159


# 0. 事前準備

## Twilioアカウント情報の設定

Twilioの「はじめよう」画面から以下の情報を取得して変数に格納します。

* ACCOUNT SID

* AUTH TOKEN

* 電話番号

```bash:変数の設定:
TWILIO_ACCOUNT_SID='ACxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx'
TWILIO_AUTH_TOKEN='xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx'
TEL_TWILIO_ORIGIN=<Twilioで取得した電話番号>
```


# 1. メッセージ送信アプリケーションの作成

## 1.1. ファイル置き場の作成

```bash:変数の設定
DIR_HTML='/usr/share/nginx/html'
DIR_PHP_SCRIPT="${DIR_HTML}/sysadm"
URL_PHP_SCRIPT=$(echo ${DIR_PHP_SCRIPT} | sed "s|${DIR_HTML}||" )
```

```bash:コマンド:
sudo mkdir -p ${DIR_PHP_SCRIPT} \
  && ls ${DIR_PHP_SCRIPT}
```



## 1.2. アプリケーションディレクトリの作成

```bash:変数の設定:
DIR_TWILIO_APP="${HOME}/app/twilio-admin-app" \
  && echo ${DIR_TWILIO_APP}
APP_NAME=$(echo ${DIR_TWILIO_APP} | sed 's|^.*/||') \
  && echo ${APP_NAME}
```

```bash:コマンド
mkdir -p ${DIR_TWILIO_APP} \
  && cd ${DIR_TWILIO_APP}
```



## 1.3. composerのインストール

```bash:コマンド:
cd ${DIR_TWILIO_APP} \
  && mkdir bin \
  && curl -sS https://getcomposer.org/installer | \
  php -- --install-dir=bin --filename=composer
```

```text:結果(例):
      #!/usr/bin/env php
      All settings correct for using Composer
      Downloading...

      Composer successfully installed to: /Users/taro/app/twilio-php/composer.phar
      Use it: php bin/composer
```


## 1.4. Twilio PHP SDKの導入

参考: https://jp.twilio.com/docs/php/install


```bash:コマンド:
cd ${DIR_TWILIO_APP} \
  && ./bin/composer require twilio/sdk
```

```text:結果(例):
      Using version ^4.2 for twilio/sdk
      ./composer.json has been created
      Loading composer repositories with package information
      Updating dependencies (including require-dev)
        - Installing twilio/sdk (4.2.1)
          Downloading: 100%

      Writing lock file
      Generating autoload files
```

```bash:コマンド
ls ${DIR_TWILIO_APP}/vendor/twilio/sdk/Services/Twilio.php > /dev/null 2>&1 \
  && echo $?
```

```text:結果(例:
0
```

Twilio PHPライブラリファイルの位置を変数に取り込みます。

```bash:変数の設定:
FILE_LIB_TWILIO="vendor/twilio/sdk/Services/Twilio.php" \
  && ls ${FILE_LIB_TWILIO} > /dev/null 2>&1 \
  && echo $?
```

```text:結果(例):
0
```


# 2. 電話録音アプリの作成

サーバ上に電話受信アプリを作成します。

## 2.1. Twilioに録音されたメッセージを一覧するスクリプトの作成

```bash:変数の設定:
FILE_PHP_SCRIPT='list-records.php'
FILE_CSS='main.css'
```

```bash:変数の確認"
cat << ETX

  APP_NAME:           ${APP_NAME}
  FILE_PHP_SCRIPT:    ${FILE_PHP_SCRIPT}
  TWILIO_ACCOUNT_SID: ${TWILIO_ACCOUNT_SID}
  TWILIO_AUTH_TOKEN:  ${TWILIO_AUTH_TOKEN}
  FILE_CSS:           ${FILE_CSS}

ETX
```

```bash:コマンド:
cat << EOF > ${FILE_PHP_SCRIPT}
<!DOCTYPE html>
<!-- author: Toshiaki Enami -->
<meta charset="UTF-8">
<title>List Records</title>
<link rel="stylesheet" type="text/css" href="main.css">
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
  function del(sid){
      \$.ajax({
        url: 'delete-record.php',
        type: 'post',
        dataType: 'json',
        data: { 
          RecordingSid: sid
        }
      })
      .done(function (response) {
          location.reload();
      })
      .fail(function () {
          location.reload();
          
      });
    };
</script>

<hr />

<table>
  <caption>録音リスト</caption>
  <thead>
    <tr><th scope="col">DateCreated</th><th scope="col">From</th><th scope="col">To</th><th scope="col">Duration</th><th scope="col">Action</th></tr>
  </thead>
  <tbody>
  <?php
    require('${FILE_LIB_TWILIO}'); 
    \$account_sid = '${TWILIO_ACCOUNT_SID}'; 
    \$auth_token = '${TWILIO_AUTH_TOKEN}'; 
    \$client = new Services_Twilio(\$account_sid, \$auth_token); 
    \$recordings = \$client->account->recordings->getIterator(0, 50, array(   
    )); 
    foreach (\$recordings as \$recording) {
      //var_dump(\$recording);
      \$i = 0;
      echo '<tr >';
      if (\$i == 0) {
        echo '<th scope="row">' . \$recording->date_created . '</th>';
        \$i++;
      }
      \$call_sid = \$recording->call_sid;
      echo "<td>" . getCaller(\$client, \$call_sid, "from") . "</td>";
      echo "<td>" . getCaller(\$client, \$call_sid, "to") . "</td>";
      echo "<td>" . \$recording->duration . "</td>";
      echo "<td><a href='https://api.twilio.com" . \$recording->uri . ".wav'>Play</a><br /><a onclick='del(\"" . \$recording->sid . "\")'>Delete</a></td>";
      echo "</tr >";
    }
    
    function getCaller(\$client, \$callSid, \$type){
      \$call = \$client->account->calls->get(\$callSid);
      if(\$type == "from"){
        return \$call->from;
      } elseif(\$type == "to"){
        return \$call->to;
      } else {
        return NULL;
      }
    }
  ?>
  </tbody>
</table>
EOF

cat ${FILE_PHP_SCRIPT}
```

動作確認してみましょう。

```bash:コマンド:
php ${FILE_PHP_SCRIPT}
```

```text:結果(例):
<!DOCTYPE html>
<!-- author: Toshiaki Enami -->
<meta charset="UTF-8">
<title>List Records</title>
<link rel="stylesheet" type="text/css" href="main.css">
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
  function del(sid){
      $.ajax({
        url: 'delete-record.php',
        type: 'post',
        dataType: 'json',
        data: { 
          RecordingSid: sid
        }
      })
      .done(function (response) {
          location.reload();
      })
      .fail(function () {
          location.reload();

      });
    };
</script>

<hr />

<table>
  <caption>録音リスト</caption>
  <thead>
    <tr><th scope="col">DateCreated</th><th scope="col">From</th><th scope="col">To</th><th scope="col">Duration</th><th scope="col">Action</th></tr>
  </thead>
  <tbody>
  <tr ><th scope="row">Sat, 10 Oct 2015 00:28:38 +0000</th><td>+819018480135</td><td>+815031717400</td><td>2</td><td><a href='https://api.twilio.com/2010-04-01/Accounts/ACee27e8a970548a537b8ea8c4f0dd7bd4/Recordings/REd57ab0d42b29e7b7ad63710a4294066e.wav'>Play</a><br /><a onclick='del("REd57ab0d42b29e7b7ad63710a4294066e")'>Delete</a></td></tr >  </tbody>
</table>
```

## 2.2. CSSファイルの作成


```bash:コマンド:
cat << EOF > ${FILE_CSS}
table, th, td {
	border: 1px solid #D4E0EE;
	border-collapse: collapse;
	font-family: "Trebuchet MS", Arial, sans-serif;
	color: #555;
}

caption {
	font-size: 150%;
	font-weight: bold;
	margin: 5px;
}

td, th {
	padding: 4px;
}

thead th {
	text-align: center;
	background: #E6EDF5;
	color: #4F76A3;
	font-size: 100% !important;
}

tbody th {
	font-weight: bold;
}

tbody tr { background: #FCFDFE; }

tbody tr.odd { background: #F7F9FC; }

table a:link {
	color: #718ABE;
	text-decoration: none;
}

table a:visited {
	color: #718ABE;
	text-decoration: none;
}

table a:hover {
	color: #718ABE;
	text-decoration: underline !important;
}

tfoot th, tfoot td {
	font-size: 85%;
}
EOF

cat ${FILE_CSS}
```

## 2.3. 録音データを削除するスクリプトの作成

```bash:コマンド:
FILE_PHP_SCRIPT='delete-record.php'
```

```bash:コマンド:
cat << EOF > ${FILE_PHP_SCRIPT}
<?php
// author: Toshiaki Enami
require('${FILE_LIB_TWILIO}');
\$account_sid = '${TWILIO_ACCOUNT_SID}';
\$auth_token = '${TWILIO_AUTH_TOKEN}';
\$client = new Services_Twilio(\$account_sid, \$auth_token);

header('Content-Type: application/json');
// Need to validate paratmer
\$client->account->recordings->delete(\$_POST['RecordingSid']);
echo "Done";
EOF

cat ${FILE_PHP_SCRIPT}
```

# 3. Webサーバの公開ドキュメントディレクトリにスクリプトを配置

```bash:コマンド:
sudo cp -R ${DIR_TWILIO_APP} ${DIR_PHP_SCRIPT}/ \
  && cat ${DIR_PHP_SCRIPT}/${APP_NAME}/${FILE_PHP_SCRIPT} \
  && cat ${DIR_PHP_SCRIPT}/${APP_NAME}/${FILE_CSS}  
```


# 4. スクリプトの動作確認

ブラウザで http://<ホスト>/sysadm/twilio-admin-app/list-records.php にアクセスしてみましょう。

録音データの一覧が表示されていればOKです。

- Playリンクをクリックすると、録音データが再生されます。
- Deleteリンクをクリックすると、録音データが削除されます。


# 5. Twilioのログ確認

- ログイン: http://twilio.kddi-web.com
- 画面: https://jp.twilio.com/user/account/log/calls
   - 削除した録音データが存在しないことを確認します。(受信記録自体は残っています。)



# 完了