2

I recently learned how to build a mobile application using Ionic and needed a backend so I decided to use the Backand framework. I am developing in Visual Studio and everything works great when run from the emulator, and all service calls work perfectly, however when I attempt to perform the same service (POST) operations from an Android Device I get the following error.

Refused to connect to 'https: //api.backand.com/1/objects/player/'; because it violates the following Content Security Policy directive: "default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval

I found a similar issue in which the solution was that I may need to reference the servers address in index.html 's meta tag

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

This however crashes the application and now I have hit a dead end as to where I should go from here. I would be happy to provide any more information that may be necessary, any help would be greatly appreciated!

Thanks

Stephen
  • 21
  • 2

2 Answers2

3

This is a guide on Cordova's whitelist and CSP policy: http://taco.visualstudio.com/en-us/docs/cordova-security-whitlists/. If you have further problems with this scenario, please email vscordovatools@microsoft.com with your questions.

Disclosure: I work on the Cordova team at MSFT

Linda Z
  • 312
  • 1
  • 5
2

ensure you add cordova-whitelist-plugin after you add android platform to your application.

Order of commands have to be:

ionic platform add android

and after it

cordova plugin add cordova-plugin-inappbrowser
ionic plugin add https://github.com/apache/cordova-plugin-whitelist.git

if you change the order, ionic will install plugin only for current platform that is ios.

Ygalbel
  • 5,214
  • 1
  • 24
  • 32
  • 1
    If you add firstly the plugin it will be added only for current platform IOS. If you add android platform first, plugin will be added for both. – Ygalbel Mar 31 '16 at 18:09
  • I added both the inappbrowser and whitelist plugin, and it worked! However it complains that I am not using a meta content security tag. I added the following suggested meta tag into the application However when I include this meta tag I get an error. – Stephen Mar 31 '16 at 18:09
  • This is the error I receive: Refused to connect to 'https://api.backand.com/1/objects/player/' because it violates the following Content Security Policy directive: "default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'". Note that 'connect-src' was not explicitly set, so 'default-src' is used as a fallback. – Stephen Mar 31 '16 at 18:10
  • Thanks for the response, I verified on both android and iphone it is working, yet again it is failing when I add the content security policy in the meta tag. – Stephen Mar 31 '16 at 18:45
  • You need to add 'api.backand.com/1/objects/player/'; into the content security tag itself. The default one would reject that connection. – Linda Z Jul 21 '16 at 21:44