You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Microsoft Teams provides identities managed by Azure Active Directory and calling experiences controlled by Teams Admin Center and policies. Users might have assigned licenses to enable PSTN connectivity and advanced calling capabilities of Teams Phone System. Azure Communication Services are supporting Teams identities for managing Teams VoIP calls, Teams PSTN calls, and join Teams meetings. Developers might extend the Azure Communication Services with Graph API to provide contextual data from Microsoft 365 ecosystem. This page is providing inspiration on how to leverage existing Microsoft technologies to provide an end-to-end experience for calling scenarios with Teams users and Azure Communication Services calling SDKs.
18
+
Microsoft Teams provides identities managed by Azure Active Directory and calling experiences controlled by Teams Admin Center and policies. Users might have assigned licenses to enable PSTN connectivity and advanced calling capabilities of Teams Phone System. Azure Communication Services are supporting Teams identities for managing Teams VoIP calls, Teams PSTN calls, and join Teams meetings. Developers might extend the Azure Communication Services with Graph API to provide contextual data from Microsoft 365 ecosystem. This page is providing inspiration on how to use existing Microsoft technologies to provide an end-to-end experience for calling scenarios with Teams users and Azure Communication Services calling SDKs.
19
19
20
20
## Use case 1: Make outbound Teams PSTN call
21
21
This scenario is showing a multi-tenant use case, where company Contoso is providing SaaS to company Fabrikam. SaaS allows Fabrikam's users to make Teams PSTN calls via a custom website that takes the identity of the Teams user and configuration of the PSTN connectivity assigned to that Teams user.
22
22
23
23

24
24
25
-
The following sequence diagram is showing detailed steps of initiating a PSTN call:
25
+
The following sequence diagram shows detailed steps of initiation of a Teams PSTN call:
26
26
27
27
:::image type="content" source="./media/custom-teams-endpoint/end-to-end-use-cases/cte-e2e-cte-to-pstn-out-full.svg" alt-text="Sequence diagram is describing detailed set of steps, that happens to initiate a Teams PSTN call using Azure Communication Services and Teams." lightbox="./media/custom-teams-endpoint/end-to-end-use-cases/cte-e2e-cte-to-pstn-out-full.svg":::
28
28
29
29
### Steps
30
30
1. Authenticate Alice from Fabrikam in Contoso's client application: Alice is using a browser to open Fabrikam's web page and authenticates. You can find more details about [the authentication with Teams identity](./custom-teams-endpoint-authentication-overview.md). If the authentication is successful, Alice is redirected to the initial page.
31
31
2. Load customers and their PSTN numbers: Contoso provides custom logic to retrieve the list of customers and their associated phone numbers. This list is rendered on the initial page to Alice.
32
-
3. Initiate a call to Megan: Alice selects a button to initiate a PSTN call to Megan in the Contoso's Client application. Client application leverages Azure Communication Services calling SDK to provide the calling capability. First, it creates an instance of callAgent, that holds the Azure Communication Services access token acquired during 1st step.
32
+
3. Initiate a call to Megan: Alice selects a button to initiate a PSTN call to Megan in the Contoso's Client application. Client application uses Azure Communication Services calling SDK to provide the calling capability. First, it creates an instance of callAgent, that holds the Azure Communication Services access token acquired during first step.
@@ -50,20 +50,20 @@ This scenario is showing a multi-tenant use case, where company Contoso is provi
50
50
51
51

52
52
53
-
The following sequence diagram is showing detailed steps of receiving a PSTN call:
53
+
The following sequence diagram shows detailed steps for accepting incoming Teams PSTN calls:
54
54
55
55
:::image type="content" source="./media/custom-teams-endpoint/end-to-end-use-cases/cte-e2e-cte-to-pstn-in-full.svg" alt-text="Sequence diagram is describing detailed set of steps, that happens to receive a Teams PSTN call using Azure Communication Services and Teams." lightbox="./media/custom-teams-endpoint/end-to-end-use-cases/cte-e2e-cte-to-pstn-in-full.svg":::
56
56
57
57
### Steps
58
58
1. Authenticate Alice from Fabrikam in Contoso's client application: Alice is using a browser to open Fabrikam's web page and authenticates. You can find more details about [the authentication with Teams identity](./custom-teams-endpoint-authentication-overview.md). If the authentication is successful, Alice is redirected to the initial page.
59
-
2. Subscribe for receiving calls: Client application leverages Azure Communication Services calling SDK to provide the calling capability. First, it creates an instance of callAgent, that holds the Azure Communication Services access token acquired during 1st step.
59
+
2. Subscribe for receiving calls: Client application uses Azure Communication Services calling SDK to provide the calling capability. First, it creates an instance of callAgent, that holds the Azure Communication Services access token acquired during first step.
The method _showIncomingCall_ is a custom Contoso's method that will render a user interface to indicate incoming calls and two buttons to accept and decline the call. If the user selects accept button, then the following code is used:
77
+
The method _showIncomingCall_ is a custom Contoso's method that will render a user interface to indicate incoming calls and two buttons to accept and decline the call. If you select accept button, then the following code is used:
78
78
79
79
```js
80
80
// Accept the call
81
81
var call =awaitincomingCall.accept();
82
82
```
83
83
84
-
If the user selects the decline button, then the following code is used:
84
+
If you select the decline button, then the following code is used:
85
85
86
86
87
87
```js
88
88
// Reject the call
89
89
incomingCall.reject();
90
90
```
91
91
92
-
3. Megan start's a call to PSTN number assigned to Teams user Alice: Megan uses her phone to call Alice. The carrier network will connect to Teams PSTN connectivity assigned to Alice and it will ring all Teams endpoints registered for Alice. It includes existing Teams desktop, mobile, web clients, and applications based on Azure Communication Services calling SDK authenticated as Alice.
93
-
4. Contoso's client application shows Megan's incoming call: Client application receives incoming call notification. _showIncomingCall_ method would use custom Contoso's logic to translate the phone number to customer's name (e.g., a database storing key-value pairs phone number and customer name). When the information is retrieved the notification is shown to Alice in Contoso's client application.
92
+
3. Megan start's a call to PSTN number assigned to Teams user Alice: Megan uses her phone to call Alice. The carrier network will connect to Teams PSTN connectivity assigned to Alice and it will ring all Teams endpoints registered for Alice. It includes: Teams desktop, mobile, web clients, and applications based on Azure Communication Services calling SDK.
93
+
4. Contoso's client application shows Megan's incoming call: Client application receives incoming call notification. _showIncomingCall_ method would use custom Contoso's logic to translate the phone number to customer's name (for example, a database storing key-value pairs consisting of a phone number and customer name). When the information is retrieved, the notification is shown to Alice in Contoso's client application.
94
94
5. Alice accepts the call: Alice selects a button to accept the call and the connection between Alice and Megan is established.
95
95
96
96
@@ -99,7 +99,7 @@ This scenario is showing a multi-tenant use case, where company Contoso is provi
99
99
100
100

101
101
102
-
The following sequence diagram is showing detailed steps of initiating a VoIP call:
102
+
The following sequence diagram shows detailed steps for initiation of a Teams VoIP call:
103
103
104
104
:::image type="content" source="./media/custom-teams-endpoint/end-to-end-use-cases/cte-e2e-cte-to-voip-out-full.svg" alt-text="Sequence diagram is describing detailed set of steps, that happens to initiate a Teams VoIP call using Azure Communication Services and Teams." lightbox="./media/custom-teams-endpoint/end-to-end-use-cases/cte-e2e-cte-to-voip-out-full.svg":::
Contoso's client application will then show the list of users and the ability to initiate a call to a given user.
118
118
119
-
3. Initiate a call to Megan: Alice selects a button to initiate a Teams VoIP call to Megan in the Contoso's Client application. Client application leverages Azure Communication Services calling SDK to provide the calling capability. Calls in Teams Clients are associated with Teams chat. First, the application requests creation of a dedicated chat for the VoIP call.
119
+
3. Initiate a call to Megan: Alice selects a button to initiate a Teams VoIP call to Megan in the Contoso's Client application. Client application uses Azure Communication Services calling SDK to provide the calling capability. Calls in Teams Clients are associated with Teams chat. First, the application requests creation of a dedicated chat for the VoIP call.
var teamsUser = { microsoftTeamsUserId:'e8b753b5-4117-464e-9a08-713e1ff266b3'};
@@ -167,13 +167,13 @@ This scenario is showing a multi-tenant use case, where company Contoso is provi
167
167
168
168

169
169
170
-
The following sequence diagram is showing detailed steps of receiving a VoIP call:
170
+
The following sequence diagram shows detailed steps for accepting incoming Teams VoIP calls:
171
171
172
172
:::image type="content" source="./media/custom-teams-endpoint/end-to-end-use-cases/cte-e2e-cte-to-voip-in-full.svg" alt-text="Sequence diagram is describing detailed set of steps, that happens to receive a Teams VoIP call using Azure Communication Services. Graph API, and Teams." lightbox="./media/custom-teams-endpoint/end-to-end-use-cases/cte-e2e-cte-to-voip-in-full.svg":::
173
173
174
174
### Steps
175
175
1. Authenticate Alice from Fabrikam in Contoso's client application: Alice is using a browser to open Fabrikam's web page and authenticates. You can find more details about [the authentication with Teams identity](./custom-teams-endpoint-authentication-overview.md). If the authentication is successful, Alice is redirected to the initial page.
176
-
2. Subscribe for receiving calls: Client application leverages Azure Communication Services calling SDK to provide the calling capability. First, it creates an instance of callAgent, that holds the Azure Communication Services access token acquired during 1st step.
176
+
2. Subscribe for receiving calls: Client application uses Azure Communication Services calling SDK to provide the calling capability. First, it creates an instance of callAgent, that holds the Azure Communication Services access token acquired during first step.
The method _showIncomingCall_ is a custom Contoso's method that will render a user interface to indicate incoming calls and two buttons to accept and decline the call. If the user selects accept button then the following code is used:
194
+
The method _showIncomingCall_ is a custom Contoso's method that will render a user interface to indicate incoming calls and two buttons to accept and decline the call. If you select accept button then the following code is used:
195
195
196
196
```js
197
197
// Accept the call
198
198
var call =awaitincomingCall.accept();
199
199
```
200
200
201
-
If the user selects the decline button, then the following code is used:
201
+
If you select the decline button, then the following code is used:
202
202
203
203
204
204
```js
205
205
// Reject the call
206
206
incomingCall.reject();
207
207
```
208
208
209
-
3. Megan start's a VoIP call to Teams user Alice: Megan uses her Teams desktop client to call Alice. The Teams infrastructure will ring all endpoints associated with Alice. It includes existing Teams desktop, mobile, web clients, and applications based on Azure Communication Services calling SDK authenticated as Alice.
209
+
3. Megan start's a VoIP call to Teams user Alice: Megan uses her Teams desktop client to call Alice. The Teams infrastructure will ring all endpoints associated with Alice. It includes: Teams desktop, mobile, web clients, and applications based on Azure Communication Services calling SDK.
210
210
4. Contoso's client application shows Megan's incoming call: Client application receives incoming call notification. _showIncomingCall_ method would use Graph API to translate the Teams user ID to display name.
When the information is retrieved the notification is shown to Alice in Contoso's client application.
219
+
When the information is retrieved, the notification is shown to Alice in Contoso's client application.
220
220
221
221
5. Alice accepts the call: Alice selects a button to accept the call and the connection between Alice and Megan is established.
222
222
@@ -225,7 +225,7 @@ This scenario is showing a multi-tenant use case, where company Contoso is provi
225
225
226
226

227
227
228
-
The following sequence diagram is showing detailed steps of joining a Teams meeting:
228
+
The following sequence diagram shows detailed steps for joining a Teams meeting:
229
229
230
230
:::image type="content" source="./media/custom-teams-endpoint/end-to-end-use-cases/cte-e2e-cte-to-meeting-full.svg" alt-text="Sequence diagram is describing detailed set of steps, that happens to join a Teams meeting using Azure Communication Services, Graph API, and Teams." lightbox="./media/custom-teams-endpoint/end-to-end-use-cases/cte-e2e-cte-to-meeting-full.svg":::
Contoso's client application will then show the list of Teams meetings and the ability to join them.
247
247
248
-
3. Join Teams meeting "Project Tailspin": Alice selects a button to join Teams meeting "Project Tailspin" in the Contoso's Client application. Client application leverages Azure Communication Services calling SDK to provide the calling capability. Client applications create an instance of callAgent, that holds the Azure Communication Services access token acquired during 1st step.
248
+
3. Join Teams meeting "Project Tailspin": Alice selects a button to join Teams meeting "Project Tailspin" in the Contoso's Client application. Client application uses Azure Communication Services calling SDK to provide the calling capability. Client applications create an instance of callAgent, that holds the Azure Communication Services access token acquired during first step.
0 commit comments