Jefferson Maretti
Jefferson Maretti

Reputation: 25

No access control allow origin ionic project with java rest backend

I am trying to access my java backend through my ionic application, but i receive the following error:

XMLHttpRequest cannot load http://localhost:8080/mybackend/rest/.... No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.

I did this configuration: http://ionicinaction.com/blog/how-to-fix-cors-issues-revisited/

But still not working.

I'm testing this with ionic serve in a browser.

Upvotes: 0

Views: 1326

Answers (2)

Robert Moskal
Robert Moskal

Reputation: 22553

I'm making the assumption that you are running the built in ionic server which starts on port 8100. If you are using the proxy setup described in the link, then you should be hitting your api end points against

http://localhost:8100/mybackend/rest/..

You appear to be directly hitting the java app (often on port 8080). If you want to hit your api server directly, then you need to set up CORS on the java/spring side. Doing that is plenty well documented.

Otherwise you need to configure the api url for the angular $http service. To use the proxy, you must hit port 8100.

Upvotes: 0

MHX
MHX

Reputation: 1601

Your question is a little bit vague, like how are you testing this? What device? I suppose it must be one of the following 2 situations:

  1. Testing in your browser (ex: Google Chrome) Since you're developing on localhost, you may get these so called CORS-erros. A simple solution for Google Chrome, would be installing a plugin which handles this. Install the Google Chrome Allow-Control-Allow-Origin: * extension. Now your calls won't throw errors hopefully.

  2. Testing on an emulator or a real device after a deploy/build

If you're using a newer version of Cordova (or the latest Ionic CLI) to develop your app, you may be experiencing http 404 errors when your app tries to make network requests.

This can be solved quickly with Cordova Whitelist plugin.

You can find more documentation on Ionic docs: Cordova Whitelist.

Solution:

Run the following command in your shell/terminal:

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

The only thing you need to do now is to add a property to your config.xml file:

<allow-navigation href="*" />

Upvotes: 1

Related Questions