0

Last week I encountered a problem with the WKWebView.

My task is to render a banner which is sent to me as a link containing a script (javascript).

I tested the code in a browser (chrome) and it all worked fine. It is displayed correctly and responds to my click with opening a new website (romanian vodafone website).

In tested the code in a UIWebView. It is displayed correctly and responds to my click with opening a new website. Only problem here is that if i click on it the delegate callback

- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType 

responds with a UIWebViewNavigationTypeOtherinstead of a UIWebViewNavigationTypeLinkClickedas i expected.

When I tested it in the WKWebView, as i heard that UIWebView will be deprecated with iOS 12, just the frame of the banner was visible. I learned that I had to pass a baseURL when loading the HTML string, because the script needed a reference:

NSURL* baseURL = [NSURL fileURLWithPath:NSTemporaryDirectory()];  
[self.webView loadHTMLString:displayHTML baseURL:baseURL];

So the banner is now displayed properly, but it doesn't react to clicks at all. It doesn't open a new website like it does in the browser or the UIWebView.
The callback

- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler

is called initially a few times, before/when the banner is being loaded, but if I click on the banner, it isn't called again, like it does normally with my banners.

So, this is the HTML for the banner. I adjusted it a little to fulfill my visual needs:

<html><head><meta name='viewport' content='initial-scale=1.0 user-scalable=no'><style>body {margin:0; padding:0;}</style></head><body><div style="display:flex;align-items:center;height:100%;justify-content:center;"><script type="text/javascript">
      rubicon_cb = Math.random(); rubicon_rurl = document.referrer; if(top.location==document.location){rubicon_rurl = document.location;} rubicon_rurl = escape(rubicon_rurl);
      window.rubicon_ad = "3791706" + "." + "js";
      window.rubicon_creative = "4044326" + "." + "js";
    </script>
<div data-rp-type="trp-display-creative" data-rp-impression-id="f09f735f-2db6-4677-bc64-2b80d451a290"><div style="width: 0; height: 0; overflow: hidden;"><img border="0" width="1" height="1" src="http://beacon-eu-ams3.rubiconproject.com/beacon/d/f09f735f-2db6-4677-bc64-2b80d451a290?oo=0&accountId=17430&siteId=169868&zoneId=818862&sizeId=67&e=6A1E40E384DA563B28B0B06C6D1183C2FA763FA5D91CB8A8A8B54C16031856825AA6F7B7A9E82EEDBED373B9F464F8B8C1EBE65E7377AC8DC35C8ED1F4E9551DA6D708C9FC571E6367FB59E688C57D0C37971816704066127FA46CD2A2EEB5352DF666B7E491F6D5EFF5C7CFD889081A9D6EE7558D6A842EA8D5522938A900F9A297B4BA53400D207EB9007C3FCC2BFC7E625848872D964AFC3BE8685EBA97EB13CC5F7EED8F0DBFD355BC846AF674595F8D0E597F1944BC6F52CA272C1DFBDD497A12E85F2B705143E9A407AF5D2E15" alt="" /></div>


<script type='text/javascript' src='http://track.adform.net/adfscript/?bn=23642762;rtbwp=0FE450112ED5343B;rtbdata=KJxCPgB7xRv_-g_FTwwHdJBx9UNuZfHmHihwlwcvnsIIIMur8HpBf6znV-RRXpnrUJSmZRGZj1X8draI56UzVxylUSkRLExBRaQQsK91g3mxJIoeVkC04QnIz5H-_QFGi1jNITEiz0obDKNaIZr13h5c12erP2BlZpyoToCUfkVqeX-EWiytwu7-gGsbFAkEop9UBofZXJqtjqM6J_oGULxo38C9RWsKq8ejeN5azUB_lD_IfjoPwPDyw_dJafnq4UFuhV40q881;OOBClickTrack=http://beacon-nf.rubiconproject.com/beacon/v2/t/0/f09f735f-2db6-4677-bc64-2b80d451a290/'></script>
<div style="height:0px;width:0px;overflow:hidden"><iframe src="https://eus.rubiconproject.com/usync.html?&geo=eu&co=de" frameborder="0" marginwidth="0" marginheight="0" scrolling="NO" width="0" height="0" style="height:0px;width:0px"></iframe></div></div>

</div></body></html>

I don't know why this snippet throws errors, but in the browser it works fine.

So my questions are:
1. How do I get the WKWebView to react to the click on the banner with opening a new website, like Chrome or the UIWebView do?
2. How do I check if someone clicks on this banner in the WKWebView?

ref2111
  • 49
  • 1
  • 9

1 Answers1

0

I had same issue with Adform ads. Core issue is related to target="_blank" or doing similar stuff from JS (Adform JS tries to open url in new tab).

Solution was originally posted here: https://stackoverflow.com/a/25853806/2124345

Implement the WKUIDelegate delegate and set it to _webview.uiDelegate. Then implement

- (WKWebView *)webView:(WKWebView *)webView createWebViewWithConfiguration:(WKWebViewConfiguration *)configuration forNavigationAction:(WKNavigationAction *)navigationAction windowFeatures:(WKWindowFeatures *)windowFeatures
{
  // to handle inside wkwebview
  // if (!navigationAction.targetFrame.isMainFrame) {
  //   [webView loadRequest:navigationAction.request];
  // }

  // to open safari:
  [[UIApplication sharedApplication] openURL:navigationAction.request.URL  options:@{} completionHandler:nil];

  return nil;
}

Note that uiDelegate != delegate. These are two different protocols.

Julius Lisauskas
  • 116
  • 4
  • 10