webrtc
文章平均质量分 79
anyRTC
这个作者很懒,什么都没留下…
展开
-
技术分享| WebRTC之SDP详解
SDP(Session Description Protocol) 是一种会话描述协议,基于文本,其本身并不属于传输协议,需要依赖其它的传输协议(比如 SIP, HTTP,自定义的信令等)来交换必要的媒体信息,用于两个会话实体之间的媒体协商,同时SDP也不是只为WebRTC使用,其他的传输比如RTSP,SIP通话也是通过SDP进行媒体协商。原创 2023-08-18 16:49:42 · 688 阅读 · 0 评论 -
技术分享| 音视频与微信小程序互通实践
随着网络架构的变迁、媒体技术发展、音视频场景迭代,基于流媒体的技术也是推陈出新。WebRTC渐渐的成为了音视频互动场景的主流,而微信在6.5.21版本通过小程序开放了实时音视频能力,开发者们可以使用组件 < live-pusher > 实现基于 RTMP 的直播推流(录制),用于实时音视频通话上行,使用组件 < live-player > 实现基于 RTMP 的直播拉流(播放)。可以看出,微信小程序的音视频是基于 RTMP 协议的,但是微信小程序的音视频只是提供了终端上的能力,并没有实现媒体服务器,腾讯给出原创 2022-12-06 11:49:14 · 1469 阅读 · 0 评论 -
技术分享| anyRTC 8月更新迭代
8月更新迭代,新增视频水印功能,有效保护企业版权;此外还添加了抓拍图片功能;同时对音视频模块,实时消息模块等多项功能进行了优化改进。原创 2022-08-24 10:18:08 · 172 阅读 · 0 评论 -
web技术支持| 从视频元素流式传输到视频元素
HTMLsrc 与 source的区别source标签可以写多个,并指定type ,兼容不同浏览器解码支持。但src只能写一个source标签的type属性的属性值有video/ogg,video/mp4,video/webm<video id="leftVideo" controls loop muted> <source src="./xxx.mp4" type="video/mp4"/></video><video id="rightV原创 2022-05-10 10:49:12 · 471 阅读 · 0 评论 -
web技术支持| 简单实现Vue第一章:模板编译
创建vue构造函数function Vue(option) { this.$option = option;}挂载方法Vue.prototype.$mount = function(element) { const rootNode = document.getElementById(element); if (rootNode) { this.$rootNode = rootNode; } else { throw new Erro原创 2022-04-14 11:58:31 · 2514 阅读 · 0 评论 -
web技术分享| WebRTC控制摄像机平移、倾斜和缩放
MediaDevices.getUserMedia() 会提示用户给予使用媒体输入的许可,媒体输入会产生一个MediaStream,里面包含了请求的媒体类型的轨道。此流可以包含一个视频轨道(来自硬件或者虚拟视频源,比如相机、视频采集设备和屏幕共享服务等等)、一个音频轨道(同样来自硬件或虚拟音频源,比如麦克风、A/D转换器等等),也可能是其它轨道类型。它返回一个 Promise 对象,成功后会resolve回调一个 MediaStream 对象。若用户拒绝了使用权限,或者需要的媒体源不可用,promise会原创 2022-03-10 11:35:44 · 1145 阅读 · 2 评论 -
uni-app技术分享| uni-app常见问题(一)
1. 运行无法使用插件查看控制台提示是否存在以下提示, 请根据控制台提示操作[JS Framework] 当前运行的基座不包含原生插件[AR-RtcModule],请在manifest中配置该插件,重新制作包括该原生插件的自定义运行基座使用的是 标准运行基座需要制作自定义运行基座运行时选择自定义基座运行(HBuilder 默认标准运行基座)插件仅支持 APP;2.场景使用音视频通话相关插件地址: anyRTC音视频SDK插件文档地址: uniapp RTC API原创 2022-02-24 10:50:11 · 901 阅读 · 0 评论 -
web技术分享| WebRTC记录音视频流
监听开始事件EventTarget.addEventListener() 方法将指定的监听器注册到 EventTarget 上,当该对象触发指定的事件时,指定的回调函数就会被执行。 事件目标可以是一个文档上的元素 Element,Document和Window或者任何其他支持事件的对象 (比如 XMLHttpRequest)。addEventListener()的工作原理是将实现EventListener的函数或对象添加到调用它的EventTarget上的指定事件类型的事件侦听器列表中。d原创 2022-02-17 09:54:33 · 1058 阅读 · 0 评论 -
Android技术分享| Android WebRTC 对 AudioRecord 的使用
AudioRecord 是 Android 基于原始PCM音频数据录制的类,WebRCT 对其封装的代码位置位于org/webrtc/audio/WebRtcAudioRecord.java,接下来我们学习一下 AudioRecord 是如何创建启动,读取音频采集数据以及销毁等功能的。创建和初始化 private int initRecording(int sampleRate, int channels) { Logging.d(TAG, "initRecording(sampleRate=原创 2022-01-12 12:08:59 · 2843 阅读 · 0 评论 -
web技术分享| css filter和getUserMedia的联合使用
设置CSS3 filter(滤镜) 属性filter 属性定义了元素(通常是)的可视效果(例如:模糊与饱和度)。blur(px) 给图像设置高斯模糊。"radius"一值设定高斯函数的标准差,或者是屏幕上以多少像素融在一起, 所以值越大越模糊;grayscale(%) 将图像转换为灰度图像。值定义转换的比例。值为100%则完全转为灰度图像,值为0%图像无变化。值在0%到100%之间,则是效果的线性乘子。若未设置,值默认是0;invert(%) 反转输入图像。值定义转换的比例。100%原创 2022-01-04 16:52:37 · 910 阅读 · 0 评论 -
行业分析| 实时音视频的未来
实时音视频英文全称Real-TimeCommunication,简称RTC,是一种终端服务,为行业提供高并发、低延时、高清流畅、安全可靠的全场景、全互动的音视频服务。随着移动互联网的普及和智能终端设备的广泛应用,实时音视频正逐渐成为主流互动方式。已在在线教育、社交娱乐、互动电商等热门领域得到广泛应用,也赋能于更多创新场景,如金融、政企服务、loT、医疗等,帮助人们享受更便捷和更人性化的生活服务。在过去的十年间,不仅有腾讯云、阿里云、网易云信等巨头厂商还有声网agora、百家云、微吼等初创“新秀”也纷原创 2021-12-29 10:41:19 · 5025 阅读 · 0 评论 -
Android技术分享| 【自习室】自定义View代替通知动画(完)
在之前的文章中我们实现了自定义View需要的基本功能,本篇中我们通过 Timer 实现动画功能。我偷偷修改了一些数据结构,一会在下面贴出来。最终效果图:动画是通过 Timer 每17毫秒调用 View#post 来调用主线程更新一帧。定义一个 interpolator 使动画效果更自然(逐渐减速的效果)。首先定义一个存储执行动画相关的数据结构:private data class AnimInfo( val block: (percentage: Float) -> Unit,// 每帧原创 2021-12-16 10:36:59 · 3798 阅读 · 0 评论 -
ios技术分享| iOS 发布 framework 到 Cocoapods 以及常见问题
前言CocoaPods 是一个用来管理 Xcode 依赖库的项目,通过 CocoaPods,我们可以直观集中和自动化地管理我们项目的第三方库。本篇文章讲述如何将 framework 发布到 Cocoapods 以及发布中遇到的常见问题。注册 CocoaPods 的 Trunk 服务执行完以下命令,去邮箱点击 Trunk 验证链接。$ pod trunk register yourEmail 'your name' --verboseexample:pod trunk register原创 2021-12-07 11:31:51 · 661 阅读 · 0 评论 -
web技术分享| AudioContext 实现音频可视化
要实现音频可视化,实现一些炫酷的效果需要借助 Web Audio API提供的一些方法 AudioContext。AudioContext接口表示由链接在一起的音频模块构建的音频处理图,每个模块由一个AudioNode表示。音频上下文控制它包含的节点的创建和音频处理或解码的执行。在做任何其他操作之前,您需要创建一个AudioContext对象,因为所有事情都是在上下文中发生的。建议创建一个AudioContext对象并复用它,而不是每次初始化一个新的AudioContext对象,并且可以对多个不原创 2021-12-02 11:27:43 · 1254 阅读 · 0 评论 -
技术分享| 如何使用FFmpeg命令处理音视频
FFmpeg是领先的多媒体框架,是一个强大的处理音视频的开源库,能够解码、编码、转码、混流、流媒体分离、滤镜和播放几乎所有格式的音视频内容。它既可以使用API对音视频进行处理,也可以使用FFmpeg命令编辑音视频文件。包含用于音频、视频和字幕流的多个解码器和编码器,以及多个位流过滤器。FFmpeg目录及其作用libavutil: 是一个包含用于简化编程的函数工具库,包括随机数生成器、数据结构、数学例程、核心多媒体实用程序等等。libavcodec: 是一个包含用于音频/视频编解码器的库。lib原创 2021-11-18 12:17:54 · 2868 阅读 · 0 评论 -
技术分享| 如何做一款容纳百人的视频会议?
在视频通话或直播场景中,如果多个用户同时发流,由于设备性能消耗和网络流量的上升,可能带来比较大的体验下降,本文就场景层面调用 API 进行讲解,采用 iOS 接口作为示例,其他端在文档中心自行查找。懒人法在多人音视频通信过程中,设备的网络流量会出现间接性的波动(突发流量、网络信号问题),影响通话质量,开发者需要对当前通话的质量指标做统计分析,经过分析结果,自行调用API结果进行问题解决,但业务频繁的进行切换或者API调用不当会导致通话异常等现象。anyRTC 从实际出发,根据内部多个指标对订阅用户的.原创 2021-11-17 12:17:10 · 724 阅读 · 0 评论 -
IOS技术分享| WebRTC iOS源码下载&编译
前言最近对 WebRTC iOS 端源码进行了下载和编译,网上针对 WebRTC iOS 端的编译文章基本都是几年前的,有些地方已经不适用于最新版的 WebRTC 的编译,简单记录下载&编译的过程,以 M93 版本为例。编译环境硬件:MacBook Pro (Retina, 15-inch, Mid 2015)系统:macOS Big Sur 11.5安装 depot_toolsdepot_tools 是一套 Google 用来编译 Chromium 或者 WebRTC 的构建工具,获原创 2021-11-09 12:06:41 · 3776 阅读 · 0 评论 -
web技术分享| WebRTC 实现屏幕共享
前言屏幕共享在工作中是非常实用的功能,比如开会时分享ppt,数据图表等,老师也可以分享自己的屏幕,实现线上教学,那么屏幕共享是如何实现的呢,今天就跟随笔者一起研究一下吧!获取button元素const startButton = document.getElementById('startButton');检测浏览器是否支持mediaDevices 是 Navigator 只读属性,返回一个 MediaDevices 对象,该对象可提供对相机和麦克风等媒体输入设备的连接访问,也包括屏幕共享。原创 2021-11-04 11:40:22 · 2584 阅读 · 1 评论 -
Android技术分享| Android WebRTC 开启H264软件编解码教程
Android WebRTC 软件编解码基于 openH264 和 FFMpeg,但是编译时默认是不开启的,想要开启需要对代码做一定的增加修改,下面我将所有修改步骤一一列出。本文基于webRTC 版本:(https://chromium.googlesource.com/external/webrtc/+/branch-heads/4515)设备:Mac虚拟机:Parallels Desktop + Ubuntu 18.4开始一:修改 rtc_use_h264 返回值路径:webrtc/src原创 2021-11-03 15:08:03 · 3105 阅读 · 4 评论 -
web技术分享| React版本 anyRTC示例对等连接
前言大家好,笔者以往发布过很多关于WebRTC的知识,和很多基于anyRTC WebSDK开发的音视频通讯示例,收获了很多开发人员的一致好评,在以往的示例中笔者是基于Vue框架进行编写,后台有小伙伴私信笔者,希望笔者出一个基于React框架的音视频示例,笔者在收到私信的第一时间就开始着手编写,现在把它发布出来供大家参考。开发准备在开始写代码之前还需要做一些准备工作,如果你之前没有使用过 anyRTC Web SDK 这里还需要花几分钟时间准备一下, 详见:开发前期准备创建React程序全局安装原创 2021-10-26 13:25:36 · 317 阅读 · 0 评论 -
技术分析| WebRTC开源服务器商业化过程中遇到的问题及挑战
WebRTC及其发展前景WebRTC,名称源自网页即时通信(Web Real-Time Communication)的缩写,是一个支持网页浏览器进行实时语音通话或视频通话的API,旨在建立一个互联网浏览器间的实时通信的平台。它于2011年6月1日开源并在Google、Mozilla、Opera支持下被纳入万维网联盟的W3C推荐标准。WebRTC官网的介绍如下:WebRTC是一个免费的开源项目,它通过简单的API为浏览器和移动应用程序提供实时通信(RTC)功能。WebRTC虽然冠以“web”之名,但并原创 2021-10-21 10:36:38 · 867 阅读 · 0 评论 -
技术分享| 音视频多频道使用的正确姿势
为方便用户同时加入多个频道,接收多个频道的音视频流,anyRTC 从底层架构给予支持多频道管理,且频道数量无限制,跟随我一起探讨多频道的奥秘吧~在跟踪客户需求时,总能听到客户说单个频道支持的人数太少了;我想加入一个频道后不退出的情况下,加入其他频道听取下他们的内容;我想同时进多个频道进行监听;我想在大班课上课的同时,给小组分组上课;对讲;分屏监控…这些需求 anyRTC 统统可以满足了~多频道架构方案介绍每个用户可以进入多个频道,且频道数量不限制,但只能在一个频道中发布音视频流,anyRTC 的回原创 2021-10-20 11:51:49 · 308 阅读 · 0 评论 -
Android技术分享| 【自习室】自定义View代替通知动画(1)
在Demo中通过ObjectAimator实现的效果,使用一个View同样可以实现。Demo项目地址:点击这里实现这个自定义View需要解决的问题:重写onMeasure计算自己的大小文本绘制图片加载展示为圆形图片加载涉及到的优化(如大小、缓存)动画效果消息出现消息被顶上去消息关闭本篇文章我们先实现一条消息的基本绘制,也就是前三条(除图片缓存)下一篇文章中再加上动画效果。通知消息基本数据结构由3个部分组成:头像、昵称、状态(进入/退出);为了便于拓展,我们定义一个.原创 2021-10-14 11:20:12 · 180 阅读 · 0 评论 -
uni-app技术分享| 用uni-app实现拖动的诀窍
还在为实现类似于QQ视频通话 那样的视频窗口随意拖动而苦恼吗?福音来了,今天就为大家解决这样的烦恼。前提:使用 anyrtc 基本实现音视频(nvue页面)需求:两人通话时可随意拖动小视频实现原理:uniapp的nvue内置原生插件 BindingX。具体可查看 uniapp 原生插件引入、 BindingX效果展示:项目地址:Call_uniapp具体实现:1. 在实现音视频功能插件提供的视频容器外边包裹一层。如:(使用 anyRTC 音视频插件) <view ref=原创 2021-10-12 12:00:41 · 2339 阅读 · 0 评论 -
技术分析| 音视频服务集群如何实现全球多中心化调度
anyRTC提供全球领先的实时音视频云服务,客户涉及社交娱乐,金融保险,政企,安防等行业,累计帮助全球近千家企业客户获得音视频通讯能力。面对庞大客户音视频的需求,利用多中心化调度的服务架构,扛住了千万级的高并发,做到灵活调度,为广大客户带来优质的音视频体验。在客户请求量和流量暴增的情况下,我们的音视频服务无论何时都能做到零故障弹性的伸缩。我们的流媒体传输使用分层传输,而在这样的传输架构下,多中心化的调度服务的作用至关重要。单中心调度服务面临的问题和挑战:一、网络延时大。比如香港到西欧或者北美,物理距原创 2021-09-24 10:36:56 · 228 阅读 · 0 评论 -
Android技术分享| 一行代码实现安卓屏幕采集编码
越来越多的App需要共享手机屏幕给他人观看,特别是在线教育行业。Android 从5.0开始支持了MediaProjection,利用MediaProjection ,可以实现截屏录屏功能。本库对屏幕采集编码进行了封装,简单的调用即可实现MediaProjection权限申请,H264硬编码,错误处理等功能。特点适配安卓高版本使用 MediaCodec 异步硬编码编码信息可配置通知栏显示链式调用使用ScreenShareKit.init(this) .onH264原创 2021-09-23 11:24:22 · 1445 阅读 · 0 评论 -
web技术分享| webRTC 媒体流录制
音视频的录制音视频的分为服务端录制和客户端录制,下面主要讲的是利用webrtc进行客户端录制的方式。因为WebRTC 录制音视频流之后,最终是通过 Blob 对象将数据保存成多媒体文件的,Blob 对象表示一个不可变、原始数据的类文件对象。它的数据可以按文本或二进制的格式进行读取,也可以转换成 ReadableStream 来用于数据操作。Blob 表示的不一定是JavaScript原生格式的数据。File接口基于Blob,继承了 blob 的功能并将其扩展使其支持用户系统上的文件。要从原创 2021-09-09 10:42:21 · 2334 阅读 · 0 评论 -
web技术分析| 一篇前端图像处理秘籍
在短视频和直播带货霸占了流量铁王座的当下,产品之间的竞争十分激烈,在抖音短视频问世以来,随其后效仿的产品也不计其数。产品要想脱引而出,仅靠画质和流畅度是很难取胜的,不仅要节省流量开支同时还要保证画质的超高清,与其同时还要有丰富的、标新立异的玩法来吸引用户。随着 AI 技术的成熟,场景也变得丰富、多样了起来,比如:修复老电影、换脸特效、2K 升 4k、体育赛事 、特效 app。但是无论产品需求怎么变,最终还是得在图像处理上下功夫,那么今天我们就从简单的图片处理入门,由浅入深的去探索视频处理,接触更多的音视原创 2021-08-24 11:33:37 · 812 阅读 · 0 评论 -
web技术分享| 实现WebRTC多个对等连接
流程简介通过MediaDevices.getUserMedia()获取音频和视频轨道。通过createOffer()启动与远程对等方的新 WebRTC 连接。用信令通信上传错误并控制启动或关闭会话。互换媒体和客户端信息初始化操作元素const startButton = document.getElementById('startButton');const callButton = document.getElementById('callButton');const原创 2021-08-19 10:47:10 · 564 阅读 · 0 评论