CODEWITHSUNDEEP
javascriptcordovaionic-framework
olivier
olivier

Reputation: 2645

Cordova whitelist plugin does not work

My app works fine on the browser but not on the device: The ionic app only loads the HTML and CSS but does not load the http requests and run the JS.

In Xcode it's stuck at this point: 

2016-06-18 11:43:59.169 waettr[719:414729] Apache Cordova native platform version 4.1.0 is starting.
2016-06-18 11:43:59.170 waettr[719:414729] Multi-tasking -> Device: YES, App: YES
2016-06-18 11:43:59.203 waettr[719:414729] Using UIWebView
2016-06-18 11:43:59.204 waettr[719:414729] [CDVTimer][handleopenurl] 0.057995ms
2016-06-18 11:43:59.205 waettr[719:414729] [CDVTimer][intentandnavigationfilter] 1.080990ms
2016-06-18 11:43:59.205 waettr[719:414729] [CDVTimer][gesturehandler] 0.043035ms
2016-06-18 11:43:59.217 waettr[719:414729] [CDVTimer][splashscreen] 12.061000ms
2016-06-18 11:43:59.224 waettr[719:414729] [CDVTimer][statusbar] 6.388009ms
2016-06-18 11:43:59.224 waettr[719:414729] [CDVTimer][keyboard] 0.630975ms
2016-06-18 11:43:59.225 waettr[719:414729] [CDVTimer][TotalPluginStartup] 20.883977ms
2016-06-18 11:43:59.366 waettr[719:414729] Resetting plugins due to page load.
2016-06-18 11:44:01.708 waettr[719:414729] Finished load of: file:///var/containers/Bundle/Application/8365EFD8-1FAA-4E82-8DB6-2ADCD8E53A90/waettr.app/www/index.html#/home

I have the following settings: 

  <access origin="*" />
  <allow-navigation href="https://maps.googleapis.com/*"/>
  <allow-navigation href="http://api.openweathermap.org/*"/>

This Tag: 

<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' maps.googleapis.com 'unsafe-inline' 'unsafe-eval'">

What's my mistake? I'm getting headaches from this...

Upvotes: 0

Views: 143

Answers (1)

Simon Prickett
Simon Prickett

Reputation: 4148

If you are making Ajax calls to:

 <allow-navigation href="https://maps.googleapis.com/*"/>
 <allow-navigation href="http://api.openweathermap.org/*"/>

which I guess is why you have those in your config.xml, then I recommend that you update your Content Security Policy meta tab to include a connect-src declaration. This defines where you can make Ajax calls to.

Try setting the following Content Security Policy:

<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' maps.googleapis.com 'unsafe-inline' 'unsafe-eval'; connect-src https://maps.googleapis.com http://api.openweathermap.org">

Here I added connect-src and the URLs that I think you are trying to make Ajax requests to. If you'd like more information on this, here's a relevant blog post.

Upvotes: 1

Related Questions