Reklamlar için WebView API'yi entegre etme

Reklamlar için WebView API, WebViewController kullanarak uygulama içi reklamlardan para kazanmaya olanak tanır. WebViewController üzerinden uygulamanızda AdSense kodu veya Google Yayıncı Etiketi ile reklam uygulayan web içeriği gösteriyorsanız reklamlardan para kazanmayı etkinleştirmek için bu API'yi kullanmanız gerekir. Daha fazla bilgi için AdMob politikalarını inceleyin.

1. Google Mobile Ads SDK'sı ile reklam isteği göndererek para kazanma

   Mobil uygulama için reklam biçimlerini uygulayarak Google Mobile Ads SDK'sı ile AdMob'a reklam isteği göndererek uygulamanızdan para kazanabilirsiniz.

   Daha fazla bilgi edinin.

2. Reklamlar için WebView API'yi kullanarak para kazanma

   Uygulamanız, Ad Manager veya AdSense'ten reklam yayınlayan web içeriğini görüntülemek için WebViewController kullanıyorsa WebViewController nesnelerini Google Mobile Ads SDK'sına kaydetmek üzere Reklamlar için WebView API'yi kullanın. AdSense kodunda veya Google Yayıncı Etiketinde bulunan JavaScript, reklam isteklerini oluşturup gönderir. Bu nedenle, SDK ile reklam isteğinde bulunmanız gerekmez. Bu API'nin yalnızca mobil web ve masaüstü web envanter biçimlerini desteklediğini unutmayın.

   WebViewController'teki web içeriğinin sahibi değilseniz de reklamverenleri spam'den korumaya ve içeriği sağlayan web yayıncılarının para kazanmasını iyileştirmeye yardımcı olmak için bu API'yi kullanmanızı öneririz.

Bu seçenekleri aynı uygulamada kullanabileceğinizi unutmayın.

Bu kılavuzun amacı, Reklamlar için WebView API'yi iOS uygulamanıza entegre etmenize yardımcı olmaktır.

Başlamadan önce

Reklamlar için WebView API'yi kullanmaya başlamadan önce aşağıdakileri yaptığınızdan emin olun:

• Uygulamanızda 3.0.0 veya daha yeni bir sürümle Flutter için Google Mobile Ads SDK'sı eklentisini kullanın.
• pubspec.yaml dosyanıza bağımlılık olarak webview_flutter ekleyin.
• Uygulamanıza 3.7.0 veya sonraki bir sürümle webview_flutter_android ekleyin.

Uygulama tanımlayıcısı kontrolünü atlama

AndroidiOS

APPLICATION_ID kontrolünü atlamak için AndroidManifest.xml dosyanıza aşağıdaki <meta-data> etiketini ekleyin. Bu adımı atlarsanız Google Mobile Ads SDK'sı, uygulama başlatıldığında IllegalStateException hatası verebilir.

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

GADApplicationIdentifier kontrolünü atlamak için Runner/Info.plist dosyasını aşağıdaki anahtar ve dize değeriyle güncelleyin. Bu adımı atlarsanız Google Mobile Ads SDK'sı, uygulama başlatıldığında GADInvalidInitializationException hatası verebilir.

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

WebViewController'ı kaydetme

AdSense kodu veya Google Yayıncı Etiketlerini kullanan bir WebViewController'teki reklamların uygulama içi reklam gelirini artırmak için aşağıdaki adımları uygulayın:

1. WebViewController'te JavaScript'i etkinleştirin. Aksi takdirde reklamların yüklenmemesi

2. Kullanıcılarınızın reklam deneyimini iyileştirmek ve Chrome'un çerez politikasına uygun olmak için AndroidWebViewController örneğinizde üçüncü taraf çerezlerini etkinleştirin.

3. Google Mobile Ads SDK'sı tarafından sağlanan registerWebView() yöntemini çağırarak WebViewController örneğini kaydedin.

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

URL'yi yükleme

Artık WebViewController aracılığıyla bir URL yükleyebilir ve web içeriğinizi gösterebilirsiniz. Kendi URL'nizi kullanmadan önce entegrasyonun test edilmesi için şu test URL'sini yüklemenizi öneririz:https://webview-api-for-ads-test.glitch.me/ JavaScript etkin değilse web sayfasında hata gösterilir.

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

Test URL'sinde, aşağıdaki koşullar geçerliyse başarılı bir entegrasyon için yeşil durum çubukları gösterilir:

• WebView Google Mobile Ads SDK'sına bağlı
• JavaScript etkin
• Üçüncü taraf çerezleri çalışır (iOS cihazlarda beklenmez)
• Birinci taraf çerezleri nasıl çalışır?

Test URL'mizin kaynak kodunu görüntüleyin. Ardından test URL'sini URL'nizle değiştirebilirsiniz. Ayrıca, uygulamanızın HTTPS trafiğini yakalamak ve reklam isteklerini &scar= parametresi için incelemek üzere Charles gibi bir proxy aracı da kullanabilirsiniz.