メニュー

Expand
ページを評価:

Node.jsとExpressによる動的なコールセンター

このチュートリアルでは、顧客からサポート担当者への通話の振り分けを自動化する方法についてご紹介します。 この例では顧客は製品を選択、するとその製品に精通したスタッフに接続されます。 電話に出れる担当者がいない場合は、後からかけ直せるように顧客の電話番号が保存されます。

これが、アプリケーションが高次で行う内容です:

  • TaskRouter REST APIを使用してワークスペースを構成します。
  • 着信通話を待機し、エンドユーザーがプッシュボタンを使って製品を選択できるようにします。
  • 選択された製品でタスクを作成し、TaskRouterに処理を行わせます。
  • 担当者が顧客にコールバックできるように、不在着信を記録しておきます。
  • もし通話への応答がなかった場合は、ユーザーを留守番電話に誘導します。
  • 担当者に自身の状態(受付可、オフライン)をSMS経由で変更できるようにします。
はじめましょう!

Workspaceを構成する

TaskRouterに指示を与えてタスクを処理するには、ワークスペースを構成することが必要です。 TaskRouterコンソールまたはTaskRouter REST APIを通じてプログラムからこれを行うことが可能です。

このNode.jsアプリケーションでは、アプリケーションを起動したときにこのセットアップを行います。

ワークスペースは、TaskRouterアプリケーションのコンテナー要素です。 属性には以下のようなものがあります:

  • タスク - 担当者に連絡しようとしている顧客を表します。
  • ワーカー - タスクをこなすべき担当者です。
  • タスク待ち行列 - 複数のワーカーによって処理されるタスクを保持します。
  • ワークフロー - タスクをタスク待ち行列に配置する役目を負います。
  • アクティビティー - ワーカーの状態の候補で、たとえば待機中、オフライン、取り込み中、などです。

このAPI向けにクライアントを構築するには、システム変数としてTwilioコンソールで参照できる TWILIO_ACCOUNT_SID および TWILIO_AUTH_TOKEN が必要です。 initClient 関数はTwilio Node.jsライブラリーによって提供されるTaskRouterClientを構成し、返します。

        
        
        
        lib/workspace.js

        さて、すべてのステップにおける詳細を確認しましょう。 Workspaceの作成から始めます。

        新規Workspaceの作成方法を確認する

        Workspaceを作成する

        Workspaceを作成する前に、これから作成しようとしているものと同一の friendlyName を削除する必要があります。 Workspaceを作成するには、friendlyName、及びWorkspaceでイベントがトリガーされるたびにリクエストの発行されるeventCallbackUrlを提供することが必要です。

              
              
              
              lib/workspace.js

              ピッカピカのWorkspaceが作成されました。今度はWorkerが必要になります。 次のステップでこれらを作成しましょう。

              Workerをいくつか作成する方法を確認する

              Workerを作成する

              これから、BobとAliceという2つのワーカーを作成します。 これらはそれぞれ2つの属性を持っています: 電話番号 contact_uri 、およびそのワーカーが特化している製品の一覧 products です。 また、それぞれのワーカーについて activitySid および名前を指定する必要もあります。 選択されたアクティビティーはワーカーの状態を定義します。

              既定のアクティビティーが、ワークスペースを伴って作成されます。 Idle アクティビティーを使用して、着信通話に利用できるワーカーを作成します。

                    
                    
                    
                    lib/workspace.js

                    Workerを作成する

                    lib/workspace.js

                    Workerの作成後は、Task Queueをセットアップします。

                    Task Queueの作成方法を確認する

                    Task Queueを作成する

                    続いて、タスク待ち行列をセットアップします。 それぞれには、Workerを突き合わせるためのであるfriendlyNameおよびtargetWorkersを伴います。 タスク待ち行列には次のものが含まれます:

                    1. SMS '"ProgrammableSMS" in products' 式を使用して、BobのようなProgrammable SMSに精通したワーカーを対象にします。
                    2. Voice 同様に '"ProgrammableVoice" in products' 式を使用して、Programmable Voiceに精通したワーカーAliceを対象とします。
                    3. Default - この待ち行列はすべてのユーザーを対象とし、選択された製品についての精通した担当者がいない場合に使用されます。 ここでは、"1==1" 式が使用できます。
                          
                          
                          
                          lib/workspace.js

                          Task Queueを作成する

                          lib/workspace.js

                          Workspace、Worker、そしてTask Queueが揃いました。 残るは? Workflowです。 次はその作成方法を見てみましょう。

                          Workflowを作成するコードを確認する

                          ワークフローを作成する

                          最後に、下記のパラメーターを使用してワークフローを作成します:

                          1. friendlyName ワークフローの名前として。
                          2. assignmentCallbackUrl このワークフローがワーカーにタスクを割り当てる際にリクエストの発行される公開URLとしての fallbackAssignmentCallbackUrl です。次のステップで、実装方法を見ていきます。
                          3. taskReservationTimeout ワーカーがタスクを処理できるようになるまでの待ち時間の最大値として。
                          4. configuration タスクをタスク待ち行列に配置するルールのセットです。振り分け構成はタスクの属性を受け取り、タスク待ち行列にそれを突き合わせます。 このアプリケーションのワークフローは、次のように定義されます:
                            1. "selected_product==\ "ProgrammableSMS\"" expression for SMS Task Queue. この式は、selected_product 属性として ProgrammableSMS の任意のタスクに対応します。
                            2. "selected_product==\ "ProgrammableVoice\"" Voice タスク待ち行列用の式です。
                                
                                
                                
                                lib/workspace.js

                                これでWorkspaceのセットアップが完了しました。 さて、いよいよこれを使用して通話をルーティングする方法を見ていきましょう。

                                受信するTwilioのリクエストの処理方法を確認する

                                Twilioのリクエストを処理する

                                通話が着信すると、Twilioは電話番号の構成ページに指定されたURLにリクエストを発行します。

                                そして、エンドポイントはリクエストを処理し、TwiMLレスポンスを生成します。 Say動詞を使用して、エンドユーザーにプッシュボタンを押すことで選択可能な代替の製品を提示します。 Gather動詞を使用すると、エンドユーザーの押したボタンを取り込むことができます。

                                      
                                      
                                      
                                      routes/call.js

                                      顧客に製品を選択するよう尋ねたので、その選択に基づいて適切なTaskを作成する

                                      Taskの作成方法を確認する

                                      タスクを作成する

                                      これは前の手順で Gather 動詞の action URLとして表されたエンドポイントのセットです。 ユーザーが通話中にプッシュボタンを押すと、リクエストがこのエンドポイントに発行されます。 このリクエストには押されたプッシュボタンの番号を保持する Digits パラメーターがあります。 Taskselected_product 属性として押された番号に基づいて作成されます。 ワークフローはこのタスクの属性を受け取り、対応するタスク待ち行列を探すために構成された式で突き合わせを行い、適切かつ対応可能なワーカーが割り当てられ、それを処理します。

                                      WorkflowSid 属性を伴うEnqueue 動詞を使用して、TaskRouterと統合します。 すると、TaskRouterがタスクを処理できるワーカーを検索を試みる間、音声通話を保留にします。

                                            
                                            
                                            
                                            routes/call.js

                                            タスクを作成する

                                            routes/call.js

                                            TaskをTwilioに送信したら、Workerの使用するTaskRouterでそのタスクを実行させるよう指示する方法を確認しましょう。

                                            Workerの割り当て方法

                                            Workerを割り当てる

                                            TaskRouterがワーカーを選択すると、次の処理が実行されます。

                                            1. タスクの割り当てステータスが 'reserved' に設定されます。
                                            2. 予約 (Reservation) インスタンスが生成され、タスクが選択されたワーカーにリンクしています。
                                            3. 予約 (Reservation) が作成されると同時に、ワークフローの作成時に構成されたワークフローのAssignmentCallbackURLにPOSTリクエストが発行されます。リクエストにはタスクの全詳細、選択されたワーカー、および予約が含まれます。

                                            割り当てコールバックの処理は、ワーカーがタスクを処理する方法を指示できるという点で、TaskRouterアプリケーションの構築において鍵となる要素です。 SMS、メール、プッシュ通知を送信したり、あるいは通話を発信できました。

                                            Enqueue 動詞を使用して通話中にこのタスクを作成したので、TaskRouterに通話を待ち行列から取り出して、ワーカーにダイアルするよう指示しましょう。 to パラメーターに電話番号を指定しない場合、TaskRouterはワーカーの contact_uri 属性を選択します。

                                            また通話の終了後、TaskRouterにどのアクティビティーが割り当てられるか知らせる post_work_activity_sid も送信します。

                                                  
                                                  
                                                  
                                                  routes/call.js

                                                  Workerを割り当てる

                                                  routes/call.js

                                                  これで、Taskが適切にルーティングされました。 次の手順では不在着信の扱いについて見ていきましょう。

                                                  不在着信の収集方法を確認する

                                                  不在着信を収集する

                                                  このエンドポイントは、各TaskRouterイベントがトリガーされると呼び出されます。 このアプリケーションでは、不在着信の収集を試みて workflow.timeout イベントを処理することにしましょう。 このイベントはタスクがワークフロー構成で設定した期限を過ぎた場合、または受付可のワーカーがいない場合にトリガーされます。

                                                  ここでは、TaskRouterClientを使用して、この通話を留守番電話Twimletに振り分けます。 Twimletは音声通話用の小さなWebアプリケーションです。 このTwimletは Say 動詞を使用して TwiML レスポンスを生成し、そして Record 動詞を使用してメッセージを録音します。 録音されたメッセージはテキスト化され、構成済のメールアドレスを送信されます。

                                                  また、task.canceled もリッスンする点にも注目してください。 これは担当者が割り当てられる前に顧客が電話を切ったときにトリガーされ、タスクが取り消されます。 このイベントをキャプチャーすると、ワークフローが時間切れになる前に電話を切った顧客の情報を収集できます。

                                                        
                                                        
                                                        
                                                        routes/events.js

                                                        不在着信を収集する

                                                        routes/events.js

                                                        アプリケーションのほとんどの機能が実装されました。 最後の仕上げはWorkerがプレゼンス(在籍)ステータスを変更できるようにすることです。 次はその方法を見てみましょう。

                                                        Workerがプレゼンスステータスを変更できるようにする方法を確認する

                                                        WorkerのActivityを変更する

                                                        このエンドポイントを作成したことで、ワーカーは "On" または "Off" のコマンドをSMSメッセージでサポート・ラインに送信して、受付可のステータスを変更できます。

                                                        これは、ワーカーが電話を取りこぼしたときにアクティビティーが Offline に変更される点で重要です。 このとき、ワーカーにはSMSが受信され、アクティビティーが変更されたことが知らされ、そして On コマンドを返信することで再度着信通話を受けられるようにすることができます。

                                                              
                                                              
                                                              
                                                              routes/sms.js

                                                              おめでとうございます! このチュートリアルはおしまいです。 ご覧いただけるように、TwilioのTaskRouterの使用はいたって簡単です。

                                                              次はどこでしょうか?

                                                              次はどこでしょうか?

                                                              Twilio を使う Node.js/Express 開発者であれば、他のチュートリアルもお楽しみください。

                                                              Warm-Transfer

                                                              別のサポート担当者に転送されるときに、サポートコールから切断された経験はありますか? ウォーム転送がこの問題を解決します。Twilio 対応のウォーム転送を使用すると、サポート担当者はリアルタイムに別の担当者をカンファレンスに招待することができます。

                                                              Automated-Survey

                                                              音声通話またはSMSのテキスト・メッセージで行うアンケートで、構造化データをエンドユーザーから素早く収集しましょう。

                                                              これは役に立ちましたか?

                                                              このチュートリアルをお読みいただき、ありがとうございます。ご意見やご感想などございましたら、ぜひお聞かせください。 ご意見やご感想などございましたら、ぜひお聞かせください。 @twilioにツイートして、ご意見をお寄せください!

                                                              David Prothero Kat King Mica Swyers Ricky Holtz Jose Oliveros Jason Sooter
                                                              ページを評価:

                                                              ヘルプが必要ですか?

                                                              We all do sometimes; code is hard. Get help now from our support team, or lean on the wisdom of the crowd by visiting Twilio's Stack Overflow Collective or browsing the Twilio tag on Stack Overflow.

                                                                    
                                                                    
                                                                    

                                                                    フィードバックくださりありがとうございます!

                                                                    Please select the reason(s) for your feedback. The additional information you provide helps us improve our documentation:

                                                                    Sending your feedback...
                                                                    🎉 Thank you for your feedback!
                                                                    Something went wrong. Please try again.

                                                                    Thanks for your feedback!

                                                                    Refer us and get $10 in 3 simple steps!

                                                                    ステップ1

                                                                    Get link

                                                                    Get a free personal referral link here

                                                                    ステップ2:

                                                                    Give $10

                                                                    Your user signs up and upgrade using link

                                                                    ステップ3

                                                                    Get $10

                                                                    1,250 free SMSes
                                                                    OR 1,000 free voice mins
                                                                    OR 12,000 chats
                                                                    OR more