Integracja interfejsu WebView API for Ads

Interfejs WebView API for Ads umożliwia zarabianie na reklamach w aplikacji za pomocą WebViewController. Jeśli wyświetlasz treści internetowe, które implementują reklamy za pomocą kodu AdSense lub tagu wydawcy Google w aplikacji za pomocą WebViewController, musisz użyć tego interfejsu API, aby włączyć zarabianie na reklamach. Więcej informacji znajdziesz w zasadach AdMob.

  1. Zarabianie dzięki wysyłaniu żądań reklam za pomocą pakietu SDK do reklam mobilnych Google

    Możesz zarabiać na aplikacji, wysyłając żądania reklam do AdMob za pomocą pakietu SDK do reklam mobilnych Google i wdrażając formaty reklam dla aplikacji mobilnej.

    Więcej informacji

  2. Zarabianie za pomocą interfejsu WebView API for Ads

    Jeśli Twoja aplikacja używa WebViewController do wyświetlania treści internetowych, które wyświetlają reklamy z Ad Managera lub AdSense, użyj interfejsu WebView API for Ads, aby zarejestrować obiekty WebViewController w pakiecie SDK do reklam mobilnych Google. Kod JavaScript w kodzie AdSense lub tanie wydawcy Google tworzy i wysyła żądania reklamy, więc nie musisz wysyłać żadnych żądań reklamy za pomocą pakietu SDK. Pamiętaj, że za pomocą tego interfejsu API dostępne są tylko formaty zasobów reklamowych w internecie mobilnym i na komputery.

    Jeśli nie jesteś właścicielem treści internetowych w WebViewController, zalecamy korzystanie z tego interfejsu API, aby chronić reklamodawców przed spamem i poprawić zarabianie wydawcom, którzy udostępnili te treści.

Pamiętaj, że w tej samej aplikacji możesz wybrać jedną z tych opcji lub nawet obie.

Ten przewodnik ma pomóc Ci zintegrować interfejs WebView API for Ads z aplikacją na iOS.

Zanim zaczniesz

Zanim zaczniesz używać interfejsu WebView API do reklam, wykonaj te czynności:

Ominięcie sprawdzania identyfikatora aplikacji

AndroidiOS

Aby pominąć sprawdzanie wartości APPLICATION_ID, dodaj do pliku AndroidManifest.xml ten tag <meta-data>. Jeśli pominiesz ten krok, pakiet SDK do reklam mobilnych Google może wywołać błąd IllegalStateException po uruchomieniu aplikacji.

<!-- Bypass APPLICATION_ID check for WebView API for Ads -->
<meta-data
    android:name="com.google.android.gms.ads.INTEGRATION_MANAGER"
    android:value="webview"/>

Aby pominąć sprawdzanie wartości GADApplicationIdentifier, zaktualizuj plik Runner/Info.plist, podając w nim klucz i podany niżej ciąg znaków. Jeśli pominiesz ten krok, pakiet SDK do reklam mobilnych Google może wywołać błąd GADInvalidInitializationExceptionpo uruchomieniu aplikacji.

<!-- Bypass GADApplicationIdentifier check for WebView API for Ads -->
<key>GADIntegrationManager</key>
<string>webview</string>

Rejestrowanie klasy WebViewController

Aby zwiększyć zarabianie na reklamach w aplikacji WebViewController, która korzysta z kodu AdSense lub tagów Google Publisher Tag, wykonaj te czynności:

  1. Włącz JavaScript w WebViewController. Jeśli tego nie zrobisz, reklamy mogą się nie wczytywać.

  2. Aby poprawić wrażenia użytkowników związane z reklamami i zapewnić zgodność z zasadami dotyczącymi plików cookie w Chrome, włącz pliki cookie innych firm w instancji AndroidWebViewController.

  3. Zarejestruj instancję WebViewController, wywołując metodę registerWebView() udostępnioną przez pakiet SDK do reklam mobilnych Google.

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);
  }
}

Wczytaj adres URL.

Teraz możesz wczytywać adres URL i wyświetlać treści internetowe za pomocą WebViewController. Zalecamy załadowanie tego testowego adresu URL:https://webview-api-for-ads-test.glitch.me/, aby przetestować integrację przed użyciem własnego adresu URL. Jeśli JavaScript nie jest włączony, na stronie internetowej pojawi się błąd.

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/'));
  }

W przypadku pomyślnej integracji adres URL testowy wyświetla zielone paski stanu:

  • WebView połączony z pakietem SDK do reklam mobilnych Google
  • Obsługa JavaScriptu jest włączona
  • Pliki cookie innych firm działają (nie dotyczy urządzeń z iOS)
  • Własne pliki cookie

wyświetlić kod źródłowy adresu URL testowego. Następnie możesz zastąpić testowy adres URL swoim adresem URL. Możesz też użyć narzędzia proxy, np. Charles, aby przechwycić ruch HTTPS w aplikacji i sprawdzić żądania reklam pod kątem parametru &scar=.