Add dependencies
Update the package.json file in your app:-
In the dependencies section, add the following entry:
@amazon-devices/react-native-w3cmedia package.
The ~2.1.80 version specifier allows automatic updates to patch versions (for example, 2.1.81, 2.1.82) while maintaining compatibility.
-
Open a terminal window and navigate to your app folder. Use npm to install the packages in your app.
Configure Babel
To make sure that your app is compatible with the W3C Media Player integration, update your babel.config.js file. Without this, your app might encounter a “ReferenceError: Property 'React' doesn't exist” exception at runtime.
Update the babel.config.js file with the following changes.
Add permissions
You must add the necessary permissions to the manifest.toml file for your app. This makes sure that the app has the required permissions to use the W3C Media Player functionality:- Media metrics service: Enables playback analytics and monitoring
- Media server: Provides core media playback capabilities
- Player session service: Manages media playback sessions
- Accessibility privilege: Required for closed captions and subtitles
- Audio services: Handle audio streaming, control, and system sounds
[wants] section.
wants grant the app the permissions required for the media playback. For additional information about the manifest file, see Vega App Manifest File Overview.
Configuration differences between a templated app and a media app
The following is an example delta of the configuration between a fresh template app and one that is properly configured as a media app.Next steps
After you understand your specific use case requirements, see Selecting Playback Mode.Related topics
- W3C Media integration with Vega Media Controls
- Implement Headless JavaScript Playback
- Media Player API
