A Media Extension is a web-compliant JavaScript application executed within a Twilio Live MediaProcessor. Media Extensions perform specific actions commonly used in a Twilio Live streaming solution such as composing a Twilio Video Room's Participants.
Twilio hosts two Media Extensions: a Video Composer and an Audio Mixer.
You can also create your own Custom Composer Media Extension to customize the look of your livestream. This repository contains examples of Media Extension code.
- Node.js v16+
- NPM v7+ (upgrade from NPM 6 with
npm install --global npm)
To use a Twilio Media Extension, specify the Media Extension name your application would like to use when creating a MediaProcessor and any additional extension context. The following snippet demonstrates how to use a custom Video Composer to compose a Room's Participants.
curl -X POST 'https://media.twilio.com/v1/MediaProcessors' \
-u 'SKXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX:your_api_key_secret' \
-d 'Extension="https://video-composer-5226-dev.twil.io"' \
-d 'ExtensionContext={"room": {"name": "RM123"}, "outputs": ["VJXXX"]}'Twilio Media Extensions are selected and configured via the MediaProcessor ExtensionContext parameter with a JSON object. The snippet below expands on the previous example by describing the object's structure.
{
/**
* This object contains any extension parameters required to perform
* a media processing action. Reference each Twilio Media Extension's
* documentation to understand what parameters are required or optional.
*/
// Room Parameters (required)
"room": {
"name": "RM123", // required
},
// Extension Identity (optional)
"identity": "my-video-composer",
// Media destinations (required)
"outputs": ["VJXXX"]
}This project contains examples of Twilio Media Extensions. While each Extension performs specific media actions, the project is structured as a monorepo to enable the following:
- Sharing code between Extensions (ex. Connecting to a Room)
- Providing unified documentation
This repository contains the following sample Media Extension applications:
- Interview Layout: A sample application written in pure JavaScript. Displays up to three Participants' video in a grid.
- Video Composer: Code for Twilio's Video Composer Media Extension.
The project uses npm workspaces to build each project. To get started, run npm install at the top-level project directory and reference each Extension's respective documentation for more details.