TRTC Web SDK

从部署到实践，即刻拥有你的专属龙虾助手

OpenClaw开发者专区🦞🦞🦞

自行/邀约他人一键搬运博客，享价值百万资源包

腾讯云自媒体同步曝光计划

往期视频·干货材料·成员作品 最新动态

腾讯技术创作特训营知识专栏

新邀入驻腾讯云开发者社区，福利多多！

WebRTC 技术由 Google 最先提出，目前主要在桌面版 Chrome 浏览器、桌面版 Edge 浏览器、桌面版 Firefox 浏览器、桌面版 Safari 浏览器以及移动版的 Safari 浏览器上有较为完整的支持，其他平台（例如 Android 平台的浏览器）支持情况均比较差。

Web端集成TRTC SDK、集成播放器SDK

在使用腾讯的TRTC Web SDK可以在Web端实现主播的直播流推送和观众的拉流观看，但是由于 TRTC 采用 UDP 协议进行传输音视频数据，在直播时可能会遇到一些问题：

TRTC Web SDK + 播放器 Web SDK 实现 CDN 直播观看

在使用腾讯的 trtc 产品时，要是想在微信小程序实现直播的业务能力，首先需要指定 ‘主播’ 和 ‘观众’ 角色，小程序的 <trtc-room> 中的标签属性和实例对象的方法都没有做直播状态时的角色区分；再就是想在主播端和观众端实现一些弹幕，点赞，连麦互动时需要使用到 custom 自定义面板，需要对页面进行设计，我也有对 custom 面板的简单使用写了两篇文章可供参考：微信小程序TRTC使用custom自定义面板（理解篇）、微信小程序TRTC使用custom自定义面板（实现篇）。为了方便开发者，腾讯云还有 移动直播SDK，其中集成了弹幕、点赞、美颜、连麦等一些功能的，微信小程序端的调用方式也是以组件形势进行调用。

小程序使用 移动直播SDK

本文主要是使用 custom 面板实现直播互动，上下麦操作。如有疑问可参考 微信小程序TRTC使用custom自定义面板（理解篇）。本文只是简单演示如何实现主播与观众进行连麦互动，在实际中，通常是有主播端发起与粉丝进行直播互动，通过粉丝来接受，进行连麦。发送这种消息可以使用IM（即时通讯）完成。

微信小程序TRTC使用custom自定义面板（实现篇）

登录腾讯云官网，官网给出了小程序TRTC的Demo分别实现了语音聊天室、双人视频通话、多人视频通话，小程序TRTC提供了custom自定义面板开发者们可以自行设计页面内容和样式，接下来我们就使用custom自定义面板实现一下直播互动功能。

微信小程序TRTC使用custom自定义面板（理解篇）

在使用之前我们需要了解 <live-player> 和 <live-pusher> 微信小程序原生组件，因为小程序TRTC组件标签 <trtc-room> 是基于这两个标签实现的组件，所以在运行调试时开发工具是不支持的，只能在真机上运行。

微信小程序使用TRTC

在使用 TRTC Web SDK 中，经常需要使用到两个对象，Client 客户端对象，Stream 流对象：

使用TRTC Web SDK实现实时音视频通话

基本的对话场景请参考 使用TRTC Web SDK实现实时音视频通话 。本文主要讲述 vue 使用 TRTC Web SDK 来实现多人会议的功能，废话不多说直接上代码：（注意下方代码中 sdkAppId 请使用自己的）

vue使用TRTC Web SDK实现多人会话场景

以主播身份进入房间进行直播的场景跟实时音视频通话场景流程一样，请参考使用TRTC Web SDK实现实时音视频通话。本文主要介绍以观众身份进入直播间。

使用TRTC Web SDK实现互动直播

文章

问答

视频

教程

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云智能顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

聚焦“写作效率、视觉美观与运行性能”三方面进行全面升级，为您提供更高效、稳定的创作环境

社区富文本&Markdown编辑器全新改版上线，欢迎大家体验!

诚挚邀请您参与本次调研，分享您的真实使用感受与建议。您的反馈至关重要，感谢您的支持与参与！

社区新版编辑器体验调研

腾讯云开发者社区推出了TRTC Web SDK专栏，为你提供了TRTC Web SDK的相关文章，致力于帮助开发者快速成长与发展。

TRTC Web SDK-腾讯云开发者社区

TRTC Web SDK

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