Googleスプレッドシートのシフト表を使ってTwilio Studioフローの転送先をNode.jsから更新する方法
Tags: studio, googlespreadsheet, node, japanese
Published: 2020-05-27 06:07:17

---
title: Googleスプレッドシートのシフト表を使ってTwilio Studioフローの転送先をNode.jsから更新する方法
published: true
date: '2020-05-20'
tags: Studio, Google spreadsheet, nodejs, japanese 
canonical_url: https://www.twilio.com/blog/google-twilio-studio-rest-api-node-jp
---
![Header](https://twilio-cms-prod.s3.amazonaws.com/images/bequajswJOH0AUI_wEGCzYL1tE1Lk7xoDRK3nmBGdPsuLw.width-808.png)
[以前の記事](https://dev.to/twilio/twilio-studio-3a0g)で、在宅勤務に伴う電話問い合わせの一時休止を解決する方法として、Twilio Studioを利用し個人電話に転送する方法を紹介しました。

![Twilio Studio - Flow](https://twilio-cms-prod.s3.amazonaws.com/images/n6KNulbJGD3QxKIb-krEiNGnVjw963EqHHcaTmPpBLYAER.width-800.png)

今回は[別の記事](https://dev.to/neri78/google-node-js-3k6d-temp-slug-8514028)で紹介したGoogleスプレッドシートのシフトデータをもとに転送先となる個人をNode.jsで変更する方法を紹介します。

前提条件

- Twilioアカウントを持っていること（[無料トライアルのサインアップ方法](https://www.twilio.com/blog/how-to-create-twilio-account-jp)）
- 期間限定の問い合わせ番号となる[電話番号を購入](https://support.twilio.com/hc/en-us/articles/360044841214-Twilio-%E3%83%95%E3%83%AA%E3%83%BC%E3%83%88%E3%83%A9%E3%82%A4%E3%82%A2%E3%83%AB%E3%82%A2%E3%82%AB%E3%82%A6%E3%83%B3%E3%83%88%E3%81%AB%E9%96%A2%E3%81%97%E3%81%A6#h_167b5625-0036-44e6-936f-108ed091cb80)していること  
（[日本の番号を取得する場合](https://support.twilio.com/hc/en-us/articles/360044400214-%E8%A6%8F%E5%88%B6%E6%83%85%E5%A0%B1%E3%81%AB%E9%96%A2%E3%82%8F%E3%82%8B%E6%9B%B8%E9%A1%9E%E3%81%AE%E6%8F%90%E5%87%BA%E6%96%B9%E6%B3%95)）
- [こちらの記事](https://dev.to/twilio/twilio-studio-3a0g)に則りフローを作成、公開済みであること
- [こちらの記事](https://dev.to/twilio/google-node-js-1ap1)に則りGoogleスプレッドシートからデータを取得するNode.jsアプリケーションを作成済みであること

## Node.jsプロジェクトの作成とパッケージのインストール

[以前の記事](https://dev.to/twilio/google-node-js-1ap1)に沿って作成したNode.jsアプリケーションのフォルダーに移動し、[twilio-node](https://www.npmjs.com/package/twilio)パッケージをインストールします。

```
npm i twilio
```

次に.envファイルにTwilioへの接続情報やStudioフローのIDを保存する環境変数を追加します。

```
SPREADSHEET_ID=
STAFF_WORKSHEET_ID=
SHIFT_WORKSHEET_ID=
TWILIO_ACCOUNT_SID=
TWILIO_AUTH_TOKEN=
TWILIO_STUDIO_FLOW_SID=
```

## Twilio Studio REST API v2を使ったフローの取得と更新

今回利用するTwilio Studio REST API v2は4月末に[パブリックベータとしてアナウンス](https://www.twilio.com/blog/automate-flow-deployments-studio-rest-api-v2-beta)されたばかりの機能です。この新しいAPIを使って定義済みのフロー設定を外部から更新できます。

[Twilioコンソール](https://www.twilio.com/console)を開きACCOUNT SIDと、AUTH TOKENをそれぞれ.envファイルの `TWILIO_ACCOUNT_SID`ならびに `TWILIO_STUDIO_FLOW_SID` の値として設定します。

![AccountSid & AuthToken](https://twilio-cms-prod.s3.amazonaws.com/images/cfc6YMp-DykS55Rahs24kn2759AIZSMNsfhTto3dnHBibZ.width-800.png)

次に、[Studioコンソール](https://www.twilio.com/console/studio/dashboard)を開き、call forwardingフローのSIDを `TWILIO_STUDIO_FLOW_SID` の値として設定します。

index.jsを開き、[前回の記事](https://dev.to/twilio/google-node-js-1ap1)でテストに使用したコードを変更します。このコードでは、シフト担当者の電話番号を取得した状態で、Twilio Nodeクライアントを利用しStudioフローを取得します。

```js
loadShiftPhoneNumbers().then (
    numbers => {
        // twilio client
        const client = require('twilio')
           (process.env.TWILIO_ACCOUNTSID,
            process.env.TWILIO_AUTH_TOKEN);

        // Studioのフローを取得
        client.studio.flows(process.env.TWILIO_STUDIO_FLOW_SID)
            .fetch()
            .then(flow => {})
            .catch(error => console.error(error))
    ;})
    .catch( error => console.error(error));
```

フローの定義情報は、definitionというプロパティに保持されているため、そちらを取得します。また、各ウィジェットについては、statesというプロパティに配列として定義されています。このstates配列からウィジェットの名前をキーとして着信を転送するウィジェットを取得し、更に転送先番号を更新します。

```js
loadShiftPhoneNumbers().then (
    numbers => {
        // twilio client
        const client = require('twilio')
           (process.env.TWILIO_ACCOUNTSID,
            process.env.TWILIO_AUTH_TOKEN);

        // Studioのフローを取得
        client.studio.flows(process.env.TWILIO_STUDIO_FLOW_SID)
            .fetch()
            .then(flow => {
                // フローの定義を取得
                let definition = flow.definition;
                // forward_callウィジェットを取得
                let callForwardWidget = definition.states.find(
                    item => item.name == 'forward_call');
                // 転送先番号をシフトの電話番号で更新
                callForwardWidget.properties.to = numbers;
            })
            .catch(error => console.error(error));
    })
    .catch( error => console.error(error));
```

後は更新した定義をStudio REST API v2を使い、反映させます。この際、statusプロパティで反映したフローを下書き状態（draft）にしておくことも、即座に公開（published）にすることもできます。

```js
loadShiftPhoneNumbers().then (
    numbers => {
        // twilio client
        const client = require('twilio')
           (process.env.TWILIO_ACCOUNTSID,
            process.env.TWILIO_AUTH_TOKEN);

        // Studioのフローを取得
        client.studio.flows(process.env.TWILIO_STUDIO_FLOW_SID)
            .fetch()
            .then(flow => {
                // フローの定義を取得
                let definition = flow.definition;
                // forward_callウィジェットを取得
                let callForwardWidget = definition.states.find(
                    item => item.name == 'forward_call');
                // 転送先番号をシフトの電話番号で更新
                callForwardWidget.properties.to = numbers;

                // 更新した定義を反映し、即座に公開
                client.studio.flows(process.env.TWILIO_STUDIO_FLOW_SID)
                    .update({
                        definition: definition,
                        commitMessage: 'シフトの更新 - 2020/05/15',
                        status: 'published'})
                    .then(res => console.log(res))
                    .catch(error => console.error(error));
            })
            .catch(error => console.error(error));
    })
    .catch( error => console.error(error));
```

index.jsを実行し、ログにエラーが含まれていないこと、Studioのフローが実際に変更されていることを確認しましょう。

```
node index.js
```

## まとめ

ご覧いただいたように、パブリックベータとして公開されたREST API v2を活用することで、外部のデータやシステムと連携した上でTwilio Studioのフローを更新することができるようになりました。非常に強力なAPIなので、ぜひご活用ください。

今回のサンプルはこちらの[GitHubリポジトリ](https://github.com/neri78/twilio-studio-google-spreadsheet)からクローンし、環境変数にそれぞれ値を設定することで確認することも可能です。

## 新型コロナウイルス感染症への支援策について

Twilioでは新型コロナウィルス感染症により引き起こされるさまざまな社会問題を解決する会社、団体、開発者グループに向けて無料クレジットの進呈など支援を行なっています。詳しくは[こちらの記事](https://www.twilio.com/blog/covid-19-response-japan)をご覧ください。

また、Twilioを自社のシステム、ソリューションやパッケージに組み込みたいとお考えの場合は、[営業部までお問い合わせ](https://www.twilio.com/japan/help/sales)ください。

## このエントリについての問い合わせ

不明点があればぜひ、お問い合わせください。オンライン登壇のご依頼等もこちらまで！

- Twitter ([@Neri78](https://twitter.com/neri78))
- Email: [dikehara@twilio.com](mailto:dikehara@twilio.com)
- Github: [https://github.com/neri78](https://github.com/neri78)
- Twitch: [https://twitch.tv/neri78](https://twitch.tv/neri78)