实时音视频（TRTC）

是腾讯云提供的一套低延时、高质量的音视频通讯服务，致力于为腾讯云客户提供稳定、可靠和低成本的音视频传输能力。您可以使用该服务快速构建“视频通话”、“在线教育”、“直播连麦”、“在线会议”等对通信延时要求比较苛刻的音视频应用。

• 这里我们以无UI集成方案为例，介绍腾讯云直播的完整使用方法
  官方文档： https://cloud.tencent.com/document/product/647/32398无UI集成方案

为了让我们更快速的了解产品，腾讯云提供了各种设备的Demo,安装后即可体验TRTC的各种功能。

1. 登录后台（实时音视频控制台） > 开发辅助 > 快速跑通Demo
2. 新建应用 > 输入应用名称 创建一个新应用
3. 下载Web端SDK及配套Demo源码
4. 点击“已下载，下一步”
5. 进入修改配置页，获取 SDKAppID 和密钥。

• 运行 Demo

为满足不同客户的需求，TRTC Web 目前提供以下几种基础 Demo：

1. Demo 1: base-js
   开发框架：jQuery + 原生 JavaScript
   TRTC Web 基础 Demo (jQuery 版本) 集成了 TRTC Web SDK 的基础音视频通话、设备选择等功能，可直接在浏览器中运行。快速体验可访问 base-js 在线体验地址。
2. Demo 2: quick-demo-js
   开发框架：无框架，原生 JavaScript
   TRTC Web 快速运行 Demo (原生 JavaScript 版本) 集成了 TRTC Web SDK 的基础音视频通话、设备选择等功能，可直接在浏览器中运行。快速体验可访问 quick-demo-js 在线体验地址。
3. Demo 3: quick-demo-vue2-js
   开发框架：Vue 2 + JavaScript
   TRTC Web 快速运行 Demo (Vue2 版本) 集成了 TRTC Web SDK 的基础音视频通话、设备选择等功能，需要您安装 Node 环境。快速体验可访问 quick-demo-vue2-js 在线体验地址。
4. Demo 4: quick-demo-vue3-ts
   开发框架：Vue 3 + TypeScript
   TRTC Web 快速运行 Demo (Vue3 版本) 集成了 TRTC Web SDK 的基础音视频通话、设备选择等功能，需要您安装 Node 环境。快速体验可访问 quick-demo-vue3-ts 在线体验地址。

这里我们以Demo1来示范使用流程

• Demo1是最原生的一个项目，为html+js+jq，仅部分表单项、方法使用了jQuery操作赋值，属于4个Demo里最轻量、最便捷、直接可以打开使用，不需要安装其他依赖或使用终端运行启动！

项目目录为 TRTC_Web/base-js。

1. 在下载的源码中找到并打开 TRTC_Web/base-js/js/debug/GenerateTestUserSig.js 文件。
2. 设置 GenerateTestUserSig.js 文件中的相关参数：

SDKAPPID：默认为0，请设置为实际的 SDKAppID。
SECRETKEY：默认为空字符串，请设置为实际的密钥信息。

1. 运行 Demo：
   使用 Chrome 浏览器打开 Demo 根目录下的 index.html 文件即可运行 Demo。
   

• 单击 加入房间 加入音视频通话房间并且发布本地音视频流。
• 您可以打开多个页面，每个页面都单击 加入房间，正常情况下可以看到多个画面并模拟实时音视频通话。
• 单击摄像头图标可以选择摄像头设备。
• 单击麦克风图标可以选择麦克风设备。

WebRTC 需要使用摄像头和麦克风采集音视频，在体验过程中您可能会收到来自 Chrome 浏览器的相关提示，单击 允许。

• 至此，我们的腾讯云TRTC实时音视频Demo就已经运行完毕。

注：本文使用的生成 UserSig 的方案是在客户端中配置 SECRETKEY，该方法中 SECRETKEY 很容易被反编译逆向破解，一旦您的密钥泄露，攻击者就可以盗用您的腾讯云流量，因此该方法仅适合本地跑通 Demo 和功能调试。

正确的 UserSig 签发方式是将 UserSig 的计算代码集成到您的服务端，并提供面向 App 的接口，在需要 UserSig 时由您的 App 向业务服务器发起请求获取动态 UserSig。更多详情请参见 服务端生成 UserSig。

• index.html页面会自动捕获URL中的Query参数
  例如：live-room/index.html?roomId=99887766&sdkAppId=1408888888&userId=152888888888888
  在登录页（进入房间页）的表单会自动填充进去我们的参数，所以我们在跳转到直播间的时候可以将部分参数拼接到url后面。

• 可以单独部署到服务器上，如果使用框架的项目可以放进静态资源文件夹里。如果是放在静态资源地址里跳转的话要注意路径，最前面要加 / 例如：/base/index.html而不是base/index.html

当你需要同时使用屏幕共享与实时音视频两个功能的时候，官方文档内明确规定不可以同时开启这两个功能的配置项

• 修改js/share-client.js 中的TRTC.createClient实例中的autoSubscribe为false

- 负责屏幕分享的 shareClient 需要关闭自动订阅，否则会出现重复订阅远端流的情况。
- 负责本地音视频流发布的 client 需要取消订阅 shareClient 发布的流。否则会出现自己订阅自己的情况。（会将自己踢出房间）

