![](https://img-blog.csdnimg.cn/20201014180756926.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
WebRTC入门与实战
OH,CGWLMXUP
这个作者很懒,什么都没留下…
展开
-
WebRTC入门与实战 --- WebRTC网络传输基本知识---TURN
TURN介绍目的是解决对称NAT无法穿越的问题,遇到对称型等无法穿越时将数据传给TURN服务,由TURN服务中介转给其他接收者,或者其他接收者发送数据给TURN服务,转送给client端 建立在STUN之上,消息格式使用STUN格式消息,协议头和body基本一样,外壳形式一样内容有所不同 TRUN Client要去服务端分配一个公共IP和Port用于接收或发送数据 ...原创 2019-11-16 19:47:56 · 436 阅读 · 0 评论 -
WebRTC入门与实战 --- WebRTC网络传输基本知识---STUN
STUN介绍STUN存在的目的就是进行NAT穿越 STUN是典型的客户端/服务器模式。客户端发送请求,服务端进行响应RFC STUN规范RFC3489/STUN Simple Traversal of UDP Through NAT 通过UDP进行穿越 RFC5389/STUN Session Traversal Utilities for NAT 一系列穿越N...原创 2019-11-16 11:56:45 · 422 阅读 · 0 评论 -
WebRTC入门与实战 --- WebRTC网络传输基本知识---NAT
在介绍这些基本知识之前我们要清楚WebRTC的目的以及根本要解决的问题是什么。WebRTC首要要解决的问题是两个浏览器之间如何进行音视频的实时互动,对于底层来说就是两个端点之间如何进行高效的网络传输。 NAT(Network Address Translator) 网络上的主机要有一个公网的地址才能进行通讯,现实中我们大部分主机都是在网关之后的,实际是有一个映射,在网关上有一...原创 2019-11-16 11:33:40 · 737 阅读 · 0 评论 -
WebRTC入门与实战 --- WebRTC信令服务器原理
先来看下信令服务器的作用: 如果没有信令服务器webrtc之间是无法通信的,从图可以看出,发起端和接收端之间想要传递数据是必须要经过信令服务器的,这两个信息是什么呢,第一个就是媒体信息通过SDP协议描述,例如双方通信的编解码器、是否支持音视频等通过信令服务器中转传递。第二个需要传递的信息是网络信息 ,通过服务器传到对端,对端拿到信息后才能知道双方是否在同一个局域网,不在同一个网...原创 2019-11-10 22:37:44 · 1214 阅读 · 0 评论 -
WebRTC入门与实战 --- Socket.io发送消息
服务端消息发送 给本次链接自己发送消息 socket.emit() 给某个房间内所有人发消息 io.in(room).emit() 除本连接自己之外,给某个房间内所有人发消息 socket.to(room).emit() 除本连接外,给所有人发消息 socket.broadcast.emit() 客户端处理消息 发送action命令 S:so...原创 2019-11-10 22:16:39 · 567 阅读 · 0 评论 -
WebRTC入门与实战 --- WebRTC音视频录制
首先 介绍一个重要的额类,MediaRecoder:使用案例:开始录制:获取桌面:原创 2019-11-10 21:51:31 · 735 阅读 · 0 评论 -
WebRTC入门与实战 --- WebRTC音视频采集
我们来学习下WebRTC中对音视频数据的采集。音视频采集API这里我们可以看到MediaStreamConstratints的两个参数的类型有两种:当时用boolean时,标识是否对音频、视频进行采集,如果使用MediaTrackContraints就可以分别对音视频的具体参数进行设置,比如视频的分辨率、帧率等,同样的音频也可以设置延迟性、音量、声道等等,后边的学习会详细研述。如下图一...原创 2019-11-10 12:07:29 · 1162 阅读 · 0 评论 -
WebRTC入门与实战 --- WebRTC获取音视频设备
前边我们做了很多必要的准备工作,包括音视频相关基础内容、环境准备、JavaScript等,接下来正式开始学习WebRTC的内容,首先我们来学习下WebRTC如何来进行设备管理。获取所有音视频设备这里介绍一个API,enumerateDevices:音频同一个设备中包含了两种类型,一种是输入一种是输出。JavaScript中的Promise 首先,JavaScri...原创 2019-11-08 15:12:34 · 679 阅读 · 0 评论 -
WebRTC入门与实战 --- JavaScript基础知识回顾与代码调试
以前的JavaScript调试非常困难,我们一般都是通过打印信息弹窗进行提示,如今Chrome推出的JavaScript调试工具developtools,可以非常方便的调试JavaScript,下边简单介绍下调试相关:Elenents:页面中的元素Console:便于调试,比如修改代码变量值达到不同的目的等Source:重点,从服务端获取的JavaScript或者页面都...原创 2019-11-08 09:57:30 · 376 阅读 · 0 评论 -
WebRTC入门与实战 --- Web服务器
Web服务器选型Nodejs Nginx ApacheWeb服务工作原理Nodejs工作原理JavaScript解析Nodejs时间处理原创 2019-11-07 18:49:32 · 309 阅读 · 0 评论 -
WebRTC入门与实战 --- WebRTC运行机制
我们来学习写WebRTC的运行机制。首先来看两个基本概念,轨与流:轨与流:Track(轨):采取了轨道的概念,两条轨之间是不想交的,就像我们的一路音频和一路视频都是一路轨,两者是不想交的,两路音频也是不想交的两个轨。 MediaStream:就是媒体流,包含了很多轨。几个重要的类:MediaStream:媒体流RTCPeerConnection:WebRTC中最为重要的一个...原创 2019-11-07 17:05:02 · 897 阅读 · 0 评论 -
WebRTC入门与实战 --- 源码目录结构
介绍下WebRTC源码的目录结构,和各个模块的作用,方便我们应用中进行使用和一些个性化修改:下边看一下核心模块Modules:原创 2019-11-07 14:23:51 · 366 阅读 · 0 评论 -
WebRTC入门与实战 --- WebRTC原理与架构
上一篇我们对WebRTC进行了整体的介绍和学习,作为技术人员,我们学习过程中是要了解一个技术的原理的,接下来我们就来学习一下WebRTC的原理与架构,下边是官网的架构图: 架构图颜色标识说明:(1)应用层:紫色部分是Web开发者API层;(2)核心层:蓝色实线部分是面向浏览器厂商的API层(也就是红色框标内模块,也是本人专注研...原创 2019-11-07 10:36:39 · 2132 阅读 · 0 评论 -
WebRTC入门与实战 --- WebRTC概述
今天开始来系统完整地学习WebRTC相关技术,WebRTC的重要性和以后的趋势这里我就不说了,相信来看这个系列博客的伙伴可定是了解这个技术的地位和需求才会来看。这里主要知识来源于李超老师的课程以及网上一些优秀的技术博客等,在此留下详细的学习记录,方便后续学习和回顾,也欢迎感兴趣的伙伴参考。WebRTC概述WebRTC的相关介绍很多地方都有(详细可以参考:https://baike.baid...原创 2019-11-07 09:52:22 · 1085 阅读 · 0 评论