Kom igång med webbsamtalsexemplet

Webbsamtalsexemplet är ett webbprogram som fungerar som en stegvis genomgång av de olika funktionerna som tillhandahålls av Communication Services web Calling SDK.

Det här exemplet har skapats för utvecklare och gör det mycket enkelt för dig att komma igång med Communication Services. Användargränssnittet är indelat i flera avsnitt, var och en med knappen "Visa kod" som gör att du kan kopiera kod direkt från webbläsaren till ditt eget Communication Services-program.

Kom igång med webbsamtalsexemplet

Följ /Project/readme.md för att konfigurera projektet och köra det lokalt på datorn. När webbsamtalsexemplet körs på datorn visas följande landningssida:

Web calling tutorial 1

Web calling tutorial 2

Initiering av användaretablering och SDK

Klicka på "Etableringsanvändare och initiera SDK" för att initiera din SDK med hjälp av en token som etablerats av serverdelstokenetableringstjänsten. Den här serverdelstjänsten finns i /project/webpack.config.js.

Klicka på knappen "Visa kod" för att se exempelkoden som du kan använda i din egen lösning.

Du bör se följande när din SDK har initierats:

User provisioning

Nu är du redo att börja ringa samtal med hjälp av din Communication Services-resurs!

Ringa och ta emot samtal

Web Calling SDK för Communication Services tillåter 1:1, 1:N och gruppsamtal .

För utgående anrop med 1:1 eller 1:N kan du ange flera användaridentiteter för Kommunikationstjänster som ska anropas med kommaavgränsade värden. Du kan också ange traditionella telefonnummer (PSTN) som ska anropas med kommaavgränsade värden.

När du ringer PSTN-telefonnummer anger du ditt alternativa nummerpresentation. Klicka på knappen "Platsanrop" för att ringa ett utgående samtal:

Place a call

Om du vill ansluta till ett gruppsamtal anger du det GUID som identifierar samtalet och klickar på knappen "Anslut grupp":

Join a group call

Klicka på knappen "Visa kod" för att se exempelkoden för att ringa samtal, ta emot samtal och ansluta till gruppsamtal.

Ett aktivt anrop ser ut så här:

Group call

Det här exemplet innehåller också kodfragment för följande funktioner:

  • Klicka på videoikonen för att aktivera/inaktivera videokameran
  • Klicka på mikrofonikonen för att aktivera/inaktivera mikrofonen
  • Klicka på uppspelningsikonen för att hålla/ta bort anropet
  • Klicka på skärmikonen för att starta/stoppa dela skärmen
  • Klicka på personikonen för att lägga till en deltagare i samtalet
  • Klicka på Ta bort deltagare i deltagarlistan för att ta bort en specifik deltagare från samtalet

Nästa steg

Mer information finns i följande artiklar:

Mer att läsa

  • Exempel – Hitta fler exempel och exempel på översiktssidan för våra exempel.
  • Redux – Tillståndshantering på klientsidan
  • FluentUI – Microsofts drivna användargränssnittsbibliotek
  • React – Bibliotek för att skapa användargränssnitt
  • ASP.NET Core – Ramverk för att skapa webbprogram