Menggunakan Analytics di WebView

Panggilan untuk mencatat peristiwa ke dalam log atau menyetel properti pengguna yang diaktifkan dari dalam WebView harus diteruskan ke kode native sebelum dapat dikirimkan ke Google Analytics.

Menerapkan pengendali JavaScript

Langkah pertama dalam menggunakan Google Analytics di WebView adalah membuat fungsi JavaScript untuk meneruskan peristiwa dan properti pengguna ke kode native. Contoh berikut menunjukkan cara melakukannya agar kompatibel dengan kode native Android dan 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

Menerapkan antarmuka native

Untuk memanggil kode native Apple dari JavaScript, buat class pengendali pesan yang sesuai dengan protokol WKScriptMessageHandler. Anda dapat melakukan panggilan Google Analytics di dalam callback userContentController:didReceiveScriptMessage::

Swift

Catatan: Produk Firebase ini tidak tersedia di target macOS.

func userContentController(_ userContentController: WKUserContentController,
                         didReceive message: WKScriptMessage) {
  guard let body = message.body as? [String: Any] else { return }
  guard let command = body["command"] as? String else { return }
  guard let name = body["name"] as? String else { return }

  if command == "setUserProperty" {
    guard let value = body["value"] as? String else { return }
    Analytics.setUserProperty(value, forName: name)
  } else if command == "logEvent" {
    guard let params = body["parameters"] as? [String: NSObject] else { return }
    Analytics.logEvent(name, parameters: params)
  }
}ViewController.swift

Objective-C

- (void)userContentController:(WKUserContentController *)userContentController
      didReceiveScriptMessage:(WKScriptMessage *)message {
  if ([message.body[@"command"] isEqual:@"setUserProperty"]) {
    [FIRAnalytics setUserPropertyString:message.body[@"value"] forName:message.body[@"name"]];
  } else if ([message.body[@"command"] isEqual: @"logEvent"]) {
    [FIRAnalytics logEventWithName:message.body[@"name"] parameters:message.body[@"parameters"]];
  }
}ViewController.m

Terakhir, tambahkan pengendali pesan ke pengontrol konten pengguna WebView:

Swift

Catatan: Produk Firebase ini tidak tersedia di target macOS.

self.webView.configuration.userContentController.add(self, name: "firebase")ViewController.swift

Objective-C

Catatan: Produk Firebase ini tidak tersedia di target macOS.

[self.webView.configuration.userContentController addScriptMessageHandler:self
                                                                     name:@"firebase"];ViewController.m

Langkah Berikutnya

Untuk penerapan Google Analytics di WebView yang sepenuhnya berfungsi, lihat contoh analytics-webview.