বিজ্ঞাপনের জন্য WebView API ইন্টিগ্রেট করা

বিজ্ঞাপনের জন্য WebView API, WebViewController ব্যবহার করে ইন-অ্যাপ বিজ্ঞাপন মনিটাইজ করার অনুমতি দেয়। আপনি যদি WebViewController-এর মাধ্যমে আপনার অ্যাপে AdSense কোড বা Google প্রকাশকের ট্যাগ ব্যবহার করে বিজ্ঞাপন প্রয়োগ করা ওয়েব কন্টেন্ট দেখান, তাহলে বিজ্ঞাপন মনিটাইজেশন চালু করতে আপনাকে এই API ব্যবহার করতে হবে। আরও জানতে, AdMob নীতি দেখুন।

  1. Google Mobile Ads Flutter Plugin-এর মাধ্যমে বিজ্ঞাপনের অনুরোধ করে মনিটাইজ করা

    আপনি AdMob-এর কাছে বিজ্ঞাপন অনুরোধ করে Google Mobile Ads Flutter Plugin মোবাইল অ্যাপের জন্য বিজ্ঞাপন ফর্ম্যাট প্রয়োগ করার মাধ্যমে আপনার অ্যাপ মনিটাইজ করতে পারবেন।

    আরও জানুন।

  2. বিজ্ঞাপনের জন্য WebView API ব্যবহার করে মনিটাইজ করা

    আপনার অ্যাপ যদি WebViewController ব্যবহার করে এমন ওয়েব কন্টেন্ট দেখায় যা Ad Manager বা AdSense থেকে বিজ্ঞাপন পরিবেশন করে, তাহলে Google Mobile Ads Flutter Plugin-এর সাথে WebViewController অবজেক্ট রেজিস্টার করতে বিজ্ঞাপনের জন্য WebView API ব্যবহার করুন। AdSense কোড বা Google প্রকাশক ট্যাগ থেকে JavaScript বিজ্ঞাপনের অনুরোধ তৈরি করে এবং পাঠায়, তাই আপনাকে SDK-এর মাধ্যমে কোনও বিজ্ঞাপনের অনুরোধ করতে হবে না। মনে রাখবেন, এই API ব্যবহার করে শুধুমাত্র মোবাইল ওয়েব ও ডেস্কটপ ওয়েবের ইনভেনটরি ফর্ম্যাট উপলভ্য।

    আপনি WebViewController-এ ওয়েব কন্টেন্টের মালিক না হলেও, আপনাকে এই API ব্যবহার করতে উৎসাহিত করা হচ্ছে। এর ফলে, স্প্যাম থেকে বিজ্ঞাপনদাতাদের রক্ষা করা এবং যেসব ওয়েব প্রকাশক কন্টেন্ট প্রদান করেছেন তাদের মনিটাইজেশন উন্নত করতে সাহায্য করা যাবে।

মনে রাখবেন, আপনি একই অ্যাপে যেকোনও একটি বা এমনকি দুটি বিকল্পই ব্যবহার করতে পারবেন।

এই গাইড আপনাকে iOS অ্যাপে Ads-এর জন্য WebView API ইন্টিগ্রেট করতে সাহায্য করার উদ্দেশ্যে লেখা হয়েছে।

শুরু করার আগে

বিজ্ঞাপনের জন্য WebView API ব্যবহার করা শুরু করার আগে, নিম্নলিখিত কাজগুলি করেছেন কিনা তা নিশ্চিত করুন:

  • আপনার অ্যাপে 3.0.0 বা তার পরের যেকোনও ভার্সনের সাথে Google Mobile Ads Flutter Plugin Flutter প্লাগ-ইন ব্যবহার করুন।
  • আপনার pubspec.yaml ফাইলে webview_flutter-কে ডিপেন্ডেন্সি হিসেবে যোগ করুন ।
  • আপনার অ্যাপে webview_flutter_android ভার্সন 3.7.0 বা তার পরবর্তী যেকোনও ভার্সন যোগ করুন।

অ্যাপ্লিকেশন শনাক্তকারীর জন্য চেক বাইপাস করা

Android

APPLICATION_ID-এর জন্য চেক বাইপাস করতে, আপনার AndroidManifest.xml ফাইলে নিম্নলিখিত <meta-data> ট্যাগ যোগ করুন। আপনি এই ধাপটি মিস করলে, Google Mobile Ads Flutter Plugin অ্যাপ চালু করার সময় একটি IllegalStateException দেখাতে পারে।

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

iOS

GADApplicationIdentifier-এর জন্য চেক বাইপাস করতে, নিচে দেওয়া কী ও স্ট্রিং ভ্যালু সহ Runner/Info.plist ফাইল আপডেট করুন। আপনি এই ধাপটি মিস করলে, Google Mobile Ads Flutter Plugin অ্যাপ চালু করার সময় GADInvalidInitializationException দেখাতে পারে।

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

WebViewController রেজিস্টার করা

AdSense কোড বা Google Publisher ট্যাগ ব্যবহার করে এমন WebViewController অ্যাপের মধ্যে বিজ্ঞাপন মনিটাইজেশন উন্নত করতে, নিচে তালিকাভুক্ত ধাপগুলি অনুসরণ করুন:

  1. WebViewController-এ জাভাস্ক্রিপ্ট চালু করুন। এটি না করলে বিজ্ঞাপন লোড নাও হতে পারে।

  2. আপনার ব্যবহারকারীদের বিজ্ঞাপনের অভিজ্ঞতা উন্নত করতে এবং Chrome-এর কুকি নীতি মেনে চলতে, আপনার AndroidWebViewController ইনস্ট্যান্সে থার্ড-পার্টি কুকি চালু করুন।

  3. Google Mobile Ads Flutter Plugin-এর দেওয়া registerWebView() মেথড কল করে WebViewController ইনস্ট্যান্স রেজিস্টার করুন।

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 লোড করুন

আপনি এখন WebViewController-এর মাধ্যমে কোনও URL লোড করতে এবং আপনার ওয়েব কন্টেন্ট দেখাতে পারবেন। আমরা সাজেস্ট করি যে আপনার নিজের URL ব্যবহার করার আগে ইন্টিগ্রেশন পরীক্ষা করার জন্য এই টেস্ট URL লোড করুন: https://google.github.io/webview-ads/test/ জাভাস্ক্রিপ্ট চালু না করা থাকলে ওয়েবপেজে সমস্যা দেখানো হবে।

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://google.github.io/webview-ads/test/'));
  }

নিম্নলিখিত শর্ত প্রযোজ্য হলে, সফল ইন্টিগ্রেশনের জন্য টেস্ট URL-এ সবুজ রঙের স্ট্যাটাস বার দেখানো হয়:

  • WebView, Google Mobile Ads Flutter Plugin-এর সাথে কানেক্ট করা আছে
  • JavaScript চালু আছে
  • থার্ড-পার্টি কুকি কাজ করে (iOS ডিভাইসে এটি প্রত্যাশিত নয়)
  • ফার্স্ট-পার্টি কুকি কীভাবে কাজ করে

আমাদের টেস্ট URL-এর সোর্স কোড দেখুন। তারপরে, আপনি নিজের URL দিয়ে টেস্ট URL পরিবর্তন করতে পারবেন। এছাড়াও, আপনি &scar= প্যারামিটারের জন্য বিজ্ঞাপন অনুরোধ ক্যাপচার করতে এবং তা পরীক্ষা করতে, Charles-এর মতো প্রক্সি টুল ব্যবহার করতে পারেন।