In-App Events from a Native Web View

Sometimes, apps use web views containing HTML content. It is possible to call AppsFlyer's APIs for tracking events from Javascript code in the web view.

The following code shows an example for tracking an In-App Event:
 

HTML Code (for both Android WebView and iOS UIWebview):

function trackEvent(eventName,eventValue){
         var iframe = document.createElement("IFRAME");
         iframe.setAttribute("src", "appsflyerEvent://inappevent?eventName="+eventName+"&eventValue="+eventValue);
         document.documentElement.appendChild(iframe);
         iframe.parentNode.removeChild(iframe);
         iframe = null;
}

The web view must call the native app which, in turn, calls AppsFlyer's SDK.

Example:

button.onclick = function(event) {
  var eventName = "af_purchase";
  var eventValue = "{\"af_revenue\":6.72 ,\"af_content_type\":\"wallets\", \"af_content_id\":\"15854\"}";
  trackEvent(eventName, eventValue);
};

 

iOS Implementation:

On your UIWebView's delegate add the following code in the shouldStartLoadWithRequest method.

- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType {
    NSString* requestURLString = [[request URL] absoluteString];
    if ([requestURLString hasPrefix:@"appsflyerevent://"]){    
        NSScanner *scanner = [NSScanner scannerWithString:requestURLString];
        [scanner setCharactersToBeSkipped:[NSCharacterSetcharacterSetWithCharactersInString:@"&?"]];
        [scanner scanUpToString:@"?" intoString:nil];
        NSString *tempString;        NSString *eventName;
        NSString *eventValue;
        while ([scanner scanUpToString:@"&" intoString:&tempString]) {
            if ([tempString hasPrefix:@"eventName="] && [tempString length] > 10){
                eventName = [tempString substringFromIndex:11];
            }
            if ([tempString hasPrefix:@"eventValue="] && [tempString length] > 11){
                eventValue = [tempString substringFromIndex:12];
            }
        }
        if (eventName != nil){
            [[AppsFlyerTracker sharedTracker] trackEvent:eventNamewithValue:eventValue];
        }
        return NO;
    }

Android Implementation:

Android WebView uses a WebViewClient that receives notification from the web view.  In the shouldOverrideUrlLoading, you can handle events coming from the WebView as follows:

webView.setWebViewClient(
    new WebViewClient() {
        public boolean shouldOverrideUrlLoading(WebView view, String url) {
            if (url.startsWith("appsflyerEvent://"))  {
                String[] urlParts = url.split("\\?")
                if (urlParts.length > 1) {
                    String query = urlParts[1];
                    String eventName = null;
                    String eventValue = null;
                    for (String param : query.split("&")) {
                        String[] pair = param.split("=");
                        String key = pair[0];
                        if (pair.length > 1) {
                            if ("eventName".equals(key)){
                                eventName = pair[1];
                            } else if ("eventValue".equals(key)){
                                eventValue = pair[1];
                            }
                        }
                 }
                                                             AppsFlyerLib.sendTrackingWithEvent(AppsFlyerTestActivity.this,eventName,eventValue);
             }
             return false;
         }
         return true;
    }});

                       

Was this article helpful?
0 out of 1 found this helpful
Have more questions? Submit a request
Powered by Zendesk