Tencent Cloud

Recent Pages

Detect Capabilities

Last updated: 2024-03-26 10:56:12

To ensure that users can have a good experience with the TRTC SDK, we recommend you test the user's media device and network quality the user enters a TRTC room.
Supported Platforms
Refer to Supported Platforms.
Detect Browser Capabilities
Before entering room, we recommend you use the TRTC.isSupported API to check whether the SDK supports the current browser first, and if not, please guide the user to use a supported browser(Chrome 56+, Edge 80+, Firefox 56+, Safari 11+).
TRTC.isSupported().then(checkResult => {
  // Not supported, guide the user to use a supported browser(Chrome 56+, Edge 80+, Firefox 56+, Safari 11+).
  if (!checkResult.result) {}
  // Not support to publish video
  if (!checkResult.detail.isH264EncodeSupported) {}
  // Not support to subscribe video
  if (!checkResult.detail.isH264DecodeSupported) {}
});
If the check result returned by TRTC.isSupported is false, this may be because.
1. The web page uses the http protocol. Browsers do not allow http protocol sites to capture cameras and microphones, you need to deploy your page using the https protocol.
2. Firefox browser needs to load H264 codec dynamically after installation, so the detection result will be false for a short period of time, please wait and try again or guide to use other browsers.
Test Media Device
Generally, the Media Device Testing looks like this.
﻿
﻿
﻿
﻿
﻿
﻿
﻿
﻿
﻿
﻿
Test Camera
1. Get camera list
Generally, you need to check the camera list first to confirm whether the user has a camera. Then, you can show a camera list to let user to select the camera they want.
const cameraList = await TRTC.getCameraList();
const hasCameraDevice = cameraList.length > 0;
﻿
if (!hasCameraDevice) {
    // User has not any camera.
}
2. Capture and play camera
In this step, you need to capture and play camera, and does not need to publish stream. 
If capturing camera successfully, you need guide user confirm whether user can see the camera view normally.
If capturing camera failed, it is usually caused by NotAllowedError or NotReadableError, refer to DEVICE_ERROR.
try {
    // Capture and play camera, not need to publish stream
    await trtc.startLocalVideo({ view: 'camera-video-view-id', publish: false });
} catch(error) {
    // Common reasons: NotAllowedError or NotReadableError
}
3. Switch camera
The SDK will capture the first camera of camera list by default if you did not specify the cameraId when calling trtc.startLocalVideo.
The user may want to switch another camera before entering room if the user has a lot of cameras.
// You can get the cameraId from the camera list you got in fisrt step.
if (cameraList[1]) {
    try {
        await trtc.updateLocalVideo({ option: { cameraId: cameraList[1].deviceId } });
    } catch(error) {
      // Common reasons: NotAllowedError or NotReadableError, same with step 2.
    }
}
4. Stop camera
You need to stop camera when the testing finished.
await trtc.stopLocalVideo();
Test Microphone
1. Get mircrophone list
Generally, you need to check the mircrophone list first to confirm whether the user has a mircrophone. Then, you can show a mircrophone list to let user to select the mircrophone they want.
const microphoneList = await TRTC.getMicrophoneList();
const hasMicrophoneDevice = micList.length > 0;
﻿
if (!hasMicrophoneDevice) {
    // User has not any microphone.
}
2. Capture microphone and get the volume
In this step, you need to capture the microphone, get the audio volume of microphone to show a volume bar,  and does not need to publish stream. 
If capturing successfully, you need guide the user confirm whether the volume bar has changed. 
If capturing failed, it is usually caused by NotAllowedError or NotReadableError, refer to DEVICE_ERROR.
try {
    // Capture microphone
    await trtc.startLocalAudio({ publish: false });
    trtc.on(TRTC.EVENT.AUDIO_VOLUME, event => {
        event.result.forEach(({ userId, volume }) => {
            // When userId is an empty string, it represents the volume of the local microphone.
            const isMe = userId === ''; 
            if (isMe) {
               // show a volume bar based on the value of volume.
            }
        })
    });
    trtc.enableAudioVolumeEvaluation(500);
} catch(error) {
    // Common reasons: NotAllowedError or NotReadableError
}
3. Switch microphone
The SDK will capture the first microphone of microphone list by default if you did not specify the microphoneId when calling trtc.startLocalAudio.
The user may want to switch another microphone before entering room if the user has a lot of microphones.
// You can get the microphoneId from the microphone list you got in fisrt step.
if (microphoneList[1]) {
    try {
        await trtc.updateLocalAudio({ option: { microphoneId: microphoneList[1].deviceId } });
    } catch(error) {
      // Common reasons: NotAllowedError or NotReadableError, same with step 2.
    }
}
4. Stop microphone
// You need to stop microphone when the testing finished.
await trtc.stopLocalAudio();
// disable audio-volume event
trtc.enableAudioVolumeEvaluation(-1);
Test Speaker
1. Get speaker list
const speakerList = await TRTC.getSpeakerList();
if (speakerList.length === 0) {
    // User has not speaker.
}
2. Play a mp3 media file through the audio element.
You need to guide user to play the mp3 file and confirm whether they can hear the sound from the speaker.
<audio id="audio-player" src="xxxxx" controls></audio>
3. Switch speaker
You cannot use the TRTC.setCurrentSpeaker to switch speaker, because you play a mp3 by audio element but not TRTC SDK. There is a HTMLMediaElement.sinkId property which can be used to set speaker.
const audioElement = document.getElementById('audio-player');
if (speakerList[1]) {
    audioElement.sinkId = speakerList[1].deviceId;
}
Detect Network Quality
Refer to Detect Network Quality.
Online TRTC Capability Detection
You can use the Online TRTC Capability Detection where you are currently using the TRTC SDK to detect the current environment. You can also click the "Generate Report" button to get a report of the current environment for environment detection or troubleshooting.