分享方式:


開始使用 Web 通話範例

Web 通話範例是一個 Web 應用程式,可作為通訊服務 Web 通話 SDK 所提供之各種功能的逐步解說。

此範例是針對開發人員所建立,可讓您輕鬆開始使用通訊服務。 其使用者介面分為多個區段,各有一個 [顯示程式碼] 按鈕,可讓您將程式碼直接從瀏覽器複製到自己的通訊服務應用程式。

開始使用 Web 通話範例

請遵循 /Project/readme.md 來設定專案,並在本機機器上執行。 在的機器上執行Web 通話範例後,您會看到下列登陸頁面:

Web calling tutorial 1

Web calling tutorial 2

使用者佈建與 SDK 初始化

按一下 [佈建使用者和初始化 SDK],使用後端權杖佈建服務所佈建的權杖將您的 SDK 初始化。 這項後端服務位於 /project/webpack.config.js 中。

按一下 [顯示程式碼] 按鈕,查看您可以在自己的解決方案中使用哪些範例程式碼。

SDK 初始化之後,您應該會看到下列內容:

User provisioning

您現在已經準備好開始使用您的通訊服務資源來撥打電話!

撥打及接聽通話

通訊服務 Web 通話 SDK 允許 1 對 11 對多群組通話。

針對 1 對 1 或 1 對多的撥出電話,您可以使用逗號分隔值,指定多個通訊服務使用者識別來撥號。 您也可以使用逗號分隔值,指定要呼叫的傳統 (PSTN) 電話號碼。

撥打 PSTN 電話號碼時,請指定替代的通話者識別碼。 按一下 [撥打電話] 按鈕,撥打電話:

Place a call

若要加入群組通話,請輸入可識別通話的 GUID,然後按一下 [加入群組] 按鈕:

Join a group call

按一下 [顯示程式碼] 按鈕,查看用來撥打電話、接聽通話和加入群組通話的範例程式碼。

進行中的通話看起來會像這樣:

Group call

此範例也會提供下列功能的程式碼片段:

  • 按一下影片圖示,開啟/關閉您的攝影機
  • 按一下麥克風圖示,開啟/關閉您的麥克風
  • 按一下播放圖示來保留/取消保留通話
  • 按一下螢幕圖示以開始/停止共用螢幕
  • 按一下人員圖示,通話在中新增參與者
  • 按一下參與者名單中的 [移除參與者],從通話中移除特定的參與者

下一步

如需詳細資訊,請參閱下列文章:

延伸閱讀

  • 範例 - 在我們的範例概觀頁面上尋找更多範例。
  • Redux - 用戶端狀態管理
  • FluentUI - Microsoft 支援的 UI 程式庫
  • React - 組建使用者介面的程式庫
  • ASP.NET Core - 用來建置 Web 應用程式的架構