来源 | 掘金 作者:Nirvana-cn 排版 | 前端时空 WebRTC (Web Real-Time Communications) WebRTC 是一项「实时通讯技术」，它允许网络应用或者站点...WebRTC包含的这些标准使用户在无需安装任何插件或者第三方的软件的情况下，创建点对点（Peer-to-Peer）的数据分享和电话会议成为可能。...本篇文章从自身实践出发，结合相关代码，总结WebRTC实现的基本流程。 1. 引言 首先我们先看《WebRTC权威指南》上给出的流程图，从这张图，我们要明确两件事： ?.../adapter/adapter-latest.js">脚本 // 提升浏览器兼容性 var localConnection var constraints={ audio:false...object):二进制大对象 ArrayBuffer:确定数组长度的数据类型 ArrayBufferView:基础的数组视图 其中，Blob类型是一个可以存储二进制文件的容器，结合HTML5相关文件读取API
我们来学习一下 Excel js API 开放是如何设计的，从中学习到一些开放 API 设计经验。...已经具备这么多能力，为何还需要 JS API 呢？...一句话概括就是，在 JS API 内可以使用 formula，即 JS API 是公式能力的超集，它包含了对 Excel 工作簿的增删改查、数据的限制、RangeAreas 操作、图表、透视表，甚至可以自定义...JS API 可以用在哪些地方 从 Excel 流程中最开始的工作薄、工作表环节，到最细节的单元格数据校验都可通过 JS API 支持，目前看来 Excel JS API 并没有设置能力边界，而且还会不断完善...在 Excel JS API 之上，还有一个 通用 API，定义为跨应用的通用 API，这样 Excel JS API 就可以把精力聚焦在 Excel 产品本身能力上。
var color3 = color.concat(color2); // concat 是将参数传递进来的数组内容 拼接到调用者后面，不修改原数组
iOS JS与OC交互 本文内容导航 1、`UIWebView` JS 与 OC 交互 1.1 OC 调用 JS 函数 1.1.1 OC 拼接 JS 字符串调用 JS 方法 1.1.2 使用 JSContext...上下文环境调用 JS 函数 1.2 JS 调用 OC 函数 1.2.1 OC 拦截 JS 超链接操作请求 1.2.2 向 JS 中注入 OC 类 1.2.3 使用 JSContext 上下文，JS函数...拦截 JS 超链接请求 2.3.2 OC 接收 JS 发来的消息 3、第三方库实现 OC 与 JS 交互 3.1 `WebViewJavascriptBridge` 库使用 1、UIWebView JS...②使用 JSContext 上下文调用 JS 函数 第一种方法使用相对简单，但复杂业务可能无法实现。 1.1.1 OC 拼接 JS 字符串调用 JS 方法 JS 代码如下： <!...调用 JS 方法，使用block回调JS返回结果。
什么是WebRTC webrtc 是为浏览器之间提供实时数据传输(Web Real-Time Communication)的javascript API 支持 peer-to-peer 音频、视频、数据流传输能力...主要的API getUserMedia : 获取音视频 MediaRecorder: 录制音视频 RTCPeerConnection: 浏览器之间音视频流连接对象 RTCDataChannel: 浏览器数据流连接对象...信令(signaling) 信令是WebRTC用来协助建立p2p通讯的。主要用于协商双方通讯过程，传递基本信息SDP(会话描述协议)。...include_text=1 SDP握手 下图为WebRTC通过信令建立一个SDP握手的过程。只有通过SDP握手，双方才知道对方的信息，这是建立p2p通道的基础。 ?
但是可惜的是，webrtc这块功能缺失，默认使用随机丢包模型。...需要注意，开启FlexFEC需要同时使能 WebRTC-FlexFEC-03/Enabled && WebRTC-FlexFEC-03-Advertised/Enabled 否则会出现死机异常 五、FEC...音视频传输领域的FEC算法有如下几种： 1、webrtc的opus音频使用的是inband FEC和交织编码 2、webrtc的视频ulpfec使用的是异或XOR 3、Reed Solomon算法比较复杂...六、webrtc代码分析 1）使能FEC webrtc默认使能Red+Ulp的FEC。Flex仅在实验阶段，还不能正式使用。...Glossary ULPFEC (Uneven Level Protection Forward Error Correction) – WebRTC Glossary webrtc fec – 明明是悟空
4.3 工具推荐 以下是几个基于 Fullscreen API 实现的 GitHub 仓库： fullPage.js[2]：34.6k⭐，一个基于 Fullscreen API 的全屏滚动库，支持多种效果和自定义配置...screenfull.js[3]：6.8k⭐，一个小巧的 Fullscreen API 库，支持多种浏览器和设备。...BigVideo.js[4]：2.3k⭐，一个基于 Fullscreen API 的视频背景库，支持多种视频格式和配置选项。 ✨ 5....search=Fullscreen [2] fullPage.js: https://github.com/alvarotrigo/fullPage.js [3] screenfull.js: https...://github.com/sindresorhus/screenfull.js [4] BigVideo.js: https://github.com/dfcb/BigVideo.js [5] Fullscreen
Page Visibility API 2. Broadcast Channel API 3. Beacon API 4. Resize Observer API 5....Clipboard API 6. Fetch API 7. Performance API 8....WebSockets API 的实际应用 WebSockets API 在许多实际应用中发挥着重要作用。...ws[3] 19.8K⭐ 一个简单易用的 WebSocket 客户端和服务器库，适用于 Node.js。它提供了基本的 WebSocket 功能，并支持自定义扩展。...# 11 个需要避免的 React 错误用法 # 6 个 Vue3 开发必备的 VSCode 插件 # 3 款非常实用的 Node.js 版本管理工具 # 6 个你必须明白 Vue3 的 ref 和 reactive
Page Visibility API 2. Broadcast Channel API 3. Beacon API 4. Resize Observer API 5....Clipboard API 6. Fetch API 7. Performance API 8. WebStorage API 9. WebSockets API 10....Turf.js[6]：8k⭐，一个用于地理空间分析的 JavaScript 库，提供了许多有用的地理空间函数和算法。.../github.com/openlayers/openlayers [5] Mapbox: https://github.com/mapbox/mapbox-gl-js [6] Turf.js: https...# 11 个需要避免的 React 错误用法 # 6 个 Vue3 开发必备的 VSCode 插件 # 3 款非常实用的 Node.js 版本管理工具 # 6 个你必须明白 Vue3 的 ref 和 reactive
// 监测关键资源的加载时间 const keyResources = [ "https://example.com/css/style.css", "https://example.com/js...Perfume.js[3]：2.8K⭐ 一个小巧而强大的性能度量库，可用于监测页面加载时间、关键资源加载时间和用户交互延迟。...PerformanceNow.js[4]：100⭐ 一个小巧的性能计时库，基于 Performance API 的高分辨率时间戳，提供更准确的性能测量功能。...search=Performance%20API [2] Web Vitals: https://github.com/GoogleChrome/web-vitals [3] Perfume.js: https...://github.com/Zizzamia/perfume.js [4] PerformanceNow.js: https://github.com/myrne/performance-now [5]
❝前期回顾： 1.Page Visibility API 2.Broadcast Channel API ❞ 1....什么是 Beacon API 1.1 概念介绍 Beacon API 是 HTML5 提供的一种新的浏览器 API，可以用于在浏览器后台异步地发送数据，而不影响当前页面的加载和性能。...Beacon API 的使用建议和注意事项 5.1 Beacon API 的使用建议 在使用 Beacon API 时，需要注意以下几点： 数据的大小应该尽量小，以便快速进行发送。...5.2 Beacon API 的注意事项 在使用 Beacon API 时，需要注意以下几点： Beacon API 可能存在兼容性问题，需要进行兼容性处理。...# 11 个需要避免的 React 错误用法 # 6 个 Vue3 开发必备的 VSCode 插件 # 3 款非常实用的 Node.js 版本管理工具 # 6 个你必须明白 Vue3 的 ref 和 reactive
什么是 Clipboard API 1.1 概念介绍 Clipboard API[1] 是一组 JavaScript API，用于在浏览器中操作剪贴板。...如何使用 Clipboard API Clipboard API 包括两个主要的接口：Clipboard 和 DataTransfer。...Clipboard API 的兼容性和优缺点 4.1 Clipboard API 的兼容性 以下是 Clipboard API 的兼容性情况： Chrome: 43+ ✅ Edge: 12+ ✅ Firefox...我们也可以使用一些第三方库，快速实现需求： clipboard.js[3]: 33.1K⭐，一个简单的 JavaScript 库，用于操作剪贴板。...search=Clipboard [3] 「clipboard.js」: https://github.com/zenorocha/clipboard.js/ [4] 「clipboard-polyfill
Page Visibility API 2. Broadcast Channel API 3. Beacon API 4. Resize Observer API 5....Clipboard API ❞ 1. 什么是 Fetch API 1.1 概念介绍 Fetch API[1] 是一种现代的 JavaScript API，用于进行「网络请求」。...isomorphic-fetch[8]: 7k⭐， 提供 Fetch API 兼容性支持的库，适用于浏览器和 Node.js 等环境。 5..../ [13] Fetch API vs Axios: Which Should You Choose: https://blog.bitsrc.io/fetch-api-vs-axios-js-for-making-http-requests...# 11 个需要避免的 React 错误用法 # 6 个 Vue3 开发必备的 VSCode 插件 # 3 款非常实用的 Node.js 版本管理工具 # 6 个你必须明白 Vue3 的 ref 和 reactive
本文作者：IMWeb jaychen 原文出处：IMWeb社区 未经同意，禁止转载 什么是WebRTC webrtc 是为浏览器之间提供实时数据传输(Web Real-Time Communication...)的javascript API 支持 peer-to-peer 音频、视频、数据流传输能力 兼容性 ?...主要的API getUserMedia : 获取音视频 MediaRecorder: 录制音视频 RTCPeerConnection: 浏览器之间音视频流连接对象 RTCDataChannel: 浏览器数据流连接对象...信令(signaling) 信令是WebRTC用来协助建立p2p通讯的。主要用于协商双方通讯过程，传递基本信息SDP(会话描述协议)。...include_text=1 SDP握手 下图为WebRTC通过信令建立一个SDP握手的过程。只有通过SDP握手，双方才知道对方的信息，这是建立p2p通道的基础。 ?
前言 最近一直在研究 WebRTC源码，发现目前网上分析WebRTC源码的资料非常少。...随着Google不断推进WebRTC标准，WebRTC 代码的变化非常大，很多以前的分析文章目前都与最新的代码无法对应上了。...所以，我想在分析WebRTC代码的过程中，将自己的一些分析心得写下来分享给大家，这样即是对自己的一种鞭策，同时也可以帮助那些想入门的同学。...目录结构分析 api WebRTC 接口层。包括 DataChannel, MediaStream, SDP相关的接口。各浏览器都是通过该接口层调用的 WebRTC。...如果使用Native API 做二次开发，需要自己写视频渲染相关的代码。 modules 目录下还包括以下几个子目录： audio_coding : 音频编解码相关代码。
js调用天气API 文档参考链接: 天气API文档 1、首先登陆 天气API进行用户注册 点击右上角进行注册、登录 2、打开API文档如下图 其中appid和appsecret则在天气API...控制器中查看 其中appid和version和appsecret3者为必填选项，例如https://www.tianqiapi.com/api?...这三种参数可填可不填，不填则默认当前所在地址 3、写法 我用的是uni-app的写法，其实都差不多啦 uni.request({ url: "https://www.tianqiapi.com/api
// 初始化OAuth2.0授权 const authenticate = () => { return gapi.aut...
Page Visibility API 2. Broadcast Channel API 3. Beacon API 4. Resize Observer API 5....Clipboard API 6. Fetch API 7. Performance API 8. WebStorage API 9. WebSockets API 10....Vue.Draggable[10]: 18.9k⭐， Vue.js 的拖放组件，提供了易用的拖放功能。...Vue component (Vue.js 2.0) or directive (Vue.js 1.0) allowing drag-and-drop and synchronization with...# 11 个需要避免的 React 错误用法 # 6 个 Vue3 开发必备的 VSCode 插件 # 3 款非常实用的 Node.js 版本管理工具 # 6 个你必须明白 Vue3 的 ref 和 reactive
本文将介绍 Page Visibility API 的概念、使用方法、兼容性和实际应用案例。 什么是 Page Visibility API？...Page Visibility API 是一种浏览器 API，它提供了一种「检测页面是否可见」的方法。...Page Visibility API 的使用场景 Page Visibility API 可以应用于很多场景，比如： 视频播放器 在视频播放期间，可以使用 Page Visibility API 来检测页面是否可见...Page Visibility API 的兼容性 Page Visibility API 并不是所有浏览器都支持，我们需要在使用之前检查浏览器是否支持该 API。...# 11 个需要避免的 React 错误用法 # 6 个 Vue3 开发必备的 VSCode 插件 # 3 款非常实用的 Node.js 版本管理工具 # 6 个你必须明白 Vue3 的 ref 和 reactive
Page Visibility API 2. Broadcast Channel API 3....Beacon API ❞ 什么是 Resize Observer API Resize Observer API[1] 可以帮助我们监听元素尺寸的变化，并在尺寸变化时执行一些操作。...如何使用 Resize Observer API 使用 Resize Observer API 非常简单。接下来我会通过 3 个使用示例带大家熟悉 Resize Observer API。...Resize Observer API 的实际应用 Resize Observer API 可以在很多实际场景中使用。...Resize Observer API 的兼容性 Resize Observer API 是一个比较新的 Web API，目前仅在现代浏览器中得到支持。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM
