Implementar el controlador de JavaScript
El primer paso para utilizar Google Analytics en un WebView es crear funciones de JavaScript para reenviar eventos y propiedades del usuario al código nativo. El siguiente ejemplo muestra cómo hacer esto de una manera que sea compatible con el código nativo de Android y 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."); } }
Implementar interfaz nativa
Para invocar código nativo de Apple desde JavaScript, cree una clase de controlador de mensajes que cumpla con el protocolo WKScriptMessageHandler
. Puede realizar llamadas de Google Analytics dentro de userContentController:didReceiveScriptMessage:
callback:
Rápido
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) } }
C objetivo
- (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"]]; } }
Finalmente, agregue el controlador de mensajes al controlador de contenido de usuario de la vista web:
Rápido
self.webView.configuration.userContentController.add(self, name: "firebase")
C objetivo
[self.webView.configuration.userContentController addScriptMessageHandler:self name:@"firebase"];
Próximos pasos
Para obtener una implementación completamente funcional de Google Analytics en un WebView, consulte el ejemplo de vista web de análisis .