WebRTC基础实践 - 10. 总结

我们创建了一个视频聊天的APP, 同时支持传输文件以及其他数据! 内容回顾 在本教程中, 我们学习了以下内容: 获取webcam摄像头的视频内容。 通过 RTCPeerConnection 传输视频。 通过 RTCPeerConnection 传输数据。 配置信令服务来交换消息。 集成对等连接和...

2018-12-16 21:30:59

阅读数 346

评论数 0

WebRTC基础实践 - 9. 拍照并传给对方

本节内容 在本节课程中, 我们将学习以下内容: 拍照并通过canvas元素获取图像数据。 给对面发送图片。 本节的完整版代码位于 step-06 文件夹中。 工作原理 前面的小节中, 我们使用 RTCDataChannel 来传递文本消息。 本节课程, 将学习如何发送文件: 下面的示例发送的是...

2018-12-16 21:29:12

阅读数 624

评论数 0

WebRTC基础实践 - 8. 集成对等通信和信令服务

本节内容 在本节课程中, 我们将学习以下内容: 在Node.js平台, 通过Socket.IO来启动信令服务。 用信令服务交换WebRTC客户端之间的元数据(metadata)。 本节的完整版代码位于 step-05 文件夹中。 更新HTML和JavaScript代码 更新 index.htm...

2018-12-14 11:01:45

阅读数 440

评论数 0

WebRTC基础实践 - 7. 配置信令服务

本节内容 在本节课程中, 我们将学习以下内容: 通过 npm 安装 package.json 文件中指定的项目依赖 运行Node.js服务器, 通过 node-static 提供静态文件服务。 用Socket.IO创建消息传递服务 创建聊天室以及发送聊天消息。 本节的完整版代码位于 step-...

2018-11-28 16:43:55

阅读数 776

评论数 0

WebRTC基础实践 - 6. 通过RTCDataChannel传输数据

本节内容 WebRTC客户端(peers)之间如何传递数据。 本节的完整版代码位于 step-03 文件夹中。 修改HTML代码 在本示例中, 使用WebRTC的数据通道(data channel), 将一个 textarea 的内容, 传递给同页面中的另一个textarea。这个demo本身...

2018-11-20 19:16:38

阅读数 1479

评论数 0

WebRTC基础实践 - 5.通过RTCPeerConnection传输流媒体视频

本节内容 在本节课程中, 我们将学习以下内容: 使用WebRTC兼容库: adapter.js, 来抹平各浏览器间的差异。 通过 RTCPeerConnection API 传输流媒体视频。 控制 media 的捕捉和传输。 本节的完整版代码位于 step-02 文件夹中。 RTCPeerCo...

2018-11-13 19:36:51

阅读数 2867

评论数 0

WebRTC基础实践 - 4. 获取摄像头的视频流

本节内容 在本节课程中, 我们将学习以下知识点: 从摄像头(webcam)获取视频流(video stream) 控制视频内容的回显 通过CSS和SVG处理视频内容。 本节的完整版代码位于 step-01 文件夹中。 HTML代码 在 work 目录下的 index.html 文件中, 增加 ...

2018-11-12 19:50:09

阅读数 2480

评论数 1

WebRTC基础实践 - 3. 获取示例代码

下载示例代码 如果安装有git工具, 直接用下面的脚本, 从GitHub克隆代码即可: git clone https://github.com/googlecodelabs/webrtc-web.git 或者, 点击链接下载 zip 压缩包: https://github.com/googl...

2018-11-09 15:40:36

阅读数 659

评论数 0

WebRTC基础实践 - 2. WebRTC课程概述

本课程将逐步开发一个 WebRTC 应用, 通过网络摄像头来拍照、录像、并将这些信息传递给另一方. 在此过程中, 我们将学习如何使用WebRTC的核心API, 还会通过 Node.js 来搭建一个消息服务器。 课程内容 从摄像头获取视频 通过 RTCPeerConnection 传输视频流 通过...

2018-10-15 18:08:57

阅读数 601

评论数 0

WebRTC基础实践 - 1. WebRTC简介

WebRTC 是一个开源的实时通信项目, 主要目标是对Web/原生App平台上的语音、视频、以及数据传输等实时通讯提供支持。 WebRTC 主要包括以下 JavaScript API(点击链接可查看相关demo)。 getUserMedia(): 获取用户设备的音频和视频. MediaRecor...

2018-10-14 11:17:27

阅读数 1300

评论数 1

提示
确定要删除当前文章?
取消 删除