• 上述流程为直播间使用的基本流程，可根据上述流程自由拓展开发（区分角色，添加特效、功能等）

以上为本人使用腾讯云TRTC开发直播室功能过程记录整理，内容参考官方文档。

腾讯云TRTC —— 实时音视频完整案例 音视频+共享屏幕直播相关推荐

1. 【新知实验室】——腾讯云TRTC实时音视频体验

   [新知实验室]--腾讯云TRTC实时音视频体验 前言 一.腾讯实时音视频TRTC是什么? 二.DEMO体验 1.注册腾讯云账号 2.使用实时音视频(需先开通) 3.查看项目(查看密钥和快速上手操作) ...

2. 【新知实验室】腾讯云TRTC实时音视频体验

   新知实验室  腾讯云TRTC实时音视频体验 在我们的日常生活中,音视频通话.直播及视频会议等诸多音视频场景已经很常见,腾讯发布的 实时音视频(Tencent RTC) 产品,基于腾讯多年来在网络与音视 ...

3. 腾讯云TRTC web sdk实践

   实时音视频(TRTC) 是腾讯云提供的一套低延时.高质量的音视频通讯服务,致力于为腾讯云客户提供稳定.可靠和低成本的音视频传输能力.您可以使用该服务快速构建"视频通话"." ...

4. 云-腾讯云：实时音视频

   ylbtech-云-腾讯云:实时音视频 腾讯实时音视频(Tencent-RTC)是腾讯云基于 QQ 十多年来在音视频通话技术上积累,提供全平台互通高品质实时视频通话服务的一款产品:支持微信小程序/H5 ...

5. 【新知实验室】腾讯云TRTC服务体验

   前言 什么是腾讯云TRTC 腾讯云实时音视频(Tencent RTC,简称 TRTC)是一项低延时.高并发.稳定可靠的音视频 PaaS云服务,主要提供多人实时通话以及低延时互动直播能力.TRTC 将腾 ...

6. 腾讯云TRTC服务实现小程序语音/视屏会议

   腾讯云TRTC服务的入门 TRTC 是腾讯云主打全平台互通的多人音视频通话和低延时互动直播解决方案.TRTC服务有多种客户端的支持,对于IOS.Android.React native等都支持的比较好 ...

7. 腾讯云 TRTC 监控仪表盘实用指南

   腾讯云实时音视频(Tencent RTC,简称 TRTC)是一项低延时.高并发.稳定可靠的音视频 PaaS 云服务,主要提供多人实时通话以及低延时互动直播能力.TRTC 将腾讯 21 年来在网络与音视 ...

8. 腾讯云TRTC服务实现Web视频会议

   腾讯云TRTC服务实现Web视频会议 背景 近期公司承接了某高校智慧校园的项目建设工作,其中在家校协作的板块中需要进行视频教学,以及线上屏幕共享,为了完成这一需求,我在自研与第三方服务的选择之间选择了 ...

9. 基于腾讯云开发微信小程序（新闻发布及共享平台）上

   基于腾讯云开发微信小程序(新闻发布及共享平台)上 文章目录 传统的微信小程序开发 一.云开发是什么? 二.使用步骤 1.创建云环境 2.云数据库的创建 3.云储存 4.云函数 总结 传统的小程序开发 ...

10. Vue 接入腾讯云【实时音视频】TRTC

    需求 (Web端和小程序端进行视频通话) 1. web 端 开启一个房间,房间号假设为 888.此时,画面可以看到自己端的画面. 2. 小程序 端,输入相同的房间号 888,进入房间,即可和 web ...

最新文章

1. Linux/Unix中的重定向简单实例
2. 一、JVM及Java体系结构
3. deeplearning4j – 分布式DL开源项目
4. hbase官方网站声称的兼容是否是100%兼容？
5. php与mysql关系大揭秘_【慕课笔记】PHP与MySQL关系大揭秘
6. C++string字符串1.2
7. （转）iOS 屏幕适配
8. K8s中原生配置中心探究
9. 20套初级javaweb项目开发案例（适合小白）
10. 视频剪辑，教你如何给视频水平翻转
11. 打印服务自动停止的解决方法
12. ODIN SNN处理器
13. 微信小程序调用域名服务器的服务
14. Oracle函数之ratio_to_report函数
15. 排列组合计算公式简易版
16. MobileNext：打破常规，依图逆向改造inverted residual block | ECCV 2020
17. 计算机与算盘有什么区别
18. 关于使用pop（）的用法
19. Ubuntu 8.04 优化设置
20. 设计分享|单片机直流电机转速控制（汇编）

热门文章

1. 图像处理 理想低通滤波器_如何为您的文章选择理想的图像
2. java利用复循环洗牌算法_实现不重复取数两种算法（洗牌算法）
3. JavaWeb学习笔记（七）—— JSP
4. 奥西450的服务器系统,奥西TDS450
5. 更改jenkins插件地址为国内源地址
6. C语言 输入今天的日期，显示明天的日期
7. Matlab进行t检验
8. Selenium GUI自动化下载百度图片
9. 阿里智能App下架，智能家居平台淘汰赛拉开大幕
10. 2022年第二届长三角高校数学建模竞赛B题经验、论文、代码展示