新知实验室TRTC初体验

简介: 新知实验室TRTC初体验

小记


一次偶然的邂逅,让我知道了TRTC实时音视频这个神奇的东西,于是便开始研究起来这个鬼东西,接下来将详细记录一下开发过程,以便后期使用.


正文


实时音视频(TRTC)


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


如和使用


  1. 注册腾讯云账号
  2. 登录实时音视频控制台,选择 开发辅助 > 快速跑通Demo。
  3. 单击 新建应用 输入应用名称,例如 TEST;若您已创建应用可单击 选择已有应用。
  4. 查看应用
  5. 下载 Web 端 SDK 及配套的 Demo 源码。

这里有一个坑点需要注意

为啥我没有用uniapp 而是选择web 的呢 ?

首先如果选择uniapp 或者小程序的话需要你自己注册一个企业版的小程序账号 ,并开通音视频相关的外部接口, 然而我并没有.因此我无奈的选择了web 的sdk进行开发,进一步感受丝滑 ,哈哈哈

  1. 获取 SDKAppId 和 密钥(SecretKey) ,这两个值相当于用户的token ,识别用户用的 ,在调用sdk 的时候 需要给个输入框让其输入 ,
  2. 接下来就是运行项目了 比较简单
  3. 在这里输入 appid和秘钥进入房间就可以了 .


运行效果展示



还是棒棒的哦!!!


代码分析


1.复制可使用链接

通过switchCase 来进行分流管理

switch (this.label) {
      case 'userId': {
        const userId = getUrlParam('userId');
        this.infoValue = userId ? userId : `user_${parseInt(Math.random() * 100000000, 10)}`;
        break;
      }
      case 'roomId': {
        const roomId = getUrlParam('roomId');
        this.type = 'number';
        this.infoValue = roomId ? roomId : parseInt(Math.random() * 100000, 10);
        break;
      }
      case 'sdkAppId': {
        const sdkAppId = getUrlParam('sdkAppId');
        this.type = 'number';
        this.infoValue = sdkAppId ? sdkAppId : '';
        break;
      }
      case 'secretKey': {
        const secretKey = getUrlParam('secretKey');
        this.infoValue = secretKey ? secretKey : '';
        break;
      }
      default:
        break;
    }

将传过来的参数通过getUrlParam 方法快速生成分享链接

2. 获取用户签名

<!-- rtc 房间 -->
      <comp-room
        :sdkAppId="Number(sdkAppId)"
        :secretKey="secretKey"
        :userId="userId"
        :roomId="Number(roomId)"
        :cameraId="cameraId"
        :microphoneId="microphoneId"></comp-room>

调用组件,将相关参数传入

组件内通过 new LibGenerateTestUserSig(sdkAppId, secretKey, 604800);sdkAppid,secretKey,有效时间 传入到封装好的方法中, 这个封装的方法官网提供,直接使用便可

同时 new LibGenerateTestUserSig 调用之后会返回一个函数 , 我们通过函数中的genTestUserSig 来获取用户的签名,代码如下

const { sdkAppId, secretKey, roomId } = this;
      const inviteUserId = `user_${parseInt(Math.random() * 100000000, 10)}`;
      const userSigGenerator = new LibGenerateTestUserSig(sdkAppId, secretKey, 604800);
      const inviteUserSig = userSigGenerator.genTestUserSig(inviteUserId);

ok! , 关键代码就是这些


测试反馈及问题解决


1.推拉流问题

Web 端 SDK 日志中报错 NotFoundError、NotAllowedError、NotReadableError、OverConstrainedError 以及 AbortError 分别是什么意思?

错误名 描述 处理建议
NotFoundError 找不到满足请求参数的媒体类型(包括音频、视频、屏幕分享)。 例如:PC 没有摄像头,但是请求浏览器获取视频流,则会报此错误。 建议在通话开始前引导用户检查通话所需的摄像头或麦克风等设备,若没有摄像头且需要进行语音通话,可在 TRTC.createStream({ audio: true, video: false }) 指明仅采集麦克风。
NotAllowedError 用户拒绝了当前的浏览器实例的访问音频、视频、屏幕分享请求。 提示用户不授权摄像头/麦克风访问将无法进行音视频通话。
NotReadableError 用户已授权使用相应的设备,但由于操作系统上某个硬件、浏览器或者网页层面发生的错误导致设备无法被访问。 根据浏览器的报错信息处理,并提示用户“暂时无法访问摄像头/麦克风,请确保当前没有其他应用请求访问摄像头/麦克风,并重试”。
OverConstrainedError cameraId/microphoneId 参数的值无效。 确保 cameraId/microphoneId 传值正确且有效。
AbortError 由于某些未知原因导致设备无法被使用。

2.播放问题

音视频互通过程中出现有画面没有声音问题?

因浏览器自动播放策略限制,音频播放会出现 PLAY_NOT_ALLOWED 异常,此时业务层需要引 导用户手动操作 Stream.resume() 来恢复音频播放,自动播放受限处理建议 。

未知异常导致,请通过监控仪表盘查询收发两端的 audioLevel & audioEnergy。

