{"id":15710332,"url":"https://github.com/aws/amazon-chime-sdk-js","last_synced_at":"2025-05-13T19:17:11.191Z","repository":{"id":37276333,"uuid":"216939647","full_name":"aws/amazon-chime-sdk-js","owner":"aws","description":"A JavaScript client library for integrating multi-party communications powered by the Amazon Chime service.","archived":false,"fork":false,"pushed_at":"2025-05-07T23:29:54.000Z","size":45940,"stargazers_count":735,"open_issues_count":71,"forks_count":474,"subscribers_count":57,"default_branch":"main","last_synced_at":"2025-05-08T00:07:54.374Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/aws.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":"CODEOWNERS","security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2019-10-23T01:13:12.000Z","updated_at":"2025-04-28T21:44:32.000Z","dependencies_parsed_at":"2022-07-13T19:30:32.216Z","dependency_job_id":"5dea4fc1-b974-4c82-a7b4-dc9d9673295a","html_url":"https://github.com/aws/amazon-chime-sdk-js","commit_stats":{"total_commits":1503,"total_committers":113,"mean_commits":"13.300884955752212","dds":0.8822355289421158,"last_synced_commit":"c8f65cb30bbf22bd022ee91edf6e7baf0641a7e0"},"previous_names":[],"tags_count":113,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aws%2Famazon-chime-sdk-js","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aws%2Famazon-chime-sdk-js/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aws%2Famazon-chime-sdk-js/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aws%2Famazon-chime-sdk-js/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/aws","download_url":"https://codeload.github.com/aws/amazon-chime-sdk-js/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254010826,"owners_count":21999004,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-10-03T21:06:18.406Z","updated_at":"2025-05-13T19:17:11.147Z","avatar_url":"https://github.com/aws.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Amazon Chime SDK for JavaScript\n\n[Amazon Chime SDK Project Board](https://github.com/orgs/aws/projects/12)\n\n[Amazon Chime SDK React Components](https://github.com/aws/amazon-chime-sdk-component-library-react)\n\n\u003ca href=\"https://www.npmjs.com/package/amazon-chime-sdk-js\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/amazon-chime-sdk-js?style=flat-square\"\u003e\u003c/a\u003e\n\u003ca href=\"https://github.com/aws/amazon-chime-sdk-js/actions?query=workflow%3A%22Deploy+Demo+App+Workflow%22\"\u003e\u003cimg src=\"https://github.com/aws/amazon-chime-sdk-js/workflows/Deploy%20Demo%20App%20Workflow/badge.svg\"\u003e\u003c/a\u003e\n\n## Build video calling, audio calling, messaging, and screen sharing applications powered by the Amazon Chime SDK\n\nThe Amazon Chime SDK is a set of real-time communications components that developers can\nuse to quickly add messaging, audio, video, and screen sharing capabilities to their web or\nmobile applications.\n\nDevelopers can build on AWS's global communications infrastructure to deliver\nengaging experiences in their applications. For example, they can add video to a\nhealth application so patients can consult remotely with doctors on health\nissues, or create customized audio prompts for integration with the public\ntelephone network.\n\nThe Amazon Chime SDK for JavaScript works by connecting to meeting session\nresources that you create in your AWS account. The SDK has everything\nyou need to build custom calling and collaboration experiences in your\nweb application, including methods to configure meeting sessions, list and\nselect audio and video devices, start and stop screen share and screen share\nviewing, receive callbacks when media events such as volume changes occur, and\ncontrol meeting features such as audio mute and video tile bindings.\n\nIf you are building a React application, consider using the [Amazon Chime SDK React Component Library](https://github.com/aws/amazon-chime-sdk-component-library-react) that supplies client-side state management and reusable UI components for common web interfaces used in audio and video conferencing applications. Amazon Chime also offers [Amazon Chime SDK for iOS](https://github.com/aws/amazon-chime-sdk-ios) and [Amazon Chime SDK for Android](https://github.com/aws/amazon-chime-sdk-android) for native mobile application development.\n\nThe [Amazon Chime SDK Project Board](https://github.com/orgs/aws/projects/12) captures the status of community feature requests across all our repositories. The descriptions of the columns on the board are captured in this [guide](https://aws.github.io/amazon-chime-sdk-js/modules/projectboard.html).\n\n## Resources\n\n- [Amazon Chime SDK Overview](https://aws.amazon.com/chime/chime-sdk/)\n- [Understanding security in Amazon Chime Application and SDK](https://aws.amazon.com/blogs/business-productivity/understanding-security-in-the-amazon-chime-application-and-sdk/)\n- [Pricing](https://aws.amazon.com/chime/chime-sdk/pricing/)\n- [Supported Browsers](https://docs.aws.amazon.com/chime-sdk/latest/dg/meetings-sdk.html#mtg-browsers)\n- [Getting Started Guides](guides/20_Builders_Journey.md)\n- [Developer Guide](https://docs.aws.amazon.com/chime-sdk/latest/dg/meetings-sdk.html)\n- [Control Plane API Reference](https://docs.aws.amazon.com/chime-sdk/latest/APIReference/welcome.html)\n- [Frequently Asked Questions (FAQ)](https://aws.github.io/amazon-chime-sdk-js/modules/faqs.html)\n\n## Blog posts\n\nIn addition to the below, here is a list of [all blog posts about the Amazon Chime SDK](https://aws.amazon.com/blogs/business-productivity/tag/amazon-chime-sdk/).\n\n### Frontend\n\n- [Transforming Audio and Shared Content](https://aws.amazon.com/blogs/business-productivity/transforming-audio-and-shared-content-in-the-amazon-chime-sdk-for-javascript/)\n- [Quickly Launch an Amazon Chime SDK Application With AWS Amplify](https://aws.amazon.com/blogs/business-productivity/quickly-launch-an-amazon-chime-sdk-application-with-aws-amplify/)\n\n### Full stack and PSTN\n\n- [Capturing Amazon Chime SDK Meeting Content](https://aws.amazon.com/blogs/business-productivity/capture-amazon-chime-sdk-meetings-using-media-capture-pipelines/)\n- [Monitoring and Troubleshooting With Amazon Chime SDK Meeting Events](https://aws.amazon.com/blogs/business-productivity/monitoring-and-troubleshooting-with-amazon-chime-sdk-meeting-events/)\n- [Build Meetings features into your Amazon Chime SDK messaging application](https://aws.amazon.com/blogs/business-productivity/build-meeting-features-into-your-amazon-chime-sdk-messaging-application/)\n- [Using the Amazon Chime SDK to Create Automated Outbound Call Notifications](https://aws.amazon.com/blogs/business-productivity/using-the-amazon-chime-sdk-to-create-automated-outbound-call-notifications/)\n- [Building voice menus and call routing with the Amazon Chime SDK](https://aws.amazon.com/blogs/business-productivity/building-voice-menus-and-call-routing-with-the-amazon-chime-sdk/)\n\n### Messaging\n\n- [Use channel flows to remove profanity and sensitive content from messages in Amazon Chime SDK messaging](https://aws.amazon.com/blogs/business-productivity/use-channel-flows-to-remove-profanity-and-sensitive-content-from-messages-in-amazon-chime-sdk-messaging/)\n- [Automated Moderation and Sentiment Analysis Blog (example using Kinesis Data Streams)](https://aws.amazon.com/blogs/business-productivity/automated-moderation-and-sentiment-analysis-with-amazon-chime-sdk-messaging)\n- [Build chat applications in iOS and Android with Amazon Chime SDK messaging](https://aws.amazon.com/blogs/business-productivity/build-chat-applications-in-ios-and-android-with-amazon-chime-sdk-messaging/)\n- [Building chat features into your application with Amazon Chime SDK messaging](https://aws.amazon.com/blogs/business-productivity/build-chat-features-into-your-application-with-amazon-chime-sdk-messaging/)\n- [Integrate your Identity Provider with Amazon Chime SDK Messaging](https://aws.amazon.com/blogs/business-productivity/integrate-your-identity-provider-with-amazon-chime-sdk-messaging/)\n- [Creating Read-Only Chat Channels for Announcements](https://aws.amazon.com/blogs/business-productivity/creating-read-only-chat-channels-for-announcements-with-amazon-chime-sdk-messaging/)\n- [Real-time Collaboration Using Amazon Chime SDK messaging](https://aws.amazon.com/blogs/business-productivity/real-time-collaboration-using-amazon-chime-sdk-messaging/)\n- [Building a Live Streaming Chat Application](https://aws.amazon.com/blogs/business-productivity/build-a-live-streaming-chat-application-using-amazon-ivs-and-amazon-chime-sdk)\n\n### Media Pipelines\n\n- [Capture Amazon Chime SDK Meetings Using Media Capture Pipelines](https://aws.amazon.com/blogs/business-productivity/capture-amazon-chime-sdk-meetings-using-media-capture-pipelines/)\n- [Amazon Chime SDK launches live connector for streaming](https://aws.amazon.com/blogs/business-productivity/amazon-chime-sdk-launches-live-connector-for-streaming/)\n\n### Webinars and videos\n\n- [Webinar: Creating Classroom Experiences Using the Amazon Chime SDK](https://www.youtube.com/watch?v=S8T-0xfvXJ8)\n\n## JavaScript SDK Guides\n\nThe following developer guides cover specific topics for a technical audience.\n\n- [API Overview](https://aws.github.io/amazon-chime-sdk-js/modules/apioverview.html)\n- [Frequently Asked Questions (FAQ)](https://aws.github.io/amazon-chime-sdk-js/modules/faqs.html)\n- [Content Share](https://aws.github.io/amazon-chime-sdk-js/modules/contentshare.html)\n- [Quality, Bandwidth, and Connectivity](https://aws.github.io/amazon-chime-sdk-js/modules/qualitybandwidth_connectivity.html)\n- [Simulcast](https://aws.github.io/amazon-chime-sdk-js/modules/simulcast.html)\n- [Meeting Events](https://aws.github.io/amazon-chime-sdk-js/modules/meetingevents.html)\n- [Integrating Amazon Voice Focus and Echo Reduction Into Your Application](https://aws.github.io/amazon-chime-sdk-js/modules/amazonvoice_focus.html)\n- [Adding Frame-By-Frame Processing to an Outgoing Video Stream](https://aws.github.io/amazon-chime-sdk-js/modules/videoprocessor.html)\n- [Adding Background Filtering to an Outgoing Video Stream](https://aws.github.io/amazon-chime-sdk-js/modules/backgroundfilter_videofx_processor.html)\n- [Adapting Video to Limited Bandwidth Using a Priority-Based Video Downlink Policy](https://aws.github.io/amazon-chime-sdk-js/modules/prioritybased_downlink_policy.html)\n- [Client Event Ingestion](https://aws.github.io/amazon-chime-sdk-js/modules/clientevent_ingestion.html)\n- [Content Security Policy](https://aws.github.io/amazon-chime-sdk-js/modules/contentsecurity_policy.html)\n- [Managing Video Quality for Different Video Layouts](https://aws.github.io/amazon-chime-sdk-js/modules/videolayout.html)\n\n## Migration Guides\n\n- [Migration from V1.0 to V2.0](https://aws.github.io/amazon-chime-sdk-js/modules/migrationto_2_0.html)\n- [Migration from V2.0 to V3.0](https://aws.github.io/amazon-chime-sdk-js/modules/migrationto_3_0.html)\n\n## Developer Guides\n\nThe following developer guides cover the Amazon Chime SDK more broadly.\n\n- [Messaging developer guide](https://docs.aws.amazon.com/chime-sdk/latest/dg/using-the-messaging-sdk.html)\n- [Media Pipelines developer guide](https://docs.aws.amazon.com/chime-sdk/latest/dg/media-pipelines.html)\n\n## Examples\n\n- [Amazon Chime SDK Samples](https://github.com/aws-samples/amazon-chime-sdk) — Amazon Chime SDK Samples repository\n- [Meeting Demo](https://github.com/aws/amazon-chime-sdk-js/tree/main/demos/browser) — A browser\n  meeting application with a local server\n- [Serverless Meeting Demo](https://github.com/aws/amazon-chime-sdk-js/tree/main/demos/serverless) — A self-contained serverless meeting application\n- [Single JS](https://github.com/aws-samples/amazon-chime-sdk/tree/main/utils/singlejs) — A script to bundle the SDK into a single `.js` file\n- [Transcription and Media Capture Demo](https://github.com/aws-samples/amazon-chime-media-capture-pipeline-demo) - A demo to demonstrate transcription and media capture capabilities\n- [Virtual Classroom](https://aws.amazon.com/blogs/business-productivity/building-a-virtual-classroom-application-using-the-amazon-chime-sdk/) — An online classroom built with Electron and React\n- [Live Events](https://aws.amazon.com/blogs/opensource/how-to-deploy-a-live-events-solution-built-with-the-amazon-chime-sdk/) — Interactive live events solution\n- [Amazon Chime SDK Smart Video Sending Demo](https://aws.amazon.com/blogs/business-productivity/amazon-chime-sdk-smart-video-sending-demo/) — Demo showcasing how to dynamically display up to 25 video tiles from a pool of up to 250 meeting attendees\n- [Amazon Chime SDK and Amazon Connect Integration](https://aws.amazon.com/blogs/business-productivity/build-a-video-contact-center-with-amazon-connect-and-amazon-chime-sdk/) — Build a video contact center with Amazon Connect and Amazon Chime SDK\n- [Device Integration](https://aws.amazon.com/blogs/business-productivity/using-the-amazon-chime-sdk-for-3rd-party-devices/) — Using the Amazon Chime SDK for 3rd party devices\n- [Messaging](https://aws.amazon.com/blogs/business-productivity/build-chat-features-into-your-application-with-amazon-chime-sdk-messaging/) — Build chat features into your application with Amazon Chime SDK messaging\n- [Load Testing Applications](https://aws.amazon.com/blogs/business-productivity/load-testing-applications-built-with-the-amazon-chime-sdk/) — A tool to load test audio-video communication applications\n\n### PSTN Audio Examples\n\n- [PSTN Dial In](https://github.com/aws-samples/chime-sipmediaapplication-samples) — Add PSTN dial-in capabilities to your Amazon Chime SDK Meeting using SIP media application\n- [Outbound Call Notifications](https://github.com/aws-samples/amazon-chime-sma-outbound-call-notifications) — Send meeting reminders with SIP media application and get real time results back\n- [Update In-Progress Call](https://github.com/aws-samples/amazon-chime-sma-update-call) - Update an in-progress SIP media application call via API call\n\n## Troubleshooting and Support\n\nReview the resources given in the README and use our [client documentation](https://aws.github.io/amazon-chime-sdk-js/) for guidance on how to develop on the Chime SDK for JavaScript. Additionally, search our [issues database](https://github.com/aws/amazon-chime-sdk-js/issues) and [FAQs](https://aws.github.io/amazon-chime-sdk-js/modules/faqs.html) to see if your issue is already addressed. If not please cut us an [issue](https://github.com/aws/amazon-chime-sdk-js/issues/new/choose) using the provided templates.\n\nThe blog post [Monitoring and Troubleshooting With Amazon Chime SDK Meeting Events](https://aws.amazon.com/blogs/business-productivity/monitoring-and-troubleshooting-with-amazon-chime-sdk-meeting-events/) goes into detail about how to use meeting events to troubleshoot your application by logging to Amazon CloudWatch.\n\nIf you have more questions, or require support for your business, you can reach out to [AWS Customer support](https://pages.awscloud.com/GLOBAL-aware-GC-Amazon-Chime-SDK-2020-reg.html). You can review our support plans [here](https://aws.amazon.com/premiumsupport/plans/?nc=sn\u0026loc=1).\n\n## WebRTC Resources\n\nThe Amazon Chime SDK for JavaScript uses WebRTC, the real-time communication API supported in most modern browsers. Here are some general resources on WebRTC.\n\n- [WebRTC Basics](https://www.html5rocks.com/en/tutorials/webrtc/basics/)\n- [WebRTC Org - Getting started, presentation, samples, tutorials, books and more resources](https://webrtc.github.io/webrtc-org/start/)\n- [High Performance Browser Networking - WebRTC (Browser APIs and Protocols)](https://hpbn.co/webrtc/)\n- [MDN - WebRTC APIs](https://developer.mozilla.org/en-US/docs/Web/API/WebRTC_API)\n\n## Installation\n\nMake sure you have Node.js version 18 or higher. Node 20 is recommended and supported.\n\nTo add the Amazon Chime SDK for JavaScript into an existing application,\ninstall the package directly from npm:\n\n```\nnpm install amazon-chime-sdk-js --save\n```\n\nNote that the Amazon Chime SDK for JavaScript targets ES2015, which is fully compatible with\nall supported browsers.\n\n## Setup\n\n### Meeting session\n\nCreate a meeting session in your client application.\n\n```js\nimport {\n  ConsoleLogger,\n  DefaultDeviceController,\n  DefaultMeetingSession,\n  LogLevel,\n  MeetingSessionConfiguration\n} from 'amazon-chime-sdk-js';\n\nconst logger = new ConsoleLogger('MyLogger', LogLevel.INFO);\nconst deviceController = new DefaultDeviceController(logger);\n\n// You need responses from server-side Chime API. See below for details.\nconst meetingResponse = /* The response from the CreateMeeting API action */;\nconst attendeeResponse = /* The response from the CreateAttendee or BatchCreateAttendee API action */;\nconst configuration = new MeetingSessionConfiguration(meetingResponse, attendeeResponse);\n\n// In the usage examples below, you will use this meetingSession object.\nconst meetingSession = new DefaultMeetingSession(\n  configuration,\n  logger,\n  deviceController\n);\n```\n\n#### Getting responses from your server application\n\nYou can use an AWS SDK, the AWS Command Line Interface (AWS CLI), or the REST API\nto make API calls. In this section, you will use the AWS SDK for JavaScript in your server application, e.g. Node.js.\nSee [Amazon Chime SDK API Reference](https://docs.aws.amazon.com/chime-sdk/latest/APIReference/welcome.html) for more information.\n\n\u003e ⚠️ The server application does not require the Amazon Chime SDK for JavaScript.\n\n```js\nconst AWS = require('aws-sdk');\nconst { v4: uuid } = require('uuid');\n\n// You must use \"us-east-1\" as the region for Chime API and set the endpoint.\nconst chime = new AWS.ChimeSDKMeetings({ region: 'us-east-1' });\n\nconst meetingResponse = await chime\n  .createMeeting({\n    ClientRequestToken: uuid(),\n    MediaRegion: 'us-west-2', // Specify the region in which to create the meeting.\n  })\n  .promise();\n\nconst attendeeResponse = await chime\n  .createAttendee({\n    MeetingId: meetingResponse.Meeting.MeetingId,\n    ExternalUserId: uuid(), // Link the attendee to an identity managed by your application.\n  })\n  .promise();\n```\n\nNow securely transfer the `meetingResponse` and `attendeeResponse` objects to your client application.\nThese objects contain all the information needed for a client application using the Amazon Chime SDK for JavaScript to join the meeting.\n\nThe value of the MediaRegion parameter in the createMeeting() should ideally be set to the one of the media regions which is closest to the user creating a meeting. An implementation can be found under the topic 'Choosing the nearest media Region' in the [Amazon Chime SDK Media Regions documentation](https://docs.aws.amazon.com/chime-sdk/latest/dg/chime-sdk-meetings-regions.html).\n\n### Messaging session\n\nCreate a messaging session in your client application to receive messages from Amazon Chime SDK for Messaging.\n\n```js\nimport { ChimeSDKMessagingClient } from '@aws-sdk/client-chime-sdk-messaging';\n\nimport {\n  ConsoleLogger,\n  DefaultMessagingSession,\n  LogLevel,\n  MessagingSessionConfiguration,\n} from 'amazon-chime-sdk-js';\n\nconst logger = new ConsoleLogger('SDK', LogLevel.INFO);\n\n// You will need AWS credentials configured before calling AWS or Amazon Chime APIs.\nconst chime = new ChimeSDKMessagingClient({ region: 'us-east-1'});\n\nconst userArn = /* The userArn */;\nconst sessionId = /* The sessionId */;\nconst configuration = new MessagingSessionConfiguration(userArn, sessionId, undefined, chime);\nconst messagingSession = new DefaultMessagingSession(configuration, logger);\n```\n\nIf you would like to enable prefetch feature when connecting to a messaging session, you can follow the code below.\nPrefetch feature will send out CHANNEL_DETAILS event upon websocket connection, which includes information about channel,\nchannel messages, channel memberships etc. Prefetch sort order can be adjusted with `prefetchSortBy`, setting it to either\n`unread` (default value if not set) or `lastMessageTimestamp`\n\n```js\nconfiguration.prefetchOn = Prefetch.Connect;\nconfiguration.prefetchSortBy = PrefetchSortBy.Unread;\n```\n\n## Building and testing\n\n```\ngit fetch --tags https://github.com/aws/amazon-chime-sdk-js\nnpm run build\nnpm run test\n```\n\nAfter running `npm run test` the first time, you can use `npm run test:fast` to speed up the test suite.\n\nTags are fetched in order to correctly generate versioning metadata.\n\nTo view code coverage results open `coverage/index.html` in your browser after running `npm run test`.\n\nIf you run `npm run test` and the tests are running but the coverage report is not getting generated then you might have a resource clean up issue. In Mocha v4.0.0 or newer the implementation was changed so that the Mocha processes will not force exit when the test run is complete.\n\nFor example, if you have a `DefaultVideoTransformDevice` in your unit test then you must call `await device.stop();` to clean up the resources and not run into this issue. You can also look into the usage of `done();` in the [Mocha documentation](https://mochajs.org/#asynchronous-code).\n\n## Generating the documentation\n\nTo generate JavaScript API reference documentation run:\n\n```\nnpm run build\nnpm run doc\n```\n\nThen open `docs/index.html` in your browser.\n\n## Reporting a suspected vulnerability\n\nIf you discover a potential security issue in this project we ask that you notify AWS/Amazon Security via our\n[vulnerability reporting page](https://aws.amazon.com/security/vulnerability-reporting/).\nPlease do **not** create a public GitHub issue.\n\n## Usage\n\n- [Device](#device)\n- [Starting a session](#starting-a-session)\n- [Audio](#audio)\n- [Video](#video)\n- [Screen and content share](#screen-and-content-share)\n- [Attendees](#attendees)\n- [Monitoring and alerts](#monitoring-and-alerts)\n- [Stopping a session](#stopping-a-session)\n- [Meeting readiness checker](#meeting-readiness-checker)\n- [Selecting an Audio Profile](#selecting-an-audio-profile)\n- [Starting a Messaging Session](#starting-a-messaging-session)\n- [Providing application metadata](#providing-application-metadata)\n\n### Device\n\n\u003e Note: Before starting a session, you need to choose your microphone, speaker, and camera.\n\n**Use case 1.** List audio input, audio output, and video input devices. The browser will ask for microphone and camera permissions.\n\nWith the `forceUpdate` parameter set to true, cached device information is discarded and updated after the device label trigger is called. In some cases, builders need to delay the triggering of permission dialogs, e.g., when joining a meeting in view-only mode, and then later be able to trigger a permission prompt in order to show device labels; specifying `forceUpdate` allows this to occur.\n\n```js\nconst audioInputDevices = await meetingSession.audioVideo.listAudioInputDevices();\nconst audioOutputDevices = await meetingSession.audioVideo.listAudioOutputDevices();\nconst videoInputDevices = await meetingSession.audioVideo.listVideoInputDevices();\n\n// An array of MediaDeviceInfo objects\naudioInputDevices.forEach(mediaDeviceInfo =\u003e {\n  console.log(`Device ID: ${mediaDeviceInfo.deviceId} Microphone: ${mediaDeviceInfo.label}`);\n});\n```\n\n**Use case 2.** Choose audio input and audio output devices by passing the `deviceId` of a `MediaDeviceInfo` object.\nNote that you need to call `listAudioInputDevices` and `listAudioOutputDevices` first.\n\n```js\nconst audioInputDeviceInfo = /* An array item from meetingSession.audioVideo.listAudioInputDevices */;\nawait meetingSession.audioVideo.startAudioInput(audioInputDeviceInfo.deviceId);\n\nconst audioOutputDeviceInfo = /* An array item from meetingSession.audioVideo.listAudioOutputDevices */;\nawait meetingSession.audioVideo.chooseAudioOutput(audioOutputDeviceInfo.deviceId);\n```\n\n**Use case 3.** Choose a video input device by passing the `deviceId` of a `MediaDeviceInfo` object.\nNote that you need to call `listVideoInputDevices` first.\n\nIf there is an LED light next to the attendee's camera, it will be turned on indicating that it is now capturing from the camera.\nYou probably want to choose a video input device when you start sharing your video.\n\n```js\nconst videoInputDeviceInfo = /* An array item from meetingSession.audioVideo.listVideoInputDevices */;\nawait meetingSession.audioVideo.startVideoInput(videoInputDeviceInfo.deviceId);\n\n// Stop video input. If the previously chosen camera has an LED light on,\n// it will turn off indicating the camera is no longer capturing.\nawait meetingSession.audioVideo.stopVideoInput();\n```\n\n**Use case 4.** Add a device change observer to receive the updated device list.\nFor example, when you pair Bluetooth headsets with your computer, `audioInputsChanged` and `audioOutputsChanged` are called\nwith the device list including headsets.\n\nYou can use the `audioInputMuteStateChanged` callback to track the underlying\nhardware mute state on browsers and operating systems that support that.\n\n```js\nconst observer = {\n  audioInputsChanged: freshAudioInputDeviceList =\u003e {\n    // An array of MediaDeviceInfo objects\n    freshAudioInputDeviceList.forEach(mediaDeviceInfo =\u003e {\n      console.log(`Device ID: ${mediaDeviceInfo.deviceId} Microphone: ${mediaDeviceInfo.label}`);\n    });\n  },\n\n  audioOutputsChanged: freshAudioOutputDeviceList =\u003e {\n    console.log('Audio outputs updated: ', freshAudioOutputDeviceList);\n  },\n\n  videoInputsChanged: freshVideoInputDeviceList =\u003e {\n    console.log('Video inputs updated: ', freshVideoInputDeviceList);\n  },\n\n  audioInputMuteStateChanged: (device, muted) =\u003e {\n    console.log('Device', device, muted ? 'is muted in hardware' : 'is not muted');\n  },\n};\n\nmeetingSession.audioVideo.addDeviceChangeObserver(observer);\n```\n\n### Starting a session\n\n**Use case 5.** Start a session. To hear audio, you need to bind a device and stream to an `\u003caudio\u003e` element.\nOnce the session has started, you can talk and listen to attendees.\nMake sure you have chosen your microphone and speaker (See the \"Device\" section), and at least one other attendee has joined the session.\n\n```js\nconst audioElement = /* HTMLAudioElement object e.g. document.getElementById('audio-element-id') */;\nmeetingSession.audioVideo.bindAudioElement(audioElement);\n\nconst observer = {\n  audioVideoDidStart: () =\u003e {\n    console.log('Started');\n  }\n};\n\nmeetingSession.audioVideo.addObserver(observer);\n\nmeetingSession.audioVideo.start();\n```\n\n**Use case 6.** Add an observer to receive session lifecycle events: connecting, start, and stop.\n\n\u003e Note: You can remove an observer by calling `meetingSession.audioVideo.removeObserver(observer)`.\n\u003e In a component-based architecture (such as React, Vue, and Angular), you may need to add an observer\n\u003e when a component is mounted, and remove it when unmounted.\n\n```js\nconst observer = {\n  audioVideoDidStart: () =\u003e {\n    console.log('Started');\n  },\n  audioVideoDidStop: sessionStatus =\u003e {\n    // See the \"Stopping a session\" section for details.\n    console.log('Stopped with a session status code: ', sessionStatus.statusCode());\n  },\n  audioVideoDidStartConnecting: reconnecting =\u003e {\n    if (reconnecting) {\n      // e.g. the WiFi connection is dropped.\n      console.log('Attempting to reconnect');\n    }\n  },\n};\n\nmeetingSession.audioVideo.addObserver(observer);\n```\n\n### Audio\n\n\u003e Note: So far, you've added observers to receive device and session lifecycle events.\n\u003e In the following use cases, you'll use the real-time API methods to send and receive volume indicators and control mute state.\n\n**Use case 7.** Mute and unmute an audio input.\n\n```js\n// Mute\nmeetingSession.audioVideo.realtimeMuteLocalAudio();\n\n// Unmute\nconst unmuted = meetingSession.audioVideo.realtimeUnmuteLocalAudio();\nif (unmuted) {\n  console.log('Other attendees can hear your audio');\n} else {\n  // See the realtimeSetCanUnmuteLocalAudio use case below.\n  console.log('You cannot unmute yourself');\n}\n```\n\n**Use case 8.** To check whether the local microphone is muted, use this method rather than keeping track of your own mute state.\n\n```js\nconst muted = meetingSession.audioVideo.realtimeIsLocalAudioMuted();\nif (muted) {\n  console.log('You are muted');\n} else {\n  console.log('Other attendees can hear your audio');\n}\n```\n\n**Use case 9.** Disable unmute. If you want to prevent users from unmuting themselves (for example during a presentation), use these methods rather than keeping track of your own can-unmute state.\n\n```js\nmeetingSession.audioVideo.realtimeSetCanUnmuteLocalAudio(false);\n\n// Optional: Force mute.\nmeetingSession.audioVideo.realtimeMuteLocalAudio();\n\nconst unmuted = meetingSession.audioVideo.realtimeUnmuteLocalAudio();\nconsole.log(`${unmuted} is false. You cannot unmute yourself`);\n```\n\n**Use case 10.** Subscribe to volume changes of a specific attendee. You can use this to build a real-time volume indicator UI.\n\n```js\nimport { DefaultModality } from 'amazon-chime-sdk-js';\n\n// This is your attendee ID. You can also subscribe to another attendee's ID.\n// See the \"Attendees\" section for an example on how to retrieve other attendee IDs\n// in a session.\nconst presentAttendeeId = meetingSession.configuration.credentials.attendeeId;\n\nmeetingSession.audioVideo.realtimeSubscribeToVolumeIndicator(\n  presentAttendeeId,\n  (attendeeId, volume, muted, signalStrength) =\u003e {\n    const baseAttendeeId = new DefaultModality(attendeeId).base();\n    if (baseAttendeeId !== attendeeId) {\n      // See the \"Screen and content share\" section for details.\n      console.log(`The volume of ${baseAttendeeId}'s content changes`);\n    }\n\n    // A null value for any field means that it has not changed.\n    console.log(`${attendeeId}'s volume data: `, {\n      volume, // a fraction between 0 and 1\n      muted, // a boolean\n      signalStrength, // 0 (no signal), 0.5 (weak), 1 (strong)\n    });\n  }\n);\n```\n\n**Use case 11.** Subscribe to mute or signal strength changes of a specific attendee. You can use this to build UI for only mute or only signal strength changes.\n\n```js\n// This is your attendee ID. You can also subscribe to another attendee's ID.\n// See the \"Attendees\" section for an example on how to retrieve other attendee IDs\n// in a session.\nconst presentAttendeeId = meetingSession.configuration.credentials.attendeeId;\n\n// To track mute changes\nmeetingSession.audioVideo.realtimeSubscribeToVolumeIndicator(\n  presentAttendeeId,\n  (attendeeId, volume, muted, signalStrength) =\u003e {\n    // A null value for volume, muted and signalStrength field means that it has not changed.\n    if (muted === null) {\n      // muted state has not changed, ignore volume and signalStrength changes\n      return;\n    }\n\n    // mute state changed\n    console.log(`${attendeeId}'s mute state changed: `, {\n      muted, // a boolean\n    });\n  }\n);\n\n// To track signal strength changes\nmeetingSession.audioVideo.realtimeSubscribeToVolumeIndicator(\n  presentAttendeeId,\n  (attendeeId, volume, muted, signalStrength) =\u003e {\n    // A null value for volume, muted and signalStrength field means that it has not changed.\n    if (signalStrength === null) {\n      // signalStrength has not changed, ignore volume and muted changes\n      return;\n    }\n\n    // signal strength changed\n    console.log(`${attendeeId}'s signal strength changed: `, {\n      signalStrength, // 0 (no signal), 0.5 (weak), 1 (strong)\n    });\n  }\n);\n```\n\n**Use case 12.** Detect the most active speaker. For example, you can enlarge the active speaker's video element if available.\n\n```js\nimport { DefaultActiveSpeakerPolicy } from 'amazon-chime-sdk-js';\n\nconst activeSpeakerCallback = attendeeIds =\u003e {\n  if (attendeeIds.length) {\n    console.log(`${attendeeIds[0]} is the most active speaker`);\n  }\n};\n\nmeetingSession.audioVideo.subscribeToActiveSpeakerDetector(\n  new DefaultActiveSpeakerPolicy(),\n  activeSpeakerCallback\n);\n```\n\n### Video\n\n\u003e Note: In Chime SDK terms, a video tile is an object containing an attendee ID,\n\u003e a video stream, etc. To view a video in your application, you must bind a tile to a `\u003cvideo\u003e` element.\n\u003e\n\u003e - Make sure you bind a tile to the same video element until the tile is removed.\n\u003e - A local video tile can be identified using `localTile` property.\n\u003e - A tile is created with a new tile ID when the same remote attendee restarts the video.\n\u003e - Media Capture Pipeline relies on the meeting session to get the attendee info. After calling `this.meetingSession.audioVideo.start();`, wait for `audioVideoDidStart` event to be received before calling `startLocalVideoTile`.\n\n**Use case 13.** Start sharing your video. The local video element is flipped horizontally (mirrored mode).\n\n```js\nconst videoElement = /* HTMLVideoElement object e.g. document.getElementById('video-element-id') */;\n\n// Make sure you have chosen your camera. In this use case, you will choose the first device.\nconst videoInputDevices = await meetingSession.audioVideo.listVideoInputDevices();\n\n// The camera LED light will turn on indicating that it is now capturing.\n// See the \"Device\" section for details.\nawait meetingSession.audioVideo.startVideoInput(videoInputDevices[0].deviceId);\n\nconst observer = {\n  // videoTileDidUpdate is called whenever a new tile is created or tileState changes.\n  videoTileDidUpdate: tileState =\u003e {\n    // Ignore a tile without attendee ID and other attendee's tile.\n    if (!tileState.boundAttendeeId || !tileState.localTile) {\n      return;\n    }\n\n    meetingSession.audioVideo.bindVideoElement(tileState.tileId, videoElement);\n  }\n};\n\nmeetingSession.audioVideo.addObserver(observer);\n\nmeetingSession.audioVideo.startLocalVideoTile();\n```\n\n**Use case 14.** Stop sharing your video.\n\n```js\nconst videoElement = /* HTMLVideoElement object e.g. document.getElementById('video-element-id') */;\n\nlet localTileId = null;\nconst observer = {\n  videoTileDidUpdate: tileState =\u003e {\n    // Ignore a tile without attendee ID and other attendee's tile.\n    if (!tileState.boundAttendeeId || !tileState.localTile) {\n      return;\n    }\n\n    // videoTileDidUpdate is also invoked when you call startLocalVideoTile or tileState changes.\n    // The tileState.active can be false in poor Internet connection, when the user paused the video tile, or when the video tile first arrived.\n    console.log(`If you called stopLocalVideoTile, ${tileState.active} is false.`);\n    meetingSession.audioVideo.bindVideoElement(tileState.tileId, videoElement);\n    localTileId = tileState.tileId;\n  },\n  videoTileWasRemoved: tileId =\u003e {\n    if (localTileId === tileId) {\n      console.log(`You called removeLocalVideoTile. videoElement can be bound to another tile.`);\n      localTileId = null;\n    }\n  }\n};\n\nmeetingSession.audioVideo.addObserver(observer);\n\nmeetingSession.audioVideo.stopLocalVideoTile();\n\n// Stop video input. If the previously chosen camera has an LED light on,\n// it will turn off indicating the camera is no longer capturing.\nawait meetingSession.audioVideo.stopVideoInput();\n\n// Optional: You can remove the local tile from the session.\nmeetingSession.audioVideo.removeLocalVideoTile();\n```\n\n**Use case 15.** View one attendee video, e.g. in a 1-on-1 session.\n\n```js\nconst videoElement = /* HTMLVideoElement object e.g. document.getElementById('video-element-id') */;\n\nconst observer = {\n  // videoTileDidUpdate is called whenever a new tile is created or tileState changes.\n  videoTileDidUpdate: tileState =\u003e {\n    // Ignore a tile without attendee ID, a local tile (your video), and a content share.\n    if (!tileState.boundAttendeeId || tileState.localTile || tileState.isContent) {\n      return;\n    }\n\n    meetingSession.audioVideo.bindVideoElement(tileState.tileId, videoElement);\n  }\n};\n\nmeetingSession.audioVideo.addObserver(observer);\n```\n\n**Use case 16.** View up to 25 attendee videos. Assume that you have 25 video elements in your application,\nand that an empty cell means it's taken.\n\n```js\n/*\n  No one is sharing video                    e.g. 9 attendee videos (9 empty cells)\n\n  Next available:                            Next available:\n  videoElements[0]                           videoElements[7]\n  ╔════╦════╦════╦════╦════╗                 ╔════╦════╦════╦════╦════╗\n  ║  0 ║  1 ║  2 ║  3 ║  4 ║                 ║    ║    ║    ║    ║    ║\n  ╠════╬════╬════╬════╬════╣                 ╠════╬════╬════╬════╬════╣\n  ║  5 ║  6 ║  7 ║  8 ║  9 ║                 ║    ║    ║  7 ║  8 ║    ║\n  ╠════╬════╬════╬════╬════╣                 ╠════╬════╬════╬════╬════╣\n  ║ 10 ║ 11 ║ 12 ║ 13 ║ 14 ║                 ║ 10 ║    ║ 12 ║ 13 ║ 14 ║\n  ╠════╬════╬════╬════╬════╣                 ╠════╬════╬════╬════╬════╣\n  ║ 15 ║ 16 ║ 17 ║ 18 ║ 19 ║                 ║ 15 ║ 16 ║ 17 ║ 18 ║ 19 ║\n  ╠════╬════╬════╬════╬════╣                 ╠════╬════╬════╬════╬════╣\n  ║ 20 ║ 21 ║ 22 ║ 23 ║ 24 ║                 ║ 20 ║ 21 ║ 22 ║ 23 ║ 24 ║\n  ╚════╩════╩════╩════╩════╝                 ╚════╩════╩════╩════╩════╝\n */\nconst videoElements = [\n  /* an array of 25 HTMLVideoElement objects in your application */\n];\n\n// index-tileId pairs\nconst indexMap = {};\n\nconst acquireVideoElement = tileId =\u003e {\n  // Return the same video element if already bound.\n  for (let i = 0; i \u003c 25; i += 1) {\n    if (indexMap[i] === tileId) {\n      return videoElements[i];\n    }\n  }\n  // Return the next available video element.\n  for (let i = 0; i \u003c 25; i += 1) {\n    if (!indexMap.hasOwnProperty(i)) {\n      indexMap[i] = tileId;\n      return videoElements[i];\n    }\n  }\n  throw new Error('no video element is available');\n};\n\nconst releaseVideoElement = tileId =\u003e {\n  for (let i = 0; i \u003c 25; i += 1) {\n    if (indexMap[i] === tileId) {\n      delete indexMap[i];\n      return;\n    }\n  }\n};\n\nconst observer = {\n  // videoTileDidUpdate is called whenever a new tile is created or tileState changes.\n  videoTileDidUpdate: tileState =\u003e {\n    // Ignore a tile without attendee ID, a local tile (your video), and a content share.\n    if (!tileState.boundAttendeeId || tileState.localTile || tileState.isContent) {\n      return;\n    }\n\n    meetingSession.audioVideo.bindVideoElement(\n      tileState.tileId,\n      acquireVideoElement(tileState.tileId)\n    );\n  },\n  videoTileWasRemoved: tileId =\u003e {\n    releaseVideoElement(tileId);\n  },\n};\n\nmeetingSession.audioVideo.addObserver(observer);\n```\n\n**Use case 17.** Add an observer to know all the remote video sources when changed.\n\n```js\nconst observer = {\n  remoteVideoSourcesDidChange: videoSources =\u003e {\n    videoSources.forEach(videoSource =\u003e {\n      const { attendee } = videoSource;\n      console.log(\n        `An attendee (${attendee.attendeeId} ${attendee.externalUserId}) is sending video`\n      );\n    });\n  },\n};\n\nmeetingSession.audioVideo.addObserver(observer);\n```\n\nYou can also call below method to know all the remote video sources:\n\n\u003e Note: `getRemoteVideoSources` method is different from `getAllRemoteVideoTiles`,\n\u003e `getRemoteVideoSources` returns all the remote video sources that are available to be viewed,\n\u003e while `getAllRemoteVideoTiles` returns the ones that are actually being seen.\n\n```js\nconst videoSources = meetingSession.audioVideo.getRemoteVideoSources();\nvideoSources.forEach(videoSource =\u003e {\n  const { attendee } = videoSource;\n  console.log(`An attendee (${attendee.attendeeId} ${attendee.externalUserId}) is sending video`);\n});\n```\n\n### Screen and content share\n\n\u003e Note: When you or other attendees share content (a screen capture, a video file, or any other MediaStream object),\n\u003e the content attendee (attendee-id#content) joins the session and shares content as if a regular attendee shares a video.\n\u003e\n\u003e For example, your attendee ID is \"my-id\". When you call `meetingSession.audioVideo.startContentShare`,\n\u003e the content attendee \"my-id#content\" will join the session and share your content.\n\n**Use case 18.** Start sharing your screen.\n\n```js\nimport { DefaultModality } from 'amazon-chime-sdk-js';\n\nconst observer = {\n  videoTileDidUpdate: tileState =\u003e {\n    // Ignore a tile without attendee ID and videos.\n    if (!tileState.boundAttendeeId || !tileState.isContent) {\n      return;\n    }\n\n    const yourAttendeeId = meetingSession.configuration.credentials.attendeeId;\n\n    // tileState.boundAttendeeId is formatted as \"attendee-id#content\".\n    const boundAttendeeId = tileState.boundAttendeeId;\n\n    // Get the attendee ID from \"attendee-id#content\".\n    const baseAttendeeId = new DefaultModality(boundAttendeeId).base();\n    if (baseAttendeeId === yourAttendeeId) {\n      console.log('You called startContentShareFromScreenCapture');\n    }\n  },\n  contentShareDidStart: () =\u003e {\n    console.log('Screen share started');\n  },\n  contentShareDidStop: () =\u003e {\n    // Chime SDK allows 2 simultaneous content shares per meeting.\n    // This method will be invoked if two attendees are already sharing content\n    // when you call startContentShareFromScreenCapture or startContentShare.\n    console.log('Screen share stopped');\n  },\n};\n\nmeetingSession.audioVideo.addContentShareObserver(observer);\nmeetingSession.audioVideo.addObserver(observer);\n\n// A browser will prompt the user to choose the screen.\nconst contentShareStream = await meetingSession.audioVideo.startContentShareFromScreenCapture();\n```\n\nIf you want to display the content share stream for the sharer, you can bind the returned content share stream to a\nvideo element using `connectVideoStreamToVideoElement` from DefaultVideoTile.\n\n```js\nDefaultVideoTile.connectVideoStreamToVideoElement(contentShareStream, videoElement, false);\n```\n\n**Use case 19.** Start sharing your screen in an environment that does not support a screen picker dialog. e.g. Electron\n\n```js\nconst sourceId = /* Window or screen ID e.g. the ID of a DesktopCapturerSource object in Electron */;\n\nawait meetingSession.audioVideo.startContentShareFromScreenCapture(sourceId);\n```\n\n**Use case 20.** Start streaming your video file from an `\u003cinput\u003e` element of type `file`.\n\n```js\nconst videoElement = /* HTMLVideoElement object e.g. document.getElementById('video-element-id') */;\nconst inputElement = /* HTMLInputElement object e.g. document.getElementById('input-element-id') */;\n\ninputElement.addEventListener('change', async () =\u003e {\n  const file = inputElement.files[0];\n  const url = URL.createObjectURL(file);\n  videoElement.src = url;\n  await videoElement.play();\n\n  const mediaStream = videoElement.captureStream(); /* use mozCaptureStream for Firefox e.g. videoElement\n.mozCaptureStream(); */\n  await meetingSession.audioVideo.startContentShare(mediaStream);\n  inputElement.value = '';\n});\n```\n\n**Use case 21.** Stop sharing your screen or content.\n\n```js\nconst observer = {\n  contentShareDidStop: () =\u003e {\n    console.log('Content share stopped');\n  },\n};\n\nmeetingSession.audioVideo.addContentShareObserver(observer);\n\nawait meetingSession.audioVideo.stopContentShare();\n```\n\n**Use case 22.** View up to 2 attendee content or screens. Chime SDK allows 2 simultaneous content shares per meeting.\n\n```js\nimport { DefaultModality } from 'amazon-chime-sdk-js';\n\nconst videoElementStack = [\n  /* an array of 2 HTMLVideoElement objects in your application */\n];\n\n// tileId-videoElement map\nconst tileMap = {};\n\nconst observer = {\n  videoTileDidUpdate: tileState =\u003e {\n    // Ignore a tile without attendee ID and videos.\n    if (!tileState.boundAttendeeId || !tileState.isContent) {\n      return;\n    }\n\n    const yourAttendeeId = meetingSession.configuration.credentials.attendeeId;\n\n    // tileState.boundAttendeeId is formatted as \"attendee-id#content\".\n    const boundAttendeeId = tileState.boundAttendeeId;\n\n    // Get the attendee ID from \"attendee-id#content\".\n    const baseAttendeeId = new DefaultModality(boundAttendeeId).base();\n    if (baseAttendeeId !== yourAttendeeId) {\n      console.log(`${baseAttendeeId} is sharing screen now`);\n\n      // Get the already bound video element if available, or use an unbound element.\n      const videoElement = tileMap[tileState.tileId] || videoElementStack.pop();\n      if (videoElement) {\n        tileMap[tileState.tileId] = videoElement;\n        meetingSession.audioVideo.bindVideoElement(tileState.tileId, videoElement);\n      } else {\n        console.log('No video element is available');\n      }\n    }\n  },\n  videoTileWasRemoved: tileId =\u003e {\n    // Release the unused video element.\n    const videoElement = tileMap[tileId];\n    if (videoElement) {\n      videoElementStack.push(videoElement);\n      delete tileMap[tileId];\n    }\n  },\n};\n\nmeetingSession.audioVideo.addObserver(observer);\n```\n\n### Attendees\n\n**Use case 23.** Subscribe to attendee presence changes. When an attendee joins or leaves a session,\nthe callback receives `presentAttendeeId` and `present` (a boolean).\n\n```js\nconst attendeePresenceSet = new Set();\nconst callback = (presentAttendeeId, present) =\u003e {\n  console.log(`Attendee ID: ${presentAttendeeId} Present: ${present}`);\n  if (present) {\n    attendeePresenceSet.add(presentAttendeeId);\n  } else {\n    attendeePresenceSet.delete(presentAttendeeId);\n  }\n};\n\nmeetingSession.audioVideo.realtimeSubscribeToAttendeeIdPresence(callback);\n```\n\n**Use case 24.** Create a simple roster by subscribing to attendee presence and volume changes.\n\n```js\nimport { DefaultModality } from 'amazon-chime-sdk-js';\n\nconst roster = {};\n\nmeetingSession.audioVideo.realtimeSubscribeToAttendeeIdPresence((presentAttendeeId, present) =\u003e {\n  if (!present) {\n    delete roster[presentAttendeeId];\n    return;\n  }\n\n  meetingSession.audioVideo.realtimeSubscribeToVolumeIndicator(\n    presentAttendeeId,\n    (attendeeId, volume, muted, signalStrength) =\u003e {\n      const baseAttendeeId = new DefaultModality(attendeeId).base();\n      if (baseAttendeeId !== attendeeId) {\n        // Optional: Do not include the content attendee (attendee-id#content) in the roster.\n        // See the \"Screen and content share\" section for details.\n        return;\n      }\n\n      if (roster.hasOwnProperty(attendeeId)) {\n        // A null value for any field means that it has not changed.\n        roster[attendeeId].volume = volume; // a fraction between 0 and 1\n        roster[attendeeId].muted = muted; // A boolean\n        roster[attendeeId].signalStrength = signalStrength; // 0 (no signal), 0.5 (weak), 1 (strong)\n      } else {\n        // Add an attendee.\n        // Optional: You can fetch more data, such as attendee name,\n        // from your server application and set them here.\n        roster[attendeeId] = {\n          attendeeId,\n          volume,\n          muted,\n          signalStrength,\n        };\n      }\n    }\n  );\n});\n```\n\n### Monitoring and alerts\n\n**Use case 25.** Add an observer to receive WebRTC metrics processed by Chime SDK such as bitrate, packet loss, and bandwidth. See `AudioVideoObserver` for more available metrics.\n\n```js\nconst observer = {\n  metricsDidReceive: clientMetricReport =\u003e {\n    const metricReport = clientMetricReport.getObservableMetrics();\n\n    const {\n      videoPacketSentPerSecond,\n      videoUpstreamBitrate,\n      availableOutgoingBitrate,\n      availableIncomingBitrate,\n      audioSpeakerDelayMs,\n    } = metricReport;\n\n    console.log(\n      `Sending video bitrate in kilobits per second: ${\n        videoUpstreamBitrate / 1000\n      } and sending packets per second: ${videoPacketSentPerSecond}`\n    );\n    console.log(\n      `Sending bandwidth is ${availableOutgoingBitrate / 1000}, and receiving bandwidth is ${\n        availableIncomingBitrate / 1000\n      }`\n    );\n    console.log(`Audio speaker delay is ${audioSpeakerDelayMs}`);\n  },\n};\n\nmeetingSession.audioVideo.addObserver(observer);\n```\n\n**Use case 26.** Add an observer to receive alerts. You can use these alerts to notify users of connection problems.\n\n```js\nconst observer = {\n  connectionDidBecomePoor: () =\u003e {\n    console.log('Your connection is poor');\n  },\n  connectionDidSuggestStopVideo: () =\u003e {\n    console.log('Recommend turning off your video');\n  },\n  videoSendDidBecomeUnavailable: () =\u003e {\n    // Chime SDK allows a total of 25 simultaneous videos per meeting.\n    // If you try to share more video, this method will be called.\n    // See videoAvailabilityDidChange below to find out when it becomes available.\n    console.log('You cannot share your video');\n  },\n  videoAvailabilityDidChange: videoAvailability =\u003e {\n    // canStartLocalVideo will also be true if you are already sharing your video.\n    if (videoAvailability.canStartLocalVideo) {\n      console.log('You can share your video');\n    } else {\n      console.log('You cannot share your video');\n    }\n  },\n};\n\nmeetingSession.audioVideo.addObserver(observer);\n```\n\n### Stopping a session\n\n**Use case 27.** Leave a session.\n\n```js\nimport { MeetingSessionStatusCode } from 'amazon-chime-sdk-js';\n\nconst observer = {\n  audioVideoDidStop: sessionStatus =\u003e {\n    const sessionStatusCode = sessionStatus.statusCode();\n    if (sessionStatusCode === MeetingSessionStatusCode.Left) {\n      /*\n       * You called meetingSession.audioVideo.stop().\n       */\n      console.log('You left the session');\n    } else {\n      console.log('Stopped with a session status code: ', sessionStatusCode);\n    }\n  },\n};\n\nmeetingSession.audioVideo.addObserver(observer);\n\nmeetingSession.audioVideo.stop();\n```\n\n**Use case 28.** Add an observer to get notified when a session has ended.\n\n```js\nimport { MeetingSessionStatusCode } from 'amazon-chime-sdk-js';\n\nconst observer = {\n  audioVideoDidStop: sessionStatus =\u003e {\n    const sessionStatusCode = sessionStatus.statusCode();\n    if (sessionStatusCode === MeetingSessionStatusCode.MeetingEnded) {\n      /*\n        - You (or someone else) have called the DeleteMeeting API action in your server application.\n        - You attempted to join a deleted meeting.\n        - No audio connections are present in the meeting for more than five minutes.\n        - The meeting time exceeds 24 hours.\n        See https://docs.aws.amazon.com/chime-sdk/latest/dg/mtgs-sdk-mtgs.html for details.\n      */\n      console.log('The session has ended');\n    } else {\n      console.log('Stopped with a session status code: ', sessionStatusCode);\n    }\n  },\n};\n\nmeetingSession.audioVideo.addObserver(observer);\n```\n\n### Meeting readiness checker\n\n**Use case 29.** Initialize the meeting readiness checker.\n\n```js\nimport { DefaultMeetingReadinessChecker } from 'amazon-chime-sdk-js';\n\n// In the usage examples below, you will use this meetingReadinessChecker object.\nconst meetingReadinessChecker = new DefaultMeetingReadinessChecker(logger, meetingSession);\n```\n\n**Use case 30.** Use the meeting readiness checker to perform local checks.\n\n```js\nimport { CheckAudioInputFeedback } from 'amazon-chime-sdk-js';\n\nconst audioInputDeviceInfo = /* An array item from meetingSession.audioVideo.listAudioInputDevices */;\nconst audioInputFeedback = await meetingReadinessChecker.checkAudioInput(audioInputDeviceInfo.deviceId);\n\nswitch (audioInputFeedback) {\n  case CheckAudioInputFeedback.Succeeded:\n    console.log('Succeeded');\n    break;\n  case CheckAudioInputFeedback.Failed:\n    console.log('Failed');\n    break;\n  case CheckAudioInputFeedback.PermissionDenied:\n    console.log('Permission denied');\n    break;\n}\n```\n\n**Use case 31.** Use the meeting readiness checker to perform end-to-end checks, e.g. audio, video, and content share.\n\n```js\nimport {\n  CheckAudioConnectivityFeedback,\n  CheckContentShareConnectivityFeedback,\n  CheckVideoConnectivityFeedback\n} from 'amazon-chime-sdk-js';\n\n// Tests audio connection\nconst audioDeviceInfo = /* An array item from meetingSession.audioVideo.listAudioInputDevices */;\nconst audioFeedback = await meetingReadinessChecker.checkAudioConnectivity(audioDeviceInfo.deviceId);\nconsole.log(`Feedback result: ${CheckAudioConnectivityFeedback[audioFeedback]}`);\n\n// Test video connection\nconst videoInputInfo = /* An array item from meetingSession.audioVideo.listVideoInputDevices */;\nconst videoFeedback = await meetingReadinessChecker.checkVideoConnectivity(videoInputInfo.deviceId);\nconsole.log(`Feedback result: ${CheckVideoConnectivityFeedback[videoFeedback]}`);\n\n// Tests content share connectivity\nconst contentShareFeedback = await meetingReadinessChecker.checkContentShareConnectivity();\nconsole.log(`Feedback result: ${CheckContentShareConnectivityFeedback[contentShareFeedback]}`);\n```\n\n**Use case 32.** Use the meeting readiness checker to perform network checks, e.g. TCP and UDP.\n\n```js\nimport {\n  CheckNetworkUDPConnectivityFeedback,\n  CheckNetworkTCPConnectivityFeedback,\n} from 'amazon-chime-sdk-js';\n\n// Tests for UDP network connectivity\nconst networkUDPFeedback = await meetingReadinessChecker.checkNetworkUDPConnectivity();\nconsole.log(`Feedback result: ${CheckNetworkUDPConnectivityFeedback[networkUDPFeedback]}`);\n\n// Tests for TCP network connectivity\nconst networkTCPFeedback = await meetingReadinessChecker.checkNetworkTCPConnectivity();\nconsole.log(`Feedback result: ${CheckNetworkTCPConnectivityFeedback[networkTCPFeedback]}`);\n```\n\n### Selecting an audio profile\n\n**Use case 32.** Set the audio quality of the main audio input to optimize for speech or music:\n\nUse the following setting to optimize the audio bitrate of the main audio input for fullband speech with a mono channel:\n\n```js\nmeetingSession.audioVideo.setAudioProfile(AudioProfile.fullbandSpeechMono());\n```\n\n**Use case 33.** Set the audio quality of content share audio to optimize for speech or music:\n\nUse the following setting to optimize the audio bitrate of content share audio for fullband music with a mono channel:\n\n```js\nmeetingSession.audioVideo.setContentAudioProfile(AudioProfile.fullbandMusicMono());\n```\n\n**Use case 34.** Sending and receiving stereo audio\n\nYou can send an audio stream with stereo channels either as content or through the main audio input.\n\nUse the following setting to optimize the main audio input and output for an audio stream with stereo channels:\n\n```js\nmeetingSession.audioVideo.setAudioProfile(AudioProfile.fullbandMusicStereo());\n```\n\nUse the following setting to optimize the content share audio for an audio stream with stereo channels:\n\n```js\nmeetingSession.audioVideo.setContentAudioProfile(AudioProfile.fullbandMusicStereo());\n```\n\n**Use case 35.** Redundant Audio\n\nStarting from version 3.18.2, the SDK starts sending redundant audio data to our servers on detecting packet loss\nto help reduce its effect on audio quality. Redundant audio packets are only sent out for packets containing active\naudio, ie, speech or music. This may increase the bandwidth consumed by audio to up to 3 times the normal amount\ndepending on the amount of packet loss detected. The SDK will automatically stop sending redundant data if it hasn't\ndetected any packet loss for 5 minutes.\n\nThis feature requires `blob:` to be in your content security policy under the `worker-src` directive.\nWithout this, we will not be able to send out redundant audio data.\n\nThis feature is not supported on Firefox at the moment.\nWe were able to successfully send redundant audio from safari 16.1 onwards. 15.6.1 advertises support as well but is untested.\nChrome advertises support for redundant audio from version M96.\n\nTo disable this feature for attendee audio, you can use the following:\n\n```js\nmeetingSession.audioVideo.setAudioProfile(new AudioProfile(null, false));\n```\n\nIf using bitrate optimization and you want to disable audio redundancy you can use the below line.\nIn the example below, we only use fullbandSpeechMono but you can use fullbandMusicMono and fullbandMusicStereo\ndepending on your use case.\n\n```js\nmeetingSession.audioVideo.setAudioProfile(AudioProfile.fullbandSpeechMono(false));\n```\n\nTo disable this feature for content share audio, you can use any one of the following:\n\n```js\nmeetingSession.audioVideo.setContentAudioProfile(new AudioProfile(null, false));\n```\n\nIf using bitrate optimization and you want to disable audio redundancy you can use the below line.\nIn the example below, we only use fullbandSpeechMono but you can use fullbandMusicMono and fullbandMusicStereo\ndepending on your use case.\n\n```js\nmeetingSession.audioVideo.setContentAudioProfile(AudioProfile.fullbandSpeechMono(false));\n```\n\nWhile there is an option to disable the feature, we recommend keeping it enabled for improved audio quality.\nOne possible reason to disable it might be if your customers have very strict bandwidth limitations.\n\n### Starting a messaging session\n\n**Use case 36.** Setup an observer to receive events: connecting, start, stop and receive message; and\nstart a messaging session.\n\n\u003e Note: You can remove an observer by calling `messagingSession.removeObserver(observer)`.\n\u003e In a component-based architecture (such as React, Vue, and Angular), you may need to add an observer\n\u003e when a component is mounted, and remove it when unmounted.\n\n```js\nconst observer = {\n  messagingSessionDidStart: () =\u003e {\n    console.log('Session started');\n  },\n  messagingSessionDidStartConnecting: reconnecting =\u003e {\n    if (reconnecting) {\n      console.log('Start reconnecting');\n    } else {\n      console.log('Start connecting');\n    }\n  },\n  messagingSessionDidStop: event =\u003e {\n    console.log(`Closed: ${event.code} ${event.reason}`);\n  },\n  messagingSessionDidReceiveMessage: message =\u003e {\n    console.log(`Receive message type ${message.type}`);\n  },\n};\n\nmessagingSession.addObserver(observer);\nawait messagingSession.start();\n```\n\n### Providing application metadata\n\nAmazon Chime SDK for JavaScript allows builders to provide application metadata in the meeting session configuration. This field is optional. Amazon Chime uses application metadata to analyze meeting health trends or identify common failures to improve your meeting experience.\n\n\u003e ⚠️ Do not pass any Personal Identifiable Information (PII).\n\n**Use case 37.** Provide application metadata to the meeting session configuration.\n\n```js\nimport { MeetingSessionConfiguration, ApplicationMetadata } from 'amazon-chime-sdk-js';\n\nconst createMeetingResponse = // CreateMeeting API response.\nconst createAttendeeResponse = // CreateAttendee API response.\nconst meetingSessionConfiguration = new MeetingSessionConfiguration(\n  createMeetingResponse,\n  createAttendeeResponse\n);\n\nmeetingSessionConfiguration.applicationMetadata = ApplicationMetadata.create({\n  appName: 'AppName',\n  appVersion: '1.0.0'\n});\n```\n\n#### Accepted application metadata constraints\n\n```js\n// The appName must be between 1-32 characters.\n// The appName must satisfy following regular expression:\n// /^[a-zA-Z0-9]+[a-zA-Z0-9_-]*[a-zA-Z0-9]+$/g\nappName: string;\n\n// The appVersion must be between 1-32 characters.\n// The appVersion must follow the Semantic Versioning format.\n// https://semver.org/\nappVersion: string;\n```\n\n## Notice\n\nThe use of Amazon Voice Focus. background blur, and background replacement via this SDK involves the downloading and execution of code at runtime by end users.\n\nThe use of Amazon Voice Focus. background blur, and background replacement runtime code is subject to additional notices. See [this Amazon Voice Focus NOTICES file](https://static.sdkassets.chime.aws/workers/NOTICES.txt), [background blur and background replacement NOTICES file](https://static.sdkassets.chime.aws/bgblur/workers/NOTICES.txt), and [background blur 2.0 and background replacement 2.0 NOTICES file](https://static.sdkassets.chime.aws/ml_media_fx/otherassets/NOTICES.txt) for details. You agree to make these additional notices available to all end users who use Amazon Voice Focus, background blur and background replacement, background blur 2.0 and background replacement 2.0, runtime code via this SDK.\n\nThe browser demo applications in the [demos directory](https://github.com/aws/amazon-chime-sdk-js/tree/main/demos) use [TensorFlow.js](https://github.com/tensorflow/tfjs) and pre-trained [TensorFlow.js models](https://github.com/tensorflow/tfjs-models) for image segmentation. Use of these third party models involves downloading and execution of code at runtime from [jsDelivr](https://www.jsdelivr.com/) by end user browsers. For the jsDelivr Acceptable Use Policy, please visit this [link](https://www.jsdelivr.com/terms/acceptable-use-policy-jsdelivr-net).\n\nThe use of TensorFlow runtime code referenced above may be subject to additional license requirements. See the licenses page for TensorFlow.js [here](https://github.com/tensorflow/tfjs/blob/master/LICENSE) and TensorFlow.js models [here](https://github.com/tensorflow/tfjs-models/blob/master/LICENSE) for details.\n\nYou and your end users are responsible for all Content (including any images) uploaded for use with background replacement, and must ensure that such Content does not violate the law, infringe or misappropriate the rights of any third party, or otherwise violate a material term of your agreement with Amazon (including the documentation, the AWS Service Terms, or the Acceptable Use Policy).\n\nLive transcription using the Amazon Chime SDK for JavaScript is powered by Amazon Transcribe. Use of Amazon Transcribe is subject to the [AWS Service Terms](https://aws.amazon.com/service-terms/), including the terms specific to the AWS Machine Learning and Artificial Intelligence Services. Standard charges for Amazon Transcribe and Amazon Transcribe Medical will apply.\n\nYou and your end users understand that recording Amazon Chime SDK meetings may be subject to laws or regulations regarding the recording of electronic communications. It is your and your end users’ responsibility to comply with all applicable laws regarding the recordings, including properly notifying all participants in a recorded session, or communication that the session or communication is being recorded, and obtain their consent.\n\n---\n\nCopyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faws%2Famazon-chime-sdk-js","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Faws%2Famazon-chime-sdk-js","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faws%2Famazon-chime-sdk-js/lists"}