একটি WebView এ Analytics ব্যবহার করুন

iOS+ অ্যান্ড্রয়েড

একটি WebView থেকে বহিস্কার করা ইভেন্টগুলি লগ ইন করতে বা ব্যবহারকারীর বৈশিষ্ট্য সেট করতে কলগুলিকে Google Analytics এ পাঠানোর আগে নেটিভ কোডে ফরোয়ার্ড করতে হবে৷

জাভাস্ক্রিপ্ট হ্যান্ডলার প্রয়োগ করুন

একটি WebView-এ Google Analytics ব্যবহার করার প্রথম ধাপ হল জাভাস্ক্রিপ্ট ফাংশন তৈরি করা যাতে ইভেন্ট এবং ব্যবহারকারীর বৈশিষ্ট্য নেটিভ কোডে ফরওয়ার্ড করা যায়। নিম্নলিখিত উদাহরণটি Android এবং Apple নেটিভ কোডের সাথে সামঞ্জস্যপূর্ণ এমন একটি উপায়ে কীভাবে এটি করতে হয় তা দেখায়:

function logEvent(name, params) {
  if (!name) {
    return;
  }

  if (window.AnalyticsWebInterface) {
    // Call Android interface
    window.AnalyticsWebInterface.logEvent(name, JSON.stringify(params));
  } else if (window.webkit
      && window.webkit.messageHandlers
      && window.webkit.messageHandlers.firebase) {
    // Call iOS interface
    var message = {
      command: 'logEvent',
      name: name,
      parameters: params
    };
    window.webkit.messageHandlers.firebase.postMessage(message);
  } else {
    // No Android or iOS interface found
    console.log("No native APIs found.");
  }
}

function setUserProperty(name, value) {
  if (!name || !value) {
    return;
  }

  if (window.AnalyticsWebInterface) {
    // Call Android interface
    window.AnalyticsWebInterface.setUserProperty(name, value);
  } else if (window.webkit
      && window.webkit.messageHandlers
      && window.webkit.messageHandlers.firebase) {
    // Call iOS interface
    var message = {
      command: 'setUserProperty',
      name: name,
      value: value
   };
    window.webkit.messageHandlers.firebase.postMessage(message);
  } else {
    // No Android or iOS interface found
    console.log("No native APIs found.");
  }
}
index.js

আপনার WebView থেকে JavaScript হ্যান্ডলারকে কল করুন

আপনি পূর্ববর্তী ধাপে সংজ্ঞায়িত জাভাস্ক্রিপ্ট ফাংশনগুলিকে কল করে ওয়েবভিউ থেকে ইভেন্টগুলি সঠিকভাবে লগ করতে এবং ব্যবহারকারীর বৈশিষ্ট্যগুলি সেট করতে পারেন৷ নিম্নলিখিত উদাহরণটি দেখায় কিভাবে একটি ক্রয় ইভেন্টকে সঠিকভাবে লগ করতে হয় এবং একটি উদাহরণ হিসাবে একটি ব্যবহারকারীর সম্পত্তি সেট করতে হয়:

function logEventExample() {
   
   // Log an event named "purchase" with parameters
   logEvent("purchase", {
      content_type: "product",
      value: 123,
      currency: "USD",
      quantity: 2,
      items: [{
        item_id: "sample-item-id",
        item_variant: "232323"
      }],
      transaction_id: "1234567"
   });
}

function logUserPropertyExample() {
   // Set a user property named 'favorite_genre'
   setUserProperty("favorite_genre", "comedy")    
}

নেটিভ ইন্টারফেস প্রয়োগ করুন

জাভাস্ক্রিপ্ট থেকে নেটিভ অ্যান্ড্রয়েড কোড আনতে, @JavaScriptInterface চিহ্নিত পদ্ধতি সহ একটি ক্লাস বাস্তবায়ন করুন:

public class AnalyticsWebInterface {

    public static final String TAG = "AnalyticsWebInterface";
    private FirebaseAnalytics mAnalytics;

    public AnalyticsWebInterface(Context context) {
        mAnalytics = FirebaseAnalytics.getInstance(context);
    }

    @JavascriptInterface
    public void logEvent(String name, String jsonParams) {
        LOGD("logEvent:" + name);
        mAnalytics.logEvent(name, bundleFromJson(jsonParams));
    }

    @JavascriptInterface
    public void setUserProperty(String name, String value) {
        LOGD("setUserProperty:" + name);
        mAnalytics.setUserProperty(name, value);
    }

    private void LOGD(String message) {
        // Only log on debug builds, for privacy
        if (BuildConfig.DEBUG) {
            Log.d(TAG, message);
        }
    }

    private Bundle bundleFromJson(String json) {
        // ...
    }

}
AnalyticsWebInterface.java

একবার আপনি নেটিভ ইন্টারফেস তৈরি করলে, এটিকে আপনার ওয়েবভিউতে নিবন্ধন করুন যাতে এটি ওয়েবভিউতে চলমান জাভাস্ক্রিপ্ট কোডে দৃশ্যমান হয়:

// Only add the JavaScriptInterface on API version JELLY_BEAN_MR1 and above, due to
// security concerns, see link below for more information:
// https://developer.android.com/reference/android/webkit/WebView.html#addJavascriptInterface(java.lang.Object,%20java.lang.String)
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN_MR1) {
    mWebView.addJavascriptInterface(
            new AnalyticsWebInterface(this), AnalyticsWebInterface.TAG);
} else {
    Log.w(TAG, "Not adding JavaScriptInterface, API Version: " + Build.VERSION.SDK_INT);
}
MainActivity.java

পরবর্তী পদক্ষেপ

একটি WebView-এ Google Analytics এর সম্পূর্ণ কার্যকরী বাস্তবায়নের জন্য, বিশ্লেষণ-ওয়েবভিউ নমুনা দেখুন।