运行 Web 端 SDK 时,出现错误:“RtcError: no valid ice candidate found”该如何处理?

出现该错误说明 TRTC Web SDK 在建立媒体传输通道时失败,请检查防火墙配置。


总结


对接起来还是有一定的难度, 自定义开发的话,缺少必要的文档, 需要自己多查查相关文献,

针对线上会议,或者多人会议的情况,有是会出现NotReadableError 错误 , 不过疫情当下,能够推出这个sdk还是很牛的 ,希望后期官方可以完善一下api文档,

相关文章
|
人工智能 监控 安全
什么是网络即服务 (NaaS)?
我们经常听到云计算领域中有IaaS(基础设施即服务)、PaaS(平台即服务)、SaaS(软件即服务),但是你知道吗?在网络领域也有一种术语叫做NaaS(网络即服务),本文瑞哥就带大家揭开NaaS的神秘面纱,让我们直接开始!
3906 0
什么是网络即服务 (NaaS)?
|
移动开发 小程序 前端开发
uniapp开发小程序H5页面顶部导航栏navigationBar如何隐藏?三种解决办法
uniapp开发小程序H5页面顶部导航栏navigationBar如何隐藏?三种解决办法
|
存储 easyexcel Java
阿里easyexcel解析百万级大数据量的Excel表格,看这一篇文章就够了
阿里easyexcel解析百万级大数据量的Excel表格,看这一篇文章就够了
阿里easyexcel解析百万级大数据量的Excel表格,看这一篇文章就够了
|
数据采集 人工智能 运维
上阿里云百炼用Qwen3搞定MCP Agent,有机会瓜分1亿tokens
Qwen3 Agent有奖征文活动正式启动,使用Qwen3+MCP Server搭建Agent,即有机会瓜分1亿Tokens及30个限定周边大奖!活动时间为2025年5月6日至5月30日,提交形式包括技术文档、故事感悟、演示视频等。欢迎扫码报名,发挥创意,赢取丰厚奖励!
1031 0
|
6月前
|
自然语言处理 测试技术 决策智能
让RAG更聪明,ViDoRAG开启视觉文档检索增强生成新范式,上阿里云百炼可直接体验
视觉丰富文档的高效检索与生成是自然语言处理领域的重大挑战。ViDoRAG(Visual Document Retrieval-Augmented Generation via Dynamic Iterative Reasoning Agents)由阿里巴巴通义实验室、中国科学技术大学和上海交通大学联合提出,通过多智能体框架和动态迭代推理机制解决此问题。其核心包括多模态混合检索策略和多智能体生成流程,同时发布的ViDoSeek数据集,专为大规模文档集合设计,提供复杂推理与精准问答的评估基准。实验表明,ViDoRAG在准确率和效率上优于传统方法,未来将优化系统性能并降低计算成本。
804 63
|
3月前
|
人工智能 数据可视化 物联网
物流轨迹订阅查询API调用全流程
本文介绍了物流轨迹订阅查询 API 从传统物流到智慧物流的转型价值与应用。该接口支持主流快递公司,通过标准化数据格式返回物流状态与详细路径信息,助力物流可视化、智能调度和精准客服。核心功能包括基于快递单号查询物流状态与轨迹,提供如快递公司、运单号、签收状态等关键信息。同时,文章还提供了调用流程及 Python 示例代码,便于开发者集成使用。未来,随着 AI 和物联网技术的发展,物流轨迹查询将向智慧物流生态演进,进一步提升行业效率与用户体验。
368 0
|
7月前
|
人工智能 编解码 语音技术
SpeechGPT 2.0:复旦大学开源端到端 AI 实时语音交互模型,实现 200ms 以内延迟的实时交互
SpeechGPT 2.0 是复旦大学 OpenMOSS 团队推出的端到端实时语音交互模型,具备拟人口语化表达、低延迟响应和多情感控制等功能。
1606 21
SpeechGPT 2.0:复旦大学开源端到端 AI 实时语音交互模型,实现 200ms 以内延迟的实时交互
|
9月前
|
自然语言处理 语音技术 开发工具
CosyVoice再升级,可扩展流式语音合成
通义实验室在前期的工作中提出了基于监督离散语音标记的多语言语音合成模型CosyVoice。通过使用两种流行的生成模型:语言模型 (LM) 和流匹配进行渐进式语义解码,CosyVoice 在语音语境学习中实现了较高的韵律自然度、内容一致性和说话人相似性。
1603 1
CosyVoice再升级,可扩展流式语音合成
|
运维 监控 Python
自动化运维:使用Python脚本实现系统监控
【8月更文挑战第31天】 在现代IT运维管理中,自动化已成为提高效率和准确性的关键。本文将通过一个Python脚本示例,展示如何实现对服务器的自动监控,包括CPU使用率、内存占用以及磁盘空间的实时监测。这不仅帮助运维人员快速定位问题,也减轻了日常监控工作的负担。文章以通俗易懂的语言,逐步引导读者理解并实践自动化监控的设置过程。
|
编解码 JavaScript
Vue Camera组件的使用方法
Vue Camera组件的使用方法
450 0

热门文章

最新文章