带有 WebRTC SDK 的 Kinesis Video Streams 适用于网络应用程序 JavaScript - Kinesis Video Streams
将 SDK 安装在 JavaScriptWebRTC 软件开发工具 JavaScript 包文档使用 WebRTC 测试页面编辑 WebRTC 测试页面
Amazon Web Services 文档中描述的 Amazon Web Services 服务或功能可能因区域而异。要查看适用于中国区域的差异，请参阅 中国的 Amazon Web Services 服务入门 (PDF)。

本文属于机器翻译版本。若本译文内容与英语原文存在差异，则一律以英文原文为准。

带有 WebRTC SDK 的 Kinesis Video Streams 适用于网络应用程序 JavaScript

你可以在网络应用程序中找到带有 WebRTC SDK JavaScript 的 Kinesis Video Streams 及其相应的示例。GitHub

安装带有 WebRTC SDK 的 Kinesis Video Streams JavaScript

是否以及如何安装带有 WebRTC SDK 的 Kinesis Video Streams 取决于代码是在模块 JavaScript 中执行还是浏览器脚本执行Node.js。

NodeJS module

在 Node.js 中安装带有 WebRTC SDK JavaScript 的 Kinesis Video Streams 的首选方法是使用 Node.js 包管理器 npm。

该软件包托管在 https://www.npmjs.com/package/ amazon-kinesis-video-streams-w ebrtc。

要在Node.js项目中安装此 SDK，请使用终端导航到与项目相同的目录package.json：

键入以下内容：

npm install amazon-kinesis-video-streams-webrtc

你可以像典型的 Node.js 模块一样导入 SDK 类：

// JavaScript
const SignalingClient = require('amazon-kinesis-video-streams-webrtc').SignalingClient;
// TypeScript
import { SignalingClient } from 'amazon-kinesis-video-streams-webrtc';
Browser

您无需安装开发工具包以在浏览器脚本中使用它。您可以在 HTML 页面中 Amazon 使用脚本直接加载托管 SDK 包。

要在浏览器中使用 SDK，请在您的 HTML 页面中添加以下脚本元素：

<script src="https://unpkg.com/amazon-kinesis-video-streams-webrtc/dist/kvs-webrtc.min.js"></script>

页面中加载开发工具包之后，可从全局变量 KVSWebRTC（或 window.KVSWebRTC）使用开发工具包。

例如，window.KVSWebRTC.SignalingClient。

带有 WebR JavaScript TC 的 Kinesis Video Streams SDK 文档

SDK 方法的文档位于 GitHub 自述文件的 “文档” 下。

在 “用法” 部分中，提供了有关将此 SDK 与用于构建基于 Web 的 JavaScript 查看器应用程序的 Amazon SDK 集成的更多信息。

有关完整应用程序（包括主角色和查看者角色）的示例，请参阅examples目录。

使用 Kinesis Video Streams with WebRTC 测试页面

带有 WebRTC 的 Kinesis Video Streams 还托管一个测试页面，您可以使用该页面创建新的信令通道或连接到现有频道并将其用作主频道或查看器。

带有 WebRTC 的 Kinesis Video Streams 测试页面位于 https://awslabs.github.io/-/examples/index.html。amazon-kinesis-video-streams webrtc-sdk-js

测试页的代码位于examples目录中。

从测试页面流式传输到 Amazon Web Services Management Console

  1. 打开 Kinesis Video Streams with WebRTC 测试页面，然后完成以下操作：

    • Amazon Web Services 区域。 例如，us-west-2。

    • 您的 IAM 用户或角色的 Amazon 访问密钥和密钥。如果您使用的是长期 Amazon 证书，请将会话令牌留空。

    • 要连接的信令通道的名称。

      如果要连接到新的信令信道，请选择 C reate Channel 以使用框中提供的值创建一个信令信道。

      注意

      对于当前账户和地区，您的信令频道名称必须是唯一的。您可以使用字母、数字、下划线 (_) 和连字符 (-)，但不能使用空格。

    • 是发送音频、视频还是两者。

    • 移民局候选人一代。保留STUN/TURN选中状态并保持Trickle ICE启用状态。

  2. 选择 Start Master 以连接到信令信道。

    如有必要，允许访问您的摄像头和/或麦克风。

  3. 在中打开 Kinesis Video Stream s 控制台。 Amazon Web Services Management Console

    确保选择了正确的区域。

  4. 在左侧导航栏中，选择信令频道。

    在上面选择信令通道的名称。如果需要，请使用搜索栏。

  5. 展开 “媒体播放查看器” 部分。

  6. 选择视频播放器上的播放按钮。这作为一个人加入了WebRTC会话。viewer

    在演示页面上发送的媒体应显示在 Amazon Web Services Management Console。

从测试页面流式传输到测试页面

  1. 打开 Kinesis Video Streams with WebRTC 测试页面并填写以下信息：

    • Amazon Web Services 区域。 例如，us-west-2。

    • 您的 IAM 用户或角色的 Amazon 访问密钥和密钥。如果您使用的是长期 Amazon 证书，请将会话令牌留空。

    • 要连接的信令通道的名称。

      如果要连接到新的信令信道，请选择 C reate Channel 以使用框中提供的值创建一个信令信道。

      注意

      对于当前账户和地区，您的信令频道名称必须是唯一的。您可以使用字母、数字、下划线 (_) 和连字符 (-)，但不能使用空格。

    • 是发送音频、视频还是两者。

    • 移民局候选人一代。保留STUN/TURN选中状态并保持Trickle ICE启用状态。

  2. 选择 Start Master 以master角色身份连接到信令通道。

    如有必要，允许访问您的摄像头和/或麦克风。

  3. 打开另一个浏览器选项卡，然后打开 Kinesis Video Streams with WebRTC 测试页面。上一次运行的所有信息都应加载完毕。

  4. 向下滚动并选择 “启动查看器”，以viewer角色身份连接到信令频道。

    您应该会看到master和之间正在交换媒体viewer。

使用 WebRTC 编辑 Kinesis Video Streams 测试页面

要出于开发目的编辑 SDK 和测试页面，请按照以下说明进行操作。

先决条件

NodeJS 版本 16+

注意

我们建议从 https://nodejs.org/en/download 下载最新的长期支持 (LTS) 版本。

编辑测试页面

  1. 下载带有 WebRTC SDK 的 Kinesis Video Streams。 JavaScript

    在终端中键入以下内容：

    git clone https://github.com/awslabs/amazon-kinesis-video-streams-webrtc-sdk-js.git

  2. 导航到包含 package.json 文件的目录。该文件位于存储库的根目录中。

    在终端中键入以下内容：

    cd amazon-kinesis-video-streams-webrtc-sdk-js

  3. 安装依赖项。

    在终端中键入以下 npm CLI 命令：

    npm install

  4. 启动 Web 服务器以开始提供网页。

    在终端中键入以下 npm CLI 命令：

    npm run develop

  5. 在你的浏览器中，访问 http://localhost:3001/。

    您可以通过编辑examples目录中的文件来编辑网页。