When you use the Wowza Flowplayer in you React Native applications, you can incorporate advertisements to monetize content and engage your viewers.
The React Native SDK supports IMA3-based Video Ad Serving Template (VAST) and Video Multiple Ad Playlist (VMAP) ad integrations. It also accommodates popular third-party software-building tools like Google's Interactive Media Ads (IMA) SDK. With these technologies, you can customize your viewer's ad experiences and manage ad schedules and breaks within the player.
For more information about listening to ad events and handling advertising errors, see the following pages. You can also see our demo for examples of how to handle ad-related events.
To configure advertisements for use with the player in your React Native application, you must meet the following prerequisites:
- You must complete the Get started and Set up the player guides to configure your local environment.
- You must have access to Wowza Video for the advertising configuration.
- You must generate a player token in Wowza Video and set up the player to use this token.
With the React Native SDK, you can incorporate ads into the player display for your React Native applications. You can only load Wowza Video media files, such as videos or live streams, and attach ad schedules to them. This advertising feature for the React Native SDK is not available for remote files.
All ad schedule configurations must be completed in the Wowza Video platform. The next two sections describe how to set up ads for your video and live stream content when using the React Native SDK.
To configure your player with the React Native SDK and define how it loads ads for video content from Wowza Video, use the following steps.
For example, if you take the App.tsx file in our demo application, you can use the mediaId and playerId values from the previous steps as follows:
const MEDIA_WOWZA: FlowplayerMedia = {
mediaId: "5bf95d0e-edb8-4fb8-8b4c-65afa6e2a8ee",
playerId: "854eb3d3-ff01-43e6-80ad-97192ea68641",
};To configure your player with the React Native SDK and define how it loads ads for live stream content from Wowza Video, use these steps. For live streams, you can only include pre-roll advertisements.
For example, if you take the App.tsx file in our demo application and this example URL https://app.wowza.com/livestreams/zxxtsj2b, you can use these values for the mediaId and playerId when working with the React Native SDK:
const MEDIA_WOWZA: FlowplayerMedia = {
mediaId: "zxxtsj2b",
playerId: "513852a4-18c8-474a-88c7-dc54d4f03555",
};