react-native-video/docs/pages/component/ads.md
Guy Haguy 703ed43996
feat: add ads localize (#4113)
* add prop adLanguage; add docs

* add native code ios&android for adLanguage props

* add missing function to adsLoader and imafactory

* Update docs/pages/component/ads.md

Language correction

Co-authored-by: Olivier Bouillet <62574056+freeboub@users.noreply.github.com>

---------

Co-authored-by: Guy <guyha@reshet.tv>
Co-authored-by: Olivier Bouillet <62574056+freeboub@users.noreply.github.com>
2024-08-29 12:30:05 +02:00

1.7 KiB

Ads

IMA SDK

react-native-video has built-in support for Google IMA SDK for Android and iOS. To enable it please refer to installation section

Usage

To use AVOD, you need to pass adTagUrl prop to Video component. adTagUrl is a VAST uri.

Example:

adTagUrl="https://pubads.g.doubleclick.net/gampad/ads?iu=/21775744923/external/vmap_ad_samples&sz=640x480&cust_params=sample_ar%3Dpremidpostoptimizedpodbumper&ciu_szs=300x250&gdfp_req=1&ad_rule=1&output=vmap&unviewed_position_start=1&env=vp&impl=s&cmsid=496&vid=short_onecue&correlator="

NOTE: Video ads cannot start when you are using the PIP on iOS (more info available at Google IMA SDK Docs). If you are using custom controls, you must hide your PIP button when you receive the STARTED event from onReceiveAdEvent and show it again when you receive the ALL_ADS_COMPLETED event.

Events

To receive events from IMA SDK, you need to pass onReceiveAdEvent prop to Video component. List of events, you can find here

Example:

...
onReceiveAdEvent={event => console.log(event)}
...

Localization

To change the language of the IMA SDK, you need to pass adLanguage prop to Video component. List of supported languages, you can find here

By default, ios will use system language and android will use en

Example:

...
adLanguage="fr"
...