This guide explains how to share audio and video content such as screen capture or media files in a meeting. This guide assumes you have already created a meeting and added attendees to the meeting (see Setup section in our README for more information).

Content share methods are accessed from the audio-video facade belonging to the meeting session.

Content share is not supported on mobile OS like iOS and Android. Please refer to the system requirements table for more information: Amazon Chime SDK system requirements

• Content Share
  • Share content
  • View the content share
  • Pause and unpause the content share
  • Stop the content share
  • Receive content share events
  • Apply video processing to content share

Share content

Using the audio-video facade, start sharing content by calling startContentShare and provide a MediaStream:

const meetingSession = // reference to MeetingSession
await meetingSession.audioVideo.startContentShare(mediaStream);

To start a screen capture, call the convenience method startContentShareFromScreenCapture.

When calling from a browser, leave sourceId empty. This will launch the browser's native screen capture picker.

const meetingSession = // reference to MeetingSession
await meetingSession.audioVideo.startContentShareFromScreenCapture();

When calling from Electron, build a screen capture picker into your application and pass the sourceId of the chosen screen capture to the method. See the desktop-capture sample application for more information.

const meetingSession = // reference to MeetingSession
const sourceId = // get this from your custom Electron screen capture picker
await meetingSession. audioVideo.startContentShareFromScreenCapture(sourceId);

View the content share

Content shares are treated as regular audio-video attendees. The attendee ID of a content share has a suffix of #content. You receive real-time attendee presence and volume indicator callbacks for content audio and video tile updates for content video.

To view the content share:

• Create an instance of AudioVideoObserver that implements videoTileDidUpdate to receive callbacks when the video tile is created and updated
• Add the observer with addObserver method to receive events.
• In videoTileDidUpdate, bind the video tile to a video element in your app:

const meetingSession = // reference to MeetingSession
const tileState = // reference to tileState parameter in videoTileDidUpdate
const videoElement = document.getElementById('video-element-id');
meetingSession.audioVideo.bindVideoElement(tileState.tileId , videoElement);

Use the isContent property of the TileState to check if the video tile is a content share, and any add special logic you need to handle the content share.

You can also use the Modality class to determine that an attendee ID is a content share:

if (new DefaultModality(attendeeId).hasModality(DefaultModality.MODALITY_CONTENT)) {
  // ...special handling for content share...
}

Pause and unpause the content share

To pause and unpause the content share, call pauseContentShare and unpauseContentShare.

const meetingSession = // reference to MeetingSession
await meetingSession.audioVideo.pauseContentShare();

const meetingSession = // reference to MeetingSession
await meetingSession.audioVideo.unpauseContentShare();

Stop the content share

To stop the content share, call stopContentShare.

const meetingSession = // reference to MeetingSession
await meetingSession.audioVideo.stopContentShare();

Receive content share events

Implement methods from ContentShareObserver and add an instance of the observer using addContentShareObserver to receive events.

Apply video processing to content share

See this section in the Video Processing guide for more information.

Give feedback on this guide