メニュー

Rate this page:

Thanks for rating this page!

We are always striving to improve our documentation quality, and your feedback is valuable to us. How could this documentation serve you better?

C#およびASP.NET MVCを使用したウォーム転送

別のサポート担当者に転送されるときに、サポートコールから切断された経験はありますか?

ウォーム転送がこの問題を解消します。 Twilioを活用したウォーム転送を使用すれば、コールセンターの担当者はリアルタイムで他の担当者に電話をかけることができます。

ここでは、高いレベルでどのように機能するのかについて示します。

  1. Web クライアントを通じて接続されると、最初の担当者が対応可能になります。
  2. 2 番目の担当者も、Web クライアントを通じて接続されると、対応可能になります。
  3. クライアントがサポートラインに電話をかけます。
  4. クライアントは、最初の担当者が電話に応対するまでしばらく待ちます。
  5. 最初の担当者は、電話でクライアントに対応しているときに、2 番目の担当者にダイヤルして通話をつなぐことができます。
  6. 2 番目の担当者が通話につながると、最初の担当者は通話から抜けることができます。クライアントと 2 番目の担当者は通話に接続したままになります。

さぁ、はじめましょう! GitHubからサンプルアプリケーションをクローンし、下のボタンをクリックして始めてください。

We're Warming Up

音声通話 webhook の設定

まず、顧客がサポートエージェントと連絡を取りたいときに電話をかけてくるTwilio番号に対する音声通話Webhookを構成しましょう。

ウォーム転送用のTwilio Console

このアクションメソッドはASP.NETフレームワークによって公開されるURLを生成するもののひとつです。

        
        
        
        
        WarmTransfer.Web/Controllers/ConferenceController.cs

        クライアント用の公開Webhookとして使用されるエンドポイント

        WarmTransfer.Web/Controllers/ConferenceController.cs

        Awesome, now you've got a webhook in place. Next up, we'll look at some of the code.

        エージェントを接続する

        エージェントを接続する

        ここでは、Twilio の音声通話 Web クライアントを使用して、担当者に接続するために必要なすべてのフロントエンドコードを確認できます。

        ライブの Web クライアントを実現するには、基本的に以下の 3 つのものが必要です。

        • ケイパビリティ・トークン(ASP.NET MVCアプリケーションによって提供されます)
        • 担当者ごとの一意の識別子(文字列)
        • Twilio によってトリガーされる各種イベントを処理するためのイベントリスナー
              
              
              
              
              WarmTransfer.Web/Scripts/warm-transfer.js

              ブラウザーから新規通話を作成する

              WarmTransfer.Web/Scripts/warm-transfer.js

              次のステップでは、ケイパビリティートークンの生成についてもう少し詳しく見てみましょう。

              ケイパビリティートークンを生成する

              ケイパビリティートークンの生成

              Twilio 音声通話 Web クライアントに接続するために、ケイパビリティートークンが必要です。

              Webクライアントを通じた着信接続を許可するには、トークンの生成時に識別子が提供される必要があります。 

                    
                    
                    
                    
                    特定のエージェントのアイデンティティーに対して新規けんちティートークンを生成する

                    ケイパビリティートークンを生成する

                    特定のエージェントのアイデンティティーに対して新規けんちティートークンを生成する

                    続いて、着信通話の処理方法について見ていきましょう。

                    着信通話のハンドリング

                    着信通話を処理する

                    このチュートリアルでは agent1agent2 のような固定識別子の文字列を使用しますが、開発されるコールセンター・クライアントには自動生成されたトークンを使用できます。 これらの識別子は、Twilio REST API を使用して指定した担当者に通話を発信するのに使用されます。

                    顧客がTwilio番号に通話を発信するとき、アプリケーションは指示を尋ねるPOSTリクエストを受け取ります。 TwiMLを使用して顧客に会議室に参加し、Twilio REST APIクライアントには最初の担当者と通話するよう指示します。 こうすれば顧客は同じ会議室に接続することになります。

                    クライアントに指示を与える際には、waitUrlも提供します。 このURLはアプリケーションの別のエンドポイントで、ユーザーにあいさつを述べて (Say)、保留中に音楽を再生する (Play)さらなるTwiMLを返します。 GenerateWait メソッドを見てみましょう。

                    クライアントのcallSidを電話会議の識別子として使用します。 電話会議に加わるすべての参加者にはこの識別子が必要なため、次の人に電話をかけるときに取得できるよう、これをデータベースに保存しておく必要があります。

                          
                          
                          
                          
                          WarmTransfer.Web/Controllers/ConferenceController.cs

                          ここで、ClientへのTwiML命令の渡し方を確認しましょう。

                          Client用にTwiML命令を用意する

                          Client用にTwiML命令を用意する

                          ここでは、特定のカンファレンスルームに参加するようにクライアントに指示する Dial 動詞と Conference 名詞を含む TwiMLResponse を作成します。

                                
                                
                                
                                
                                WarmTransfer.Web/Domain/TwiMLGenerator.cs

                                Client用のTwiMLを生成し、電話会議に参加させる

                                WarmTransfer.Web/Domain/TwiMLGenerator.cs

                                Next up, we will look at how to dial our first agent into the call.

                                最初のエージェントを呼び出す

                                最初の担当者にダイヤルして通話を接続する

                                今回のアプリケーションでは、CallCreator クラスを作成して担当者への電話の発信を処理します。 このクラスはTwilio REST APIを使用して新規通話を作成します。 InitiateOutboundCall メソッドは下記のパラメーターを返します。

                                1. from:Twilio 電話番号
                                2. to :担当者の Web クライアント識別子(agent1 または agent2
                                3. url :通話が接続したときに TwiML 命令を求める URL

                                担当者が Web クライアントで通話に応答すると、コールバック URL に対するリクエストが作成され、クライアントがすでに待機しているカンファレンスルームに参加するようにと担当者の通話に指示が出されます。

                                      
                                      
                                      
                                      
                                      WarmTransfer.Web/Domain/CallCreator.cs

                                      最初の担当者にダイヤルして通話を接続する

                                      WarmTransfer.Web/Domain/CallCreator.cs

                                      With that in mind, let's see how to add the second agent to the call.

                                      2 番目の担当者にダイヤルして通話を接続する

                                      2 番目の担当者にダイヤルして通話を接続する

                                      顧客と最初の担当者が通話中のとき、次の担当者へのウォーム転送を行う準備はすでに完了しています。 最初の担当者は次の担当者に電話をつなぐために必要な call.ConferenceId を検索できるようにする identifier を渡してリクエストを発行します。 CallCreator クラスがすでに手元にあるので、 CallAgent メソッドを使用しさえすれば次の担当者に接続できます。

                                            
                                            
                                            
                                            
                                            WarmTransfer.Web/Controllers/ConferenceController.cs

                                            次のエージェントを電話会議に招待する

                                            WarmTransfer.Web/Controllers/ConferenceController.cs

                                            続いて、最初のエージェントが通話を終了するための処理方法を見てみましょう。

                                            最初の担当者が通話から抜ける

                                            最初の担当者が通話から抜ける

                                            3 人の参加者が同じ通話に参加した場合は、最初の担当者はその目的をかなえています。そこで、最初の担当者は通話から抜け、2 番目の担当者とクライアントがうまく会話するようにできます。

                                            それぞれの参加者が通話に加わったときに受信されるTwiMLの違いに留意することは重要です。 担当者1と2の両者とも、true に設定した startConferenceOnEnter があります。 つまり、どちらか一方が通話に加わった際に電話会議がスタートするということです。 顧客の通話と担当者2の場合は、 endConferenceOnExit は true に設定されます。 こうすることで、通話の参加者のどちらか一方が電話を切ると、通話は終了します。

                                                  
                                                  
                                                  
                                                  
                                                  WarmTransfer.Web/Domain/TwiMLGenerator.cs

                                                  電話会議にダイヤルするよう指示する

                                                  WarmTransfer.Web/Domain/TwiMLGenerator.cs

                                                  一丁あがり! ASP.NET MVCを使用して、ウォーム転送を実装できました。 これで、担当者が他のスタッフに転送するとき、顧客がサポートの電話から切断されることがなくなります。

                                                  関連トピック

                                                  関連トピック

                                                  あなたがTwilioを使用するASP.NET MVC開発者なら、これら他のチュートリアルもお楽しみいただけるでしょう:

                                                  ブラウザー通話

                                                  Twilio クライアントを使って、ブラウザーから電話へ、およびブラウザーからブラウザーへの通話を簡単に行う方法を学びます。

                                                  ETA 通知

                                                  ASP.NET MVCとTwilioを使用した、到着予定通知をの実装方法を学びましょう。

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

                                                  Thanks for checking this tutorial out! Let us know on Twitter what you've built... or what you're building.

                                                  Agustin Camino Samuel Mendes David Prothero Kat King
                                                  Rate this page:

                                                  ヘルプが必要ですか?

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