|
2 | 2 | title: Azure Communication Services User Facing Diagnostics (Web)
|
3 | 3 | titleSuffix: An Azure Communication Services concept document
|
4 | 4 | description: Provides usage samples of the User Facing Diagnostics feature for Web.
|
5 |
| -author: lucianopa-msft |
6 |
| -ms.author: lucianopa |
| 5 | +author: sloanster |
| 6 | +ms.author: micahvivion |
7 | 7 |
|
8 | 8 | services: azure-communication-services
|
9 |
| -ms.date: 04/06/2023 |
| 9 | +ms.date: 06/04/2025 |
10 | 10 | ms.topic: include
|
11 | 11 | ms.service: azure-communication-services
|
12 | 12 | ms.subservice: calling
|
13 | 13 | ---
|
14 | 14 |
|
| 15 | +## Local vs Remote User Facing Diagnostics |
| 16 | +User Facing Diagnostics (UFD) are enabled to expose user-impacting events programmatically on a user's device. With an ACS, there are two methods for consuming and generating UFDs: local UFDs and remote UFDs. Local UFDs are generated on the local user's phone or browser. Remote UFDs are events occurring in a remote participant's environment, which allow a user to consume and view those events from a distance. |
| 17 | +User Facing Diagnostics (UFD) allows you to see when local or remote participants are experiencing issues that affect audio-video call quality. UFD provides real-time diagnostics on network conditions, device functionality, and media performance, helping developers identify problems such as poor connectivity, muted microphones, or low bandwidth. While UFD does not automatically fix these issues, it allows applications to offer proactive feedback to users, suggesting solutions like checking their internet connection or adjusting device settings. Based on this data, users can either correct the issue themselves (e.g., turn off video when the network is weak) or display the information through the User Interface. |
| 18 | +There are some minor differences between mote remote UFD's and local UFD's. Those differences are: |
| 19 | +• The calling SDK does not expose the speakingWhileIsMuted remote UFD due to privacy concerns. |
| 20 | +• The calling SDK will only expose and stream UFD (User Feedback Data) to a maximum of 20 participants on the call. When the number of participants exceeds 20, we limit and cease transmission of remote UFD to prevent overloading the network with these events. |
| 21 | +• The calling SDK will filter so you will only see 3 remote UFD events per minute coming from a unique client. |
| 22 | +• From the client SDK perspective, you need to enable the functionality for the local UFDs to be sent remotely. |
| 23 | + |
15 | 24 | ## Diagnostic values
|
16 | 25 | The following user-facing diagnostics are available:
|
17 | 26 |
|
@@ -66,7 +75,7 @@ User-facing diagnostics is an extended feature of the core `Call` API and allows
|
66 | 75 | const userFacingDiagnostics = call.feature(Features.UserFacingDiagnostics);
|
67 | 76 | ```
|
68 | 77 |
|
69 |
| -## User Facing Diagnostic events |
| 78 | +## Local User Facing Diagnostic events |
70 | 79 |
|
71 | 80 | - Subscribe to the `diagnosticChanged` event to monitor when any user-facing diagnostic changes.
|
72 | 81 |
|
@@ -102,6 +111,49 @@ const diagnosticChangedListener = (diagnosticInfo: NetworkDiagnosticChangedEvent
|
102 | 111 |
|
103 | 112 | userFacingDiagnostics.network.on('diagnosticChanged', diagnosticChangedListener);
|
104 | 113 | userFacingDiagnostics.media.on('diagnosticChanged', diagnosticChangedListener);
|
| 114 | + |
| 115 | + |
| 116 | +## Using Remote User Facing Diagnostics |
| 117 | +```js |
| 118 | +/*************** |
| 119 | + * Interfaces ** |
| 120 | + ***************/ |
| 121 | +export declare type RemoteDiagnostic = { |
| 122 | + // Remote participant's Id |
| 123 | + readonly participantId: string; |
| 124 | + // This is the MRI of the remote participant. |
| 125 | + readonly rawId: string; |
| 126 | + // Remote partcipant Object |
| 127 | + readonly remoteParticipant?: RemoteParticipant; |
| 128 | + // Name of the diagnostic |
| 129 | + readonly diagnostic: NetworkDiagnosticType | MediaDiagnosticType | ServerDiagnosticType; |
| 130 | + // Value of the diagnostic |
| 131 | + readonly value: DiagnosticQuality | DiagnosticFlag; |
| 132 | + // Value type of the diagnostic, "DiagnosticFlag" or "DiagnosticQuality" |
| 133 | + readonly valueType: DiagnosticValueType; |
| 134 | +}; |
| 135 | +export declare interface RemoteParticipantDiagnosticsData { |
| 136 | + diagnostics: RemoteDiagnostic[]; |
| 137 | +} |
| 138 | +
|
| 139 | +
|
| 140 | +/***************** |
| 141 | + * Sample usage ** |
| 142 | + *****************/ |
| 143 | +const remoteUfdsFeature = call.feature(Features.UserFacingDiagnostics).remote; |
| 144 | +
|
| 145 | +// Listen for remote client UFDs. These are UFDs raised from remote participants. |
| 146 | +const remoteDiagnosticChangedListener = (diagnosticInfo: RemoteParticipantDiagnosticsData) => { |
| 147 | + for (const diagnostic of diagnosticInfo.diagnostics) { |
| 148 | + console.error(`Remote participant diagnostic: ${diagnostic.diagnostic} = ${diagnostic.value}`); |
| 149 | + } |
| 150 | +} |
| 151 | +remoteUfdsFeature.on('diagnosticChanged', remoteDiagnosticChangedListener); |
| 152 | +
|
| 153 | +// Start sending local UFDs to remote clients. Must call this API so that local UFDs can start sending out and remote clients can receive them. |
| 154 | +remoteUfdsFeature.startSendingDiagnostics(); |
| 155 | +// Stop sending local UFDs to remote clients. |
| 156 | +remoteUfdsFeature.stopSendingDiagnostics(); |
105 | 157 | ```
|
106 | 158 |
|
107 | 159 | ## Get the latest User Facing Diagnostics
|
|
0 commit comments