I am using google dfp to serve ads in my PhoneGap project and these ads are rendered as iframes.
When a user clicks the ad, I would like the url to open in the InAppBrowser
. As of now, it just opens the url in the WebView
.
The anchor tag within the iframe has the target="_blank"
, but I believe because it's within the iframe, PhoneGap ignores this.
I know that the InAppBrowser
is working for other links I have within my project, so I have ruled that out.
Here are some settings in my config.xml:
...
<feature name="InAppBrowser">
<param name="ios-package" value="CDVInAppBrowser" />
</feature>
<feature name="InAppBrowser">
<param name="android-package" value="org.apache.cordova.InAppBrowser" />
</feature>
...
<preference name="stay-in-webview" value="false" />
...
<access origin="*" />
This is what the rendered iframe looks like:
<div class="adunit display-block" data-adunit="example_app_section_front_footer" data-dimensions="320x50" id="example_app_section_front_footer-auto-gen-id-1">
<div id="google_ads_iframe_/2444258/example_app_section_front_footer_0__container__" style="border: 0pt none;">
<iframe id="google_ads_iframe_/2444258/example_app_section_front_footer_0" name="google_ads_iframe_/2444258/example_app_section_front_footer_0" width="320" height="50" scrolling="no" marginwidth="0" marginheight="0" frameborder="0" src="someurl" style="border: 0px; vertical-align: bottom;">
<html>
<body>
<div id="google_image_div">
<a id="aw0" target="_blank" href="http://googleads.g.doubleclick.net/aclk?someurl" onfocus="ss('aw0')" onmousedown="st('aw0')" onmouseover="ss('aw0')" onclick="ha('aw0')"><img src="http://pagead2.googlesyndication.com/simgad/000111222" border="0" width="320" height="50" alt="" class="img_ad"></a>
</div>
</body>
</html>
</iframe>
</div>
</div>
I currently have some jQuery that checks all anchor tags that have a target of _blank
and opens them in the InAppBrowser
, however this function doesn't work with the rendered iframe:
$(document).on('click', 'a[target=_blank]', function (event) {
event.preventDefault();
window.open($(this).attr('href'), '_blank');
});
Any help would be appreciated.
As those are regular links and not cordova_exec
calls, you need to subclass the CDVViewController
and implement webView:shouldStartLoadWithRequest:navigationType
as suggested above.
Make sure to call super
in your implementation.
To subclass CDVViewController
you'll have to write some native code.
At the very least something like:
// MyGapViewController.h
@interface MyGapViewController : CDVViewController
@end
// MyGapViewController.h
@implementation MyGapViewController
- (BOOL)webView:(UIWebView*)webView
shouldStartLoadWithRequest:(NSURLRequest*)request
navigationType:(UIWebViewNavigationType)navigationType
{
// Check if super says we should load it
BOOL shouldLoad = [super webView:webView
shouldStartLoadWithRequest:request
navigationType:navigationType];
// If super says NO, then no need to continue
if (!shouldLoad)
{
return NO;
}
// Else check here if it is one of our iframe links and do something about it...
if (iFrame)
{
//...
return NO; // We handled it no need to load the iframe link in the original web view
}
// Else load it here
return YES;
}
@end
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With