Utiliser Analytics dans une WebView


Les appels permettant de consigner des événements ou de définir des propriétés utilisateur déclenchés à partir d'une WebView doivent être transférés vers le code natif avant de pouvoir être envoyés à Google Analytics.

Implémenter le gestionnaire JavaScript

La première étape de l'utilisation de Google Analytics dans une WebView consiste à créer des fonctions JavaScript pour transférer les événements et les propriétés utilisateur vers le code natif. L'exemple suivant montre comment procéder de manière compatible avec le code natif Android et 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

Implémenter une interface native

Pour appeler du code Apple natif à partir de JavaScript, créez une classe de gestionnaire de messages conforme au protocole WKScriptMessageHandler. Vous pouvez passer des appels Google Analytics dans le rappel userContentController:didReceiveScriptMessage::

Swift

Remarque : Ce produit Firebase n'est pas disponible sur la cible 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

Enfin, ajoutez le gestionnaire de messages au contrôleur de contenu utilisateur de la WebView:

Swift

Remarque : Ce produit Firebase n'est pas disponible sur la cible macOS. 
self.webView.configuration.userContentController.add(self, name: "firebase")
ViewController.swift

Objective-C

Remarque : Ce produit Firebase n'est pas disponible sur la cible macOS. 
[self.webView.configuration.userContentController addScriptMessageHandler:self
                                                                     name:@"firebase"];
ViewController.m

Étapes suivantes

Pour obtenir une implémentation entièrement fonctionnelle de Google Analytics dans une WebView, consultez l'exemple analytics-webview.