tencent cloud

Feedback

Last updated: 2022-02-14 11:40:52

    This document describes how to quickly integrate the Tencent Cloud TRTC SDK for Web into your project.

    Supported Platforms

    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.

    • If your application scenario is mainly in the education sector, consider using TRTC SDK for Electron, which supports big and small (dual-channel) images, with more flexible screen sharing schemes and better recovery capabilities for poor network connections.
    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.

    URL Protocol Support

    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

    Firewall Configuration

    The TRTC SDK for Web uses the following ports for data transfer, which should be added to the whitelist of the firewall.

    • TCP port: 8687
    • UDP ports: 8000, 8080, 8800, 843, 443, 16285
    • Domain name: qcloud.rtc.qq.com

    Integrating the TRTC SDK for Web

    Integrating via npm

    1. Use npm to install the SDK package in your project.
      npm install trtc-js-sdk --save
      
    2. Import the module in the project script.
      import TRTC from 'trtc-js-sdk';
      

    Integrating via script

    Add the following code to your webpage:

    <script src="trtc.js"></script>
    

    Resources

    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.

    Contact Us

    Contact our sales team or business advisors to help your business.

    Technical Support

    Open a ticket if you're looking for further assistance. Our Ticket is 7x24 avaliable.

    7x24 Phone Support