7月28日 打卡day5
今日学习：WebRTC 从实战到未来！迎接风口，前端必学的技术
1、WebRTC 是一项实时通讯技术，它允许网络应用或者站点，在不借助中间媒介的情况下，建立浏览器之间点对点（Peer-to-Peer）的连接，实现视频流和（或）音频流或者其他任意数据的传输
2、媒体流：可以通过摄像头，麦克风，屏幕共享等方式获取到媒体流，然后通过 WebRTC 技术将媒体流传输到远端实现实时通讯
3、摄像头获取媒体流：通过navigator.mediaDevices.getUserMedia(constraints)这个 api 来获取媒体流
①constraints指定了请求的媒体类型和相对应的参数，用于配置视频流和音频流的信息
②不设置constraints参数，默认就是获取摄像头和麦克风的媒体流
4、屏幕共享：
①getDisplayMedia 获取屏幕共享的媒体流
②MediaRecorder 是用于录制媒体流的 API，可以将媒体流中的数据进行录制，然后将录制的数据保存成一个文件，通过MediaRecorder.isTypeSupported 来判断当前浏览器是否支持所需要的 mimeType
5、虚拟背景：通过 canvas 将背景图画到画布上，然后通过 getImageData 方法拿到图像数据
今日学习：WebRTC 从实战到未来！迎接风口，前端必学的技术
1、WebRTC 是一项实时通讯技术，它允许网络应用或者站点，在不借助中间媒介的情况下，建立浏览器之间点对点（Peer-to-Peer）的连接，实现视频流和（或）音频流或者其他任意数据的传输
2、媒体流：可以通过摄像头，麦克风，屏幕共享等方式获取到媒体流，然后通过 WebRTC 技术将媒体流传输到远端实现实时通讯
3、摄像头获取媒体流：通过navigator.mediaDevices.getUserMedia(constraints)这个 api 来获取媒体流
①constraints指定了请求的媒体类型和相对应的参数，用于配置视频流和音频流的信息
②不设置constraints参数，默认就是获取摄像头和麦克风的媒体流
4、屏幕共享：
①getDisplayMedia 获取屏幕共享的媒体流
②MediaRecorder 是用于录制媒体流的 API，可以将媒体流中的数据进行录制，然后将录制的数据保存成一个文件，通过MediaRecorder.isTypeSupported 来判断当前浏览器是否支持所需要的 mimeType
5、虚拟背景：通过 canvas 将背景图画到画布上，然后通过 getImageData 方法拿到图像数据
展开
评论
点赞
![[微笑]](http://lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/jj_emoji_1.7d9f699.png)
，官方包邮。
~
doc.hutool.cn