L'API WebView pour les annonces permet de monétiser les annonces dans les applications à l'aide de WebViewController
.
Si vous affichez du contenu Web qui implémente des annonces avec le code AdSense ou Google Publisher Tag dans votre application via WebViewController
, vous devez utiliser cette API pour activer la monétisation des annonces. Pour en savoir plus, consultez les
Règles AdSense et Ad Manager.
- Monétiser des annonces en envoyant des demandes d'annonces avec le SDK Google Mobile Ads
Vous pouvez monétiser votre application en envoyant des demandes d'annonces à Ad Manager avec le SDK Google Mobile Ads en implémentant des formats d'annonces pour les applications mobiles.
- Monétiser des annonces à l'aide de l'API WebView
Si votre application utilise
WebViewController
pour afficher du contenu Web qui diffuse des annonces depuis Ad Manager ou AdSense, utilisez l'API WebView pour les annonces afin d'enregistrer des objetsWebViewController
avec le SDK Google Mobile Ads. Le code JavaScript du code AdSense ou de Google Publisher Tag crée et envoie des demandes d'annonces. Vous n'avez donc pas besoin d'effectuer de demandes d'annonces avec le SDK. N'oubliez pas que seuls les formats d'inventaire Web pour mobile et pour ordinateur sont disponibles à l'aide de cette API.Si vous n'êtes pas propriétaire du contenu Web d'un
WebViewController
, nous vous conseillons tout de même d'utiliser cette API pour protéger les annonceurs contre le spam et améliorer la monétisation pour les éditeurs Web qui ont fourni le contenu.
Notez que vous pouvez choisir l'une ou l'autre de ces options dans la même application, voire les deux.
L'objectif de ce guide est de vous aider à intégrer l'API WebView pour les annonces dans votre application iOS.
Avant de commencer
Avant de commencer à utiliser l'API WebView pour les annonces, veillez à effectuer les opérations suivantes:
- Utilisez le plug-in Google Mobile Ads pour Flutter avec la version 3.0.0 ou une version ultérieure dans votre application.
- Ajoutez
webview_flutter
en tant que dépendance dans votre fichierpubspec.yaml
. - Ajoutez
webview_flutter_android
à votre application à partir de la version 3.7.0.
Ignorer la vérification de l'identifiant d'application
Android
Ajoutez la balise <meta-data>
suivante dans votre fichier AndroidManifest.xml
pour contourner la vérification de APPLICATION_ID
. Si vous n'effectuez pas cette étape, le SDK Google Mobile Ads peut générer une exception IllegalStateException
au démarrage de l'application.
<!-- Bypass APPLICATION_ID check for WebView API for Ads -->
<meta-data
android:name="com.google.android.gms.ads.INTEGRATION_MANAGER"
android:value="webview"/>
iOS
Mettez à jour le fichier Runner/Info.plist
avec la clé et la valeur de chaîne ci-dessous pour contourner une vérification de GADApplicationIdentifier
. Si vous n'effectuez pas cette étape, le SDK Google Mobile Ads peut générer une GADInvalidInitializationException
au démarrage de l'application.
<!-- Bypass GADApplicationIdentifier check for WebView API for Ads -->
<key>GADIntegrationManager</key>
<string>webview</string>
Enregistrer WebViewController
Pour améliorer la monétisation des annonces dans une application dans un WebViewController
utilisant le code AdSense ou des tags Google Publisher Tag, procédez comme suit:
Activez JavaScript dans
WebViewController
. Sinon, les annonces risquent de ne pas se charger.Pour améliorer l'expérience publicitaire de vos utilisateurs et respecter les règles relatives aux cookies de Chrome, activez les cookies tiers sur votre instance
AndroidWebViewController
.Enregistrez l'instance
WebViewController
en appelant la méthoderegisterWebView()
fournie par le SDK Google Mobile Ads.
import 'package:google_mobile_ads/google_mobile_ads.dart';
import 'package:webview_flutter/webview_flutter.dart';
import 'package:webview_flutter_android/webview_flutter_android.dart';
@override
class WebViewExampleState extends State<WebViewExample> {
late final WebViewController controller;
@override
void initState() {
super.initState();
createWebView();
}
void createWebView() async {
controller = WebViewController();
// 1. Enable JavaScript in the web view.
await controller.setJavaScriptMode(JavaScriptMode.unrestricted);
// 2. Enable third-party cookies for Android.
if (controller.platform is AndroidWebViewController) {
AndroidWebViewCookieManager cookieManager = AndroidWebViewCookieManager(
const PlatformWebViewCookieManagerCreationParams());
await cookieManager.setAcceptThirdPartyCookies(
controller.platform as AndroidWebViewController, true);
}
// 3. Register the web view.
await MobileAds.instance.registerWebView(controller);
}
}
Charger l'URL
Vous pouvez désormais charger une URL et afficher votre contenu Web via WebViewController
.
Nous vous recommandons de charger cette URL de test : https://webview-api-for-ads-test.glitch.me/
pour tester l'intégration avant d'utiliser votre propre URL. La page Web affiche une erreur si JavaScript n'est pas activé.
import 'package:google_mobile_ads/google_mobile_ads.dart';
import 'package:webview_flutter/webview_flutter.dart';
import 'package:webview_flutter_android/webview_flutter_android.dart';
@override
class WebViewExampleState extends State<WebViewExample> {
late final WebViewController controller;
@override
void initState() {
super.initState();
createWebView();
}
void createWebView() async {
controller = WebViewController();
// 1. Enable JavaScript in the web view.
await controller.setJavaScriptMode(JavaScriptMode.unrestricted);
// 2. Enable third-party cookies for Android.
if (controller.platform is AndroidWebViewController) {
AndroidWebViewCookieManager cookieManager = AndroidWebViewCookieManager(
const PlatformWebViewCookieManagerCreationParams());
await cookieManager.setAcceptThirdPartyCookies(
controller.platform as AndroidWebViewController, true);
}
// 3. Register the web view.
await MobileAds.instance.registerWebView(controller);
// 4. Load the URL.
await controller.loadRequest(Uri.parse('https://webview-api-for-ads-test.glitch.me/'));
}
L'URL de test affiche des barres d'état vertes pour indiquer une intégration réussie si les conditions suivantes s'appliquent:
WebView
connecté au SDK Google Mobile Ads- JavaScript activé
- Les cookies tiers fonctionnent (non attendu sur les appareils iOS)
- Les cookies propriétaires fonctionnent
Affichez le code source de notre URL de test. Vous pouvez alors remplacer l'URL de test par votre URL. Vous pouvez également utiliser un outil de proxy tel que Charles pour capturer le trafic HTTPS de votre application et inspecter les demandes d'annonces pour rechercher un paramètre &scar=
.