Kinesis Video Streams with WebRTC SDK in JavaScript for web applications
You can find the Kinesis Video Streams with WebRTC SDK in JavaScript for web applications and its
corresponding samples in GitHub
Topics
Install the Kinesis Video Streams with WebRTC SDK in JavaScript
Whether and how you install the Kinesis Video Streams with WebRTC SDK in JavaScript depends on whether the
code executes in Node.js
modules or browser scripts.
Kinesis Video Streams with WebRTC JavaScript SDK documentation
The documentation for the SDK methods are on the GitHub readme, under Documentation
In the Usage
See the examples
directory for an example of a complete application, including both a master and viewer role.
Use the Kinesis Video Streams with WebRTC test page
Kinesis Video Streams with WebRTC also hosts a test page that you can use to either create a new signaling channel or connect to an existing channel and use it as a master or viewer.
The Kinesis Video Streams with WebRTC test page is located at https://awslabs.github.io/amazon-kinesis-video-streams-webrtc-sdk-js/examples/index.html
The code for the test page is in the examples
directory.
Topics
Stream from the test page to the AWS Management Console
-
Open the Kinesis Video Streams with WebRTC test page
and complete the following: -
AWS Region. For example,
us-west-2
. -
The AWS access key and the secret key for your IAM user or role. Leave the session token blank if you are using long-term AWS credentials.
-
The name of the signaling channel to which you want to connect.
If you want to connect to a new signaling channel, choose Create Channel to create a signaling channel with the value provided in the box.
Note
Your signaling channel name must be unique for the current account and region. You can use letters, numbers, underscores (_), and hyphens (-), but not spaces.
-
Whether you want to send audio, video, or both.
-
ICE candidate generation. Leave
STUN
/TURN
selected and leaveTrickle ICE
enabled.
-
-
Choose Start Master to connect to the signaling channel.
Allow access to your camera and/or microphone, if needed.
Open the Kinesis Video Streams console
in the AWS Management Console. Make sure the correct region is selected.
In the left navigation, select signaling channels
. Select the name of the signaling channel above. Use the search bar, if needed.
Expand the Media playback viewer section.
Choose the play button on the video player. This joins the WebRTC session as a
viewer
.The media that is being sent on the demo page should display in the AWS Management Console.
Stream from the test page to the test page
-
Open the Kinesis Video Streams with WebRTC test page
and complete the following information: -
AWS Region. For example,
us-west-2
. -
The AWS access key and the secret key for your IAM user or role. Leave the session token blank if you are using long-term AWS credentials.
-
The name of the signaling channel to which you want to connect.
If you want to connect to a new signaling channel, choose Create Channel to create a signaling channel with the value provided in the box.
Note
Your signaling channel name must be unique for the current account and region. You can use letters, numbers, underscores (_), and hyphens (-), but not spaces.
-
Whether you want to send audio, video, or both.
-
ICE candidate generation. Leave
STUN
/TURN
selected and leaveTrickle ICE
enabled.
-
-
Choose Start Master to connect to the signaling channel as the
master
role.Allow access to your camera and/or microphone, if needed.
-
Open another browser tab and open the Kinesis Video Streams with WebRTC test page
. All of the information from the previous run should load. -
Scroll down and choose Start Viewer to connect to the signaling channel as the
viewer
role.You should see the media being exchanged between the
master
andviewer
.
Edit the Kinesis Video Streams with WebRTC test page
To edit the SDK and test page for development purposes, follow the instructions below.
Prerequisite
NodeJS version 16+
Note
We recommend downloading the latest long term support (LTS) version from
https://nodejs.org/en/download
Edit the test page
-
Download the Kinesis Video Streams with WebRTC SDK in JavaScript.
Type the following in the terminal:
git clone https://github.com/awslabs/amazon-kinesis-video-streams-webrtc-sdk-js.git
-
Navigate to the directory with the package.json file. The file is located in the repository's root directory.
Type the following in the terminal:
cd amazon-kinesis-video-streams-webrtc-sdk-js
-
Install dependencies.
Type the following npm CLI
command in the terminal: npm install
-
Start the web server to start serving web pages.
Type the following npm CLI
command in the terminal: npm run develop
-
In your browser, visit http://localhost:3001/
. You can make edits to the web page by editing the files in the
examples
directory.