Cordova - Refused to connect to api from device (Content Security Policy)

Question

I am working with Visual Studio\'s Tools for Apache Cordova.

When I build the app with Ripple, all is well. But when I build it to my android device, the app refuses

Answer 1

From the Error Message. You are calling Ajax Request in your JS. But you only added http://XXX.herokuapp.com after script-src, which only allows loading the script content. To allow the Ajax request, http://XXX.herokuapp.com needs to be added after connect-srclike this:

<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; connect-src 'self' http://XXX.herokuapp.com; style-src 'self' 'unsafe-inline'; media-src *">

Alternatively, you can add the URL after default-src, which sets a default policy for allowing everything(loading script/CSS contents,Ajax Request and so on). So the meta Tag should be like this:

<meta http-equiv="Content-Security-Policy" content="default-src 'self' http://XXX.herokuapp.com data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">

For detailed information about Content Security Policy you can refer to Content Security Policy Reference.