Ionic native app is sending header Origin:file:// which causes problems

Question

I have started building simple Todo app in Ionic 1 and I discovered a problem with Origin header. (CORS related)

If i run

ionic serve

everything works fine in browser and i can make requests to my REST API on apache(tomcat). But when build my app for android or even in ionic viewer, all requests fail. Using a chrome debugger I managed to locate the problem.

Native app sends header (tested only on android)

Origin: file://

which causes my server to deny requests. Seems to me that it should send correct Origin header with host. Screenshot with more details is attached below.

What can I do about that?

Found related topic here: CORS, Cordova, AngularJs $http and file:// confusion

Already posted here, with no luck: https://forum.ionicframework.com/t/native-app-is-sending-header-origin-file-which-causes-problems/62388/1

EDIT: Problem occurs when post, if I run ionic starter (tabs) template with only $http.post('http://myapp.com/apiv1/device') added to controller.

Answer 1

Try adding the following to your allowed origin request: "file://* filesystem: "

I had the same problem with <iframes> in Ionic and I fix it adding:

Header set Content-Security-Policy "...; frame-ancestors 'self' file://* file://*/* filesystem: http://localhost:*;"

Answer 2

It seems that the problem comes from the server (specifically from Tomcat).

According to this bug:

https://bz.apache.org/bugzilla/show_bug.cgi?id=60008

The default CORS filter provided by Tomcat (instances/shared/conf/web.xml) doesn't allow POST requests and returns 403. The problem is solved from Tomcat version 8.0.37, so upgrading the server should solve your problem.

Regards.