---
title: A Guide to the Amazon Chime SDK – WebRTC.ventures
description: The Amazon Chime SDK allows developers to quickly add messaging, audio, video, and screen sharing capabilities with the Amazon Web Services infrastructure as its backbone. Let's explore its core functionality and try building a simple videoconferencing app.
image: https://blog.webrtc.ventures/hubfs/Imported_Blog_Media/A-Guide-to-the-Amazon-Chime-SDK-1.png
---

[Skip to content](https://blog.webrtc.ventures/2020/12/amazon-chime-sdk#main-content)

![WebRTC.ventures](https://blog.webrtc.ventures/hubfs/logo-main-light.svg)

- [WebRTC Services](https://webrtc.ventures/webrtc-development-services/)
  
  Show submenu for WebRTC Services 
  
    - [Assess](https://webrtc.ventures/services/assess/)
    - [Build](https://webrtc.ventures/services/build/)
    - [Integrate](https://webrtc.ventures/services/integrate/)
    - [Test](https://webrtc.ventures/services/test/)
    - [Manage](https://webrtc.ventures/services/manage/)
    - [Migrating From Twilio Video](https://webrtc.ventures/twilio-video/)
- Our Partners
  
  Show submenu for Our Partners 
  
    - [Amazon Chime SDK](https://webrtc.ventures/partners/amazon-chime-sdk/)
- Stories of Success
  
  Show submenu for Stories of Success 
  
    - [Remote Video Interpreting Platform with Agent Routing](https://webrtc.ventures/successes/remote-video-translation-platform/)
    - [WebRTC to SIP Gateway for ASL Interpreters](https://webrtc.ventures/successes/webrtc-to-sip-gateway-for-asl-interpreters/)
    - [Audio Listening Device to Improve Surgical Outcomes](https://webrtc.ventures/successes/audio-listening-device-to-improve-surgical-outcomes/)
    - [Albania’s First Telemedicine Platform](https://webrtc.ventures/successes/albanias-first-telemedicine-platform/)
    - [Automated Video Storytelling with the Amazon Chime SDK](https://webrtc.ventures/successes/automated-video-storytelling-with-the-amazon-chime-sdk/)
    - [Large Scale Video Conferencing](https://webrtc.ventures/successes/large-scale-video-conferencing/)
    - [Broadcasting and Webcast Control Room](https://webrtc.ventures/successes/live-video-broadcasting-and-webcast-control-room/)
- WebRTC Resources
  
  Show submenu for WebRTC Resources 
  
    - [WebRTC Live](https://webrtc.ventures/webrtc-live/)
    - [WebRTC Tips](https://www.youtube.com/playlist?list=PLayYqdnyegt3QvxX-Rt6wbFIK8727Z5Oz)
    - [WebRTC.ventures Blog](https://webrtc.ventures/blog/)
    - [Migrating From Twilio Video](https://webrtc.ventures/twilio-video/)
    - [WebRTC.ventures Training Program](https://webrtc.ventures/webrtc-ventures-training-program/)
- [About Us](https://webrtc.ventures/our-team/)
  
  Show submenu for About Us 
  
    - [Blog](https://webrtc.ventures/blog/)
    - [Our Team](https://webrtc.ventures/our-team/)
    - [Jobs](https://webrtc.ventures/jobs/)

Open main navigation

Close main navigation

- [WebRTC Services](https://webrtc.ventures/webrtc-development-services/)
  
  Show submenu for WebRTC Services 
  
    - [Assess](https://webrtc.ventures/services/assess/)
    - [Build](https://webrtc.ventures/services/build/)
    - [Integrate](https://webrtc.ventures/services/integrate/)
    - [Test](https://webrtc.ventures/services/test/)
    - [Manage](https://webrtc.ventures/services/manage/)
    - [Migrating From Twilio Video](https://webrtc.ventures/twilio-video/)
- Our Partners
  
  Show submenu for Our Partners 
  
    - [Amazon Chime SDK](https://webrtc.ventures/partners/amazon-chime-sdk/)
- Stories of Success
  
  Show submenu for Stories of Success 
  
    - [Remote Video Interpreting Platform with Agent Routing](https://webrtc.ventures/successes/remote-video-translation-platform/)
    - [WebRTC to SIP Gateway for ASL Interpreters](https://webrtc.ventures/successes/webrtc-to-sip-gateway-for-asl-interpreters/)
    - [Audio Listening Device to Improve Surgical Outcomes](https://webrtc.ventures/successes/audio-listening-device-to-improve-surgical-outcomes/)
    - [Albania’s First Telemedicine Platform](https://webrtc.ventures/successes/albanias-first-telemedicine-platform/)
    - [Automated Video Storytelling with the Amazon Chime SDK](https://webrtc.ventures/successes/automated-video-storytelling-with-the-amazon-chime-sdk/)
    - [Large Scale Video Conferencing](https://webrtc.ventures/successes/large-scale-video-conferencing/)
    - [Broadcasting and Webcast Control Room](https://webrtc.ventures/successes/live-video-broadcasting-and-webcast-control-room/)
- WebRTC Resources
  
  Show submenu for WebRTC Resources 
  
    - [WebRTC Live](https://webrtc.ventures/webrtc-live/)
    - [WebRTC Tips](https://www.youtube.com/playlist?list=PLayYqdnyegt3QvxX-Rt6wbFIK8727Z5Oz)
    - [WebRTC.ventures Blog](https://webrtc.ventures/blog/)
    - [Migrating From Twilio Video](https://webrtc.ventures/twilio-video/)
    - [WebRTC.ventures Training Program](https://webrtc.ventures/webrtc-ventures-training-program/)
- [About Us](https://webrtc.ventures/our-team/)
  
  Show submenu for About Us 
  
    - [Blog](https://webrtc.ventures/blog/)
    - [Our Team](https://webrtc.ventures/our-team/)
    - [Jobs](https://webrtc.ventures/jobs/)
- [Contact us](https://webrtc.ventures/contact/)

[Contact us](https://webrtc.ventures/contact/)

 Dec 7, 2020 12:00:00 AM

# A Guide to the Amazon Chime SDK

[Hamza Nasir](https://blog.webrtc.ventures/author/hamza-nasir)

Share: [linkedin-in icon](http://www.linkedin.com/shareArticle?mini=true&url=https://blog.webrtc.ventures/2020/12/amazon-chime-sdk) [X Twitter icon](https://twitter.com/intent/tweet?url=https://blog.webrtc.ventures/2020/12/amazon-chime-sdk) [envelope icon](mailto:?body=https://blog.webrtc.ventures/2020/12/amazon-chime-sdk)

The pandemic has forced the big players in cloud computing to offer communication services, of which arguably the biggest is Amazon with their Amazon Web Services platform. Now AWS is offering SDK’s and API’s for their pre-existing Amazon Chime video conferencing application. This will allow customers to easily build their own real-time communication apps with Amazon’s infrastructure as the backbone.

In this post, we will go through setting up a simple videoconferencing app with the Amazon Chime SDK and explore some of the core functionality. **Let’s get into it**!

## First things first

First and foremost, we need to clone the Chime’s SDK github repository as it contains a couple of demo applications for us to work with. The SDK can also be added as a dependency to your own project. But for now, we’ll just work with demo code.

```
git clone https://github.com/aws/amazon-chime-sdk-js.git
```

Plain text

Copy

Perfect! Now change directory into the `demos/browser` folder:

```
cd demos/browser
```

Plain text

Copy

## Pre-requisites

Please make sure you satisfy the following prerequisites to build, test, and run these demos from source:

- Node 10 or higher
- npm 6.11 or higher

If you don’t already have Node and NPM installed, use this link: [https://nodejs.org/en/download/](https://nodejs.org/en/download/).

Now, we have to initialize our AWS credentials. Make sure you set these environment variables with your credentials:

```
export AWS_ACCESS_KEY_ID=<your access key id>
export AWS_SECRET_ACCESS_KEY=<your secret access>
```

Plain text

Copy

![](https://blog.webrtc.ventures/hs-fs/hubfs/Imported_Blog_Media/AM6y5TpTkAm4_XHLvAUFTvJxHY73mbgM6fySWohav42zIMFyIZtegXboxe_kmoe2N_lFOIarRpLym7T-bkMZHhV9-VWrC8x9Q1aKTkDFBzbdKe4UwUyQxApCqSCrkcy7Esc_94Af.png?width=257&height=383&name=AM6y5TpTkAm4_XHLvAUFTvJxHY73mbgM6fySWohav42zIMFyIZtegXboxe_kmoe2N_lFOIarRpLym7T-bkMZHhV9-VWrC8x9Q1aKTkDFBzbdKe4UwUyQxApCqSCrkcy7Esc_94Af.png) ![](https://blog.webrtc.ventures/hs-fs/hubfs/Imported_Blog_Media/AM6y5TpTkAm4_XHLvAUFTvJxHY73mbgM6fySWohav42zIMFyIZtegXboxe_kmoe2N_lFOIarRpLym7T-bkMZHhV9-VWrC8x9Q1aKTkDFBzbdKe4UwUyQxApCqSCrkcy7Esc_94Af.png?width=257&height=383&name=AM6y5TpTkAm4_XHLvAUFTvJxHY73mbgM6fySWohav42zIMFyIZtegXboxe_kmoe2N_lFOIarRpLym7T-bkMZHhV9-VWrC8x9Q1aKTkDFBzbdKe4UwUyQxApCqSCrkcy7Esc_94Af.png)

 If you don’t have your AWS credentials then you’ll have to create an AWS access key. You can create it from selecting *My Security Credentials* under your profile banner and then scrolling to the *Access keys for CLI, SDK, & API access* section and selecting *Create access key.*

You can also initialize your credentials using the [aws command line](https://docs.aws.amazon.com/cli/latest/userguide/cli-chap-welcome.html) interface using the `configure` command. This will store all your credentials in the root ~/.aws directory from which the Chime SDK will authenticate the user.

Now run:

```
npm start
```

JavaScript

Copy

This will build and run your project at [http://localhost:8080](http://localhost:8080/). If all goes well then you should see this screen.

![](https://blog.webrtc.ventures/hs-fs/hubfs/Imported_Blog_Media/JBXDWYMMjMx-duAe5bZdvoBRJ0HVUWTrlA5DC8huIGt6T2ymY-CYuOKcf6YLc1LzXn8nJIuU7nG8f3tlcu7ZHVv6CRtwvxC0aQIh5Uuz308u460W0-9FbaPODOtYJZb-0WtBLkeS.png?width=400&height=228&name=JBXDWYMMjMx-duAe5bZdvoBRJ0HVUWTrlA5DC8huIGt6T2ymY-CYuOKcf6YLc1LzXn8nJIuU7nG8f3tlcu7ZHVv6CRtwvxC0aQIh5Uuz308u460W0-9FbaPODOtYJZb-0WtBLkeS.png) ![](https://blog.webrtc.ventures/hs-fs/hubfs/Imported_Blog_Media/JBXDWYMMjMx-duAe5bZdvoBRJ0HVUWTrlA5DC8huIGt6T2ymY-CYuOKcf6YLc1LzXn8nJIuU7nG8f3tlcu7ZHVv6CRtwvxC0aQIh5Uuz308u460W0-9FbaPODOtYJZb-0WtBLkeS.png?width=400&height=228&name=JBXDWYMMjMx-duAe5bZdvoBRJ0HVUWTrlA5DC8huIGt6T2ymY-CYuOKcf6YLc1LzXn8nJIuU7nG8f3tlcu7ZHVv6CRtwvxC0aQIh5Uuz308u460W0-9FbaPODOtYJZb-0WtBLkeS.png)

## Code Overview

We will now discuss the core functionality of the sample application provided by the Chime SDK.

First, we need to initialize the SDK. If you get errors here, please check your AWS credentials and roles.

```
const chime = new AWS.Chime({ region: 'us-east-1' });

// Set the AWS SDK Chime endpoint. The global endpoint is https://service.chime.aws.amazon.com.
chime.endpoint = new AWS.Endpoint(process.env.ENDPOINT || 'https://service.chime.aws.amazon.com');
```

JavaScript

Copy

Any WebRTC-based application starts with token generation. So let’s start with that:

```
meetingTable[requestUrl.query.title] = await chime.createMeeting({
          // Use a UUID for the client request token to ensure that any request retries
          // do not create multiple meetings.
          ClientRequestToken: uuidv4(),
          // Specify the media region (where the meeting is hosted).
          // In this case, we use the region selected by the user.
          MediaRegion: requestUrl.query.region,
          // Any meeting ID you wish to associate with the meeting.
          // For simplicity here, we use the meeting title.
          ExternalMeetingId: requestUrl.query.title.substring(0, 64),
        }).promise();
```

JavaScript

Copy

As you can see here, we save the response from `chime.createMeeting` in a table so we can later look up the meeting title to know whether the meeting exists or not. We will later send this token to the client securely.

Now what if the meeting already exists? We then have to send a token from a different API. Specifically from this one:

```
// Create new attendee for the meeting
      const attendee = await chime.createAttendee({
        // The meeting ID of the created meeting to add the attendee to
        MeetingId: meeting.Meeting.MeetingId,

        // Any user ID you wish to associate with the attendeee.
        // For simplicity here, we use a random id for uniqueness
        // combined with the name the user provided, which can later
        // be used to help build the roster.
        ExternalUserId: `${uuidv4().substring(0, 8)}#${requestUrl.query.name}`.substring(0, 64),
      }).promise()
```

JavaScript

Copy

Simple right? Let’s see what we can do with this token on the client side.

```
let joinInfo = (await this.joinMeeting()).JoinInfo;
    const configuration = new MeetingSessionConfiguration(joinInfo.Meeting, joinInfo.Attendee);
    await this.initializeMeetingSession(configuration);
    const url = new URL(window.location.href);
    url.searchParams.set('m', this.meeting);
    history.replaceState({}, `${this.meeting}`, url.toString());
    return configuration.meetingId;
```

JavaScript

Copy

In this block of code, the response from `await this.joinMeeting()` is the object we generated on the server.

We will now use this configuration object to initialize our `meetingSession`. This will be responsible for controlling most of the call actions, like so:

```
const deviceController = new DefaultDeviceController(logger);
    configuration.enableWebAudio = this.enableWebAudio;
    configuration.enableUnifiedPlanForChromiumBasedBrowsers = this.enableUnifiedPlanForChromiumBasedBrowsers;
    configuration.enableSimulcastForUnifiedPlanChromiumBasedBrowsers = this.enableSimulcast;
    this.meetingSession = new DefaultMeetingSession(configuration, logger, deviceController);
    this.audioVideo = this.meetingSession.audioVideo;
```

Plain text

Copy

Keep an eye out for the `meetingSession` and `audioVideo` objects. They will be used repeatedly to set up the call.

To join, we first have to configure an Audio and Video device with Chime. This is synonymous to the process of publishing in most WebRTC applications. We create a dropdown of available devices so that the user can choose which devices they want to publish with. Let’s look at how we populate and set audio devices:

```
async populateAudioInputList(): Promise<void> {
    const genericName = 'Microphone';
    const additionalDevices = ['None', '440 Hz'];
    this.populateDeviceList(
      'audio-input',
      genericName,
      await this.audioVideo.listAudioInputDevices(),
      additionalDevices
    );
    this.populateInMeetingDeviceList(
      'dropdown-menu-microphone',
      genericName,
      await this.audioVideo.listAudioInputDevices(),
      additionalDevices,
      async (name: string) => {
        await this.audioVideo.chooseAudioInputDevice(this.audioInputSelectionToDevice(name));
      }
    );
  }
```

Plain text

Copy

Ignoring the UI code, it’s important to realize the two main calls in actions here. The first is that we populate our Audio devices using the `this.audioVideo.listAudioInputDevices()` function. And then, when the user selects a device from the drop down we select it in our publisher using the `this.audioVideo.chooseAudioInputDevice()` function.

Once the user has initialized their devices we are ready to start the call with one simple line of code.

```
this.audioVideo.start();
```

JavaScript

Copy

As of now, we’ve connected to the session and published our stream. Now there’s one last thing left to do: Subscribe to other streams. This is done in this particular example in the `setupSubscribeToAttendeeIdPresenceHandler()`function.

This is a rather lengthy function that handles UI operations such as binding a volume indicator to show the participant’s mic activity and speaker detection. But what’s important is to look at the `this.audioVideo.realtimeSubscribeToVolumeIndicator()`function. Despite its confusing name that implies that it has something to do with the subscribers volume, this is the function responsible for connecting the remote participant’s stream to your session.

We’ve made some great progress! Our client is now successfully connected to the call. But you may ask, what about the stream UI? How does this connect to stuff you can actually see on the screen?

This is an area that Amazon Chime offers a lot of flexibility. Maybe even too much flexibility one would argue. Let’s keep it simple. In your App you need to make sure your react class implements `AudioVideoObserver`:

```
export class DemoMeetingApp implements AudioVideoObserver, DeviceChangeObserver
```

JavaScript

Copy

If this class of yours also has code to change devices, you’ll have to implement the `DeviceChangeObserver`code as well. Now you’ll have to implement one of AudioVideoObserver’s call back called `videoTileDidUpdate(tileState: VideoTileState)`.

This gets called whenever a new participant joins or when the user’s stream’s state changes. You will use this to bind this to an html element in your UI using this function call:

```
this.audioVideo.bindVideoElement(tileId, videoElement);
```

Plain text

Copy

Here, the `videoElement` is the existing element in your HTML DOM where you would like to display the user’s stream and `tileId` is contained in the tileState object you received in the `videoTileDidUpdate` call back.

And there you have it. You’re an Amazon Chime Pro!

*Ready to build audio calling, video calling, or screen sharing capabilities into your business or application? [**Contact the experts at WebRTC.ventures today!**](https://webrtc.ventures/contact/)*

[CPaaS](https://blog.webrtc.ventures/tag/cpaas), [Managed Services](https://blog.webrtc.ventures/tag/managed-services), [Events](https://blog.webrtc.ventures/tag/events), [Video Conferencing](https://blog.webrtc.ventures/tag/video-conferencing), [Real Time Weekly](https://blog.webrtc.ventures/tag/real-time-weekly), [WebRTC Architecture](https://blog.webrtc.ventures/tag/webrtc-architecture), [Broadcasting](https://blog.webrtc.ventures/tag/broadcasting), [Medical](https://blog.webrtc.ventures/tag/medical), [WebRTC Live](https://blog.webrtc.ventures/tag/webrtc-live), [Showcase](https://blog.webrtc.ventures/tag/showcase), [Thoughts](https://blog.webrtc.ventures/tag/thoughts), [Vonage](https://blog.webrtc.ventures/tag/vonage), [Daily](https://blog.webrtc.ventures/tag/daily), [Jobs](https://blog.webrtc.ventures/tag/jobs), [Contact Centers](https://blog.webrtc.ventures/tag/contact-centers), [Telehealth](https://blog.webrtc.ventures/tag/telehealth), [Education](https://blog.webrtc.ventures/tag/education), [Technical](https://blog.webrtc.ventures/tag/technical), [General](https://blog.webrtc.ventures/tag/general), [Story of success](https://blog.webrtc.ventures/tag/story-of-success), [The WebRTC.ventures Blog](https://blog.webrtc.ventures/tag/the-webrtc-ventures-blog), [Testing](https://blog.webrtc.ventures/tag/testing), [Gaming](https://blog.webrtc.ventures/tag/gaming), [DevOps](https://blog.webrtc.ventures/tag/devops), [Symbl.ai](https://blog.webrtc.ventures/tag/symbl-ai)

## Related posts

[![](https://blog.webrtc.ventures/hs-fs/hubfs/Imported_Blog_Media/Building-a-Video-Chat-with-the-Amazon-Chime-SDK-Marcell.png?height=200&name=Building-a-Video-Chat-with-the-Amazon-Chime-SDK-Marcell.png)](https://blog.webrtc.ventures/2022/10/building-a-video-chat-with-the-amazon-chime-sdk)

## [Building a Video Chat with the Amazon Chime SDK ](https://blog.webrtc.ventures/2022/10/building-a-video-chat-with-the-amazon-chime-sdk)

[Marcell Silva](https://blog.webrtc.ventures/author/marcell-silva) 

 Oct 5, 2022 12:00:00 AM

The Amazon Chime SDK is an Amazon service that lets you create multimedia calls using...

[Read more](https://blog.webrtc.ventures/2022/10/building-a-video-chat-with-the-amazon-chime-sdk)

[![](https://blog.webrtc.ventures/hs-fs/hubfs/Imported_Blog_Media/Building-a-Multi-Party-Video-Conference-with-the-Amazon-Chime-SDK.png?height=200&name=Building-a-Multi-Party-Video-Conference-with-the-Amazon-Chime-SDK.png)](https://blog.webrtc.ventures/2022/10/building-a-multi-party-video-conference-with-the-amazon-chime-sdk)

## [Building a Multi-Party Video Conference with the Amazon Chime SDK](https://blog.webrtc.ventures/2022/10/building-a-multi-party-video-conference-with-the-amazon-chime-sdk)

[Marcell Silva](https://blog.webrtc.ventures/author/marcell-silva) 

 Oct 28, 2022 12:00:00 AM

In a previous post, we showed you how to build a simple two party video chat using the Amazon Chime...

[Read more](https://blog.webrtc.ventures/2022/10/building-a-multi-party-video-conference-with-the-amazon-chime-sdk)

[![](https://blog.webrtc.ventures/hs-fs/hubfs/Imported_Blog_Media/Integrating-Live-Streaming-Experiences-Using-Amazon-IVS.png?height=200&name=Integrating-Live-Streaming-Experiences-Using-Amazon-IVS.png)](https://blog.webrtc.ventures/2024/01/integrating-live-streaming-experiences-using-amazon-ivs)

## [Integrating Live Streaming Experiences Using Amazon IVS](https://blog.webrtc.ventures/2024/01/integrating-live-streaming-experiences-using-amazon-ivs)

[Hector Zelaya](https://blog.webrtc.ventures/author/hector-zelaya) 

 Jan 9, 2024 12:00:00 AM

Amazon Interactive Video Service (Amazon IVS) provides a managed platform on which to build...

[Read more](https://blog.webrtc.ventures/2024/01/integrating-live-streaming-experiences-using-amazon-ivs)

### WebRTC.Ventures Services

...

- Assess
- Build
- Integrate
- Test
- Deploy & Manage

### Contact Us

...

**Video should be an opportunity, not a headache.**   
 We’re here to build, integrate, assess and optimize, test, and even deploy and manage your live video application. 

[Contact us](https://blog.webrtc.ventures/2020/12/amazon-chime-sdk#contact)

### WebRTC Live

...

 View [past episodes](https://blog.webrtc.ventures/webrtc-live/) of our webinar interview series about the latest webRTC use cases and technical updates. Join our mailing list to learn about upcoming episodes! 

![WebRTC Live](https://blog.webrtc.ventures/hs-fs/hubfs/Template%20Images/widged-bannet.webp?height=90&name=widged-bannet.webp)

![logo-main-light](https://blog.webrtc.ventures/hubfs/logo-main-light.svg "logo-main-light")

We’re one of the few agencies in the world dedicated to WebRTC development. This dedication and experience is why so many people trust us to help bring live video application dreams to life.

 

### Let's get started!

###### **[Contact us today](https://webrtc.ventures/contact/)**

**[info@webrtc.ventures](mailto:info@webrtc.ventures)**

<https://www.linkedin.com/company/webrtc-ventures> <https://www.youtube.com/@WebrtcVentures>

### Join our mailing list

We don't e-mail often (a few times a month max), and it will be worth it when we do! Of course, we respect your privacy and will not share your contact information.

© 2023 WebRTC.ventures, an [AgilityFeat](https://agilityfeat.com/) company / [Privacy Policy](https://webrtc.ventures/privacy-policy//)

```json
{
  "@context" : "https://schema.org",
  "@type" : "BlogPosting",
  "author" : {
    "@type" : "Person",
    "name" : "Hamza Nasir",
    "url" : "https://blog.webrtc.ventures/author/hamza-nasir"
  },
  "dateModified" : "2024-04-03T17:53:02.903Z",
  "datePublished" : "2020-12-07T05:00:00.000Z",
  "headline" : "A Guide to the Amazon Chime SDK – WebRTC.ventures",
  "image" : [ "https://blog.webrtc.ventures/hubfs/Imported_Blog_Media/A-Guide-to-the-Amazon-Chime-SDK-1.png" ],
  "mainEntityOfPage" : {
    "@id" : "https://blog.webrtc.ventures/2020/12/amazon-chime-sdk",
    "@type" : "WebPage"
  },
  "publisher" : {
    "@type" : "Organization",
    "logo" : {
      "@type" : "ImageObject",
      "url" : "https://blog.webrtc.ventures/hubfs/logo-main-light.svg"
    }
  }
}
```