PhoneGap is a cool platform that let you build mobile application with your web skill, and often, reuse your web resource to consist as a part of your mobile application.
So PhoneGap use the concept that called ‘White list’, a set of domain’s name syntax that has been written to allow application to access external resource in the Internet. Those resource can be anything, such as image file, web service, or even the whole web page.
(Take a look on how to write white list for your PhoneGap application here)
The problem when the application load and import external web page
If you use JQuery Mobile as a core framework. You will found that <a> can be used to browse and load external page from Internet into your application easily.
[code lang=”html”] <a href=”http://www.nextflow.in.th” data-role=”button”>Official Website</a>[/code]
This is very cool. But you may found yourselves stuck in a loaded web page, but its function doesn’t work or the presentation looks strange, then you might realize
“What is happening to those Javascript and CSS?”
Let’s take a look what cause this.
What’s happen?
The reason that make loaded web page doesn’t work as you expect, is simple mistake.
Because those web page is common web page. This common web page always consisted with external Javascript and CSS file.
Sometime, these external files comes from public web API, such as Google API or Facebook API, and they aren’t hosted on your server, specifically, in the domain’s name you put into white list. The white list will detect those unlisted domain’s names, then reject them.
So you might see the web page there, but it just doesn’t work. Normally, you can check log file that white list rejects external Javascript file.
How to solve the problem?
We have to put those domain’s name into white list. The application won’t reject external Javascript or CSS file that comes with the web page.
In the other hand, the rejection can be used to find any harmful script which may included in the HTML file you’re loading into your application.
What’s next?
This problem can happen to every people who just start to use PhoneGap to build their application. The white list concept is easy to understand, but something might be skipped, yes, I did it before and hope this may help you out from your problem.
Please feel free to share your thought below, is there any more problem about white list?