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

栏目: Node.js · 发布时间: 5年前

内容简介:在本节课程中, 我们将学习以下内容:本节的完整版代码位于更新

本节内容

在本节课程中, 我们将学习以下内容:

  • 在Node.js平台, 通过Socket.IO来启动信令服务。
  • 用信令服务交换WebRTC客户端之间的元数据(metadata)。

本节的完整版代码位于 step-05 文件夹中。

更新HTML和JavaScript代码

更新 index.html 文件, 内容如下:

<!DOCTYPE html>
<html>

<head>
  <title>Realtime communication with WebRTC</title>
  <link rel="stylesheet" href="/css/main.css" />
</head>

<body>
  <h1>Realtime communication with WebRTC</h1>
  <div id="videos">
    <video id="localVideo" autoplay muted></video>
    <video id="remoteVideo" autoplay></video>
  </div>
  <script src="/socket.io/socket.io.js"></script>
  <script src="https://webrtc.github.io/adapter/adapter-latest.js"></script>
  <script src="js/main.js"></script>
</body>
</html>

step-05/js/main.js 文件复制为 js/main.js

启动Node.js

如果没有执行上一节的操作, 需要在 step-05 目录下, 或者工作目录下, 安装相应的依赖, 命令如下:

npm install

安装完成后, 需要启动 Node.js 服务器, 在 work 目录下执行命令:

node index.js

请确保 index.js 中的内容包含了前一节介绍的 Socket.IO 部分。更多Node.js和Socket.IO的内容, 请参考 7_Set_up_signaling_service.md

服务器启动完成后, 请打开浏览器, 输入地址, 如: http://localhost:8080

然后继续打开第二个标签页/新窗口, 输入地址: http://localhost:8080 。 则页面中会显示两个video元素, 第一个展示 getUserMedia() 获取到的本地视频,第二个则展示 RTCPeerconnection 传输过来的远程视频。

因为程序逻辑简单, 如果刷新或者关闭了客户端标签页, 则需要重启 Node.js 才能继续使用。

相关的日志信息, 可以在浏览器控制台中查看。

练习与实践

  1. 本应用只支持一对一视频。请修改设计方案, 以支持多人使用同一聊天室。
  2. 示例中的房间号硬编码为 cnc 。有什么方法可以使用其他房间号呢?
  3. 用户怎样才能分享他的房间号? 请尝试一种分享房间号的办法。
  4. 尝试改进这个应用。

内容回顾

在本节课程中, 我们学习了:

  • 在Node.js平台, 通过Socket.IO来启动信令服务。
  • 用信令服务交换WebRTC客户端之间的元数据(metadata)。

本节的完整版代码位于 step-05 文件夹中。

  • WebRTC相关的统计和调试信息, 请访问: chrome://webrtc-internals
  • 可以访问 https://test.webrtc.org/ 来检查本地环境, 比如摄像头和麦克风等等。
  • 如果碰到奇怪的缓存问题, 可以尝试以下步骤:
  • 强制刷新浏览器, 比如 CTRL+F5 , 或者按住ctrl键, 并单击刷新按钮。
  • 重启计算机或者浏览器
  • 执行清理npm缓存的命令: npm cache clean

后续内容

下一节, 我们将学习如何拍照, 并发送给另一个客户端。

原文链接: https://codelabs.developers.google.com/codelabs/webrtc-web/#7

翻译人员: 铁锚 - https://blog.csdn.net/renfufei

翻译日期: 2018年08月27日


以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

Java Servlet & JSP Cookbook

Java Servlet & JSP Cookbook

Bruce W. Perry / O'Reilly Media / 2003-12-1 / USD 49.99

With literally hundreds of examples and thousands of lines of code, the Java Servlet and JSP Cookbook yields tips and techniques that any Java web developer who uses JavaServer Pages or servlets will ......一起来看看 《Java Servlet & JSP Cookbook》 这本书的介绍吧!

Base64 编码/解码
Base64 编码/解码

Base64 编码/解码

XML 在线格式化
XML 在线格式化

在线 XML 格式化压缩工具