This document describes how to quickly integrate the Tencent Cloud TRTC SDK for Web into your project.
The TRTC SDK for web is based on WebRTC, which was originally released by Google and is well supported by many modern browsers such as Chrome, Edge, Firefox, Safari, and Opera. For a list of browsers supported by TRTC, see Supported Platforms.
Note:
- You can run the TRTC Web SDK Support Level Test in a browser, for example, WebView, to test whether the environment fully supports WebRTC.
- Due to patent issues, H.264 encoding, which is required for stream publishing, is unavailable for Chrome versions earlier than v88 on Huawei devices. To run the TRTC SDK for web on Chrome or Chrome WebView-based browsers on Huawei devices, please submit a ticket to enable VP8 encoding/decoding.
Scenario | Protocol | Receive (Playback) | Send (Publish) | Share Screen | Remarks |
---|---|---|---|---|---|
Production | HTTPS | Supported | Supported | Supported | Recommended |
Commercial | HTTP | Supported | Not supported | Not supported | |
Local development | http://localhost | Supported | Supported | Supported | Recommended |
Local development | http://127.0.0.1 | Supported | Supported | Supported | |
Local development | http://[local IP address] | Supported | Not supported | Not supported | |
Local development | file:/// | Supported | Supported | Supported |
The TRTC SDK for Web uses the following ports for data transfer, which should be added to the whitelist of the firewall.
npm install trtc-js-sdk --save
import TRTC from 'trtc-js-sdk';
Add the following code to your webpage:
<script src="trtc.js"></script>
Download the SDK here.
For more information on the initialization process and how to use APIs, please see the tutorials below:
Feature | Sample Code |
---|---|
Audio/Video call | Tutorial |
Interactive live streaming | Tutorial |
Switching cameras/mics | Tutorial |
Setting local video attributes | Tutorial |
Dynamically enabling/disabling local audio/video | Tutorial |
Screen sharing | Tutorial |
Detecting volume | Tutorial |
Custom capturing and rendering | Tutorial |
Limit on the number of upstream users in a room | Tutorial |
Adding background music and audio effects | Tutorial |
Environment and device check before calls | Tutorial |
Network quality check before calls | Tutorial |
Device plugging/unplugging check | Tutorial |
Publishing to CDN | Tutorial |
Enabling dual-channel mode | Tutorial |
Enabling beauty filters | Tutorial |
Enabling watermarking | Tutorial |
Enabling cross-room communication | Tutorial |
Note:Learn more about the features of the TRTC SDK for web here.
Was this page helpful?