PhoneGap for iPhone: problem loading external URL

Claus picture Claus · May 6, 2011 · Viewed 33.7k times · Source

I'm writing an application for iPad using PhoneGap and I would like to load an external URL without triggering Safari or using internal web browser like ChildBrowser.

I'm using the PhoneGap iPad/iPhone sample project and I tried different approaches. In the onBodyLoad() function I added:

window.location.href('http://www.wordreference.com'); 

but this line opens the link using a new Safari window.From that point is not possible to come back in PhoneGap

Afterwards, I tried with an AJAX request substituting the content of the page using document.write

function loadHTML(url, timeout) {
if (timeout == undefined)
    timeout = 10000;
var req = new XMLHttpRequest();
var timer = setTimeout(function() {
    try {
        req.abort();
    } catch(e) {}
    navigator.notification.loadingStop();
},timeout);
req.onreadystatechange = function() {
    if (req.readyState == 4) {
        if (req.status < 300) {
            clearTimeout(timer);

            var html = req.responseText;
            //just a debug print   
    alert(html);
    document.write(html);

        }
        navigator.notification.loadingStop();
        delete req;
    }       
};          
req.open('GET', url, true);
req.send();
}

Now, calling from inside onBodyLoad():

loadHTML('http://www.wordreference.com',10000); 

Opens the link in the PhoneGap Container,which is fine. The point is that I want to load a dynamic page written in Python

loadHTML('http://www.mysite.com/cgi-bin/index.py',10000)

At this point Safari is not called but a black page in the PhoneGap container is displayed!! I want to point out that the link is perfectly working if I type it in Safari( I cannot report it for privacy issues).

Could be it a problem related to some kind of needed permission???

I found something similar relative to PhoneGap for BlackBerry and the proposed solution was to modify a config.xml file with

<access subdomains="true" uri="http://www.mysite.com/" />

I tried to add this tag directly in my index.html but it doesn't work.

Is there any similar approach for iPhone??

Thanks a lot

Answer

Claus picture Claus · May 9, 2011

I think I've found the solution,

in the PhoneGap Application Delegate .m file {YourProject}AppDelegate.m, modify the method:

- (BOOL)webView:(UIWebView *)theWebView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
{
return [super webView:theWebView shouldStartLoadWithRequest:request navigationType:navigationType];
}

with

- (BOOL)webView:(UIWebView *)theWebView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
{
 NSURL *url = [request URL];
if ([[url scheme] isEqualToString:@"http"] || [[url scheme] isEqualToString:@"https"]) {
    return YES;
}
else {
return [ super webView:theWebView shouldStartLoadWithRequest:request navigationType:navigationType ];
}
}

This will open all the external links within the PhoneGap container!!!

ps. Around you will find references to this link but I think it doesn't work for app written using the 0.9.5 version,since Safari gets opened for external links by default.