This project is primarily set up to show you how to access API's without CORS using the Ionic proxy server.
There are two parts to this project:
- The Api Server hosted at
- The Ionic web server hosted at
We want to make requests to the Api server at
localhost:3000 from the Ionic server at
localhost:8100 via an AJAX request. This will require CORS and fail due to the Api server not allowing the origin
localhost:8100 if we use
ionic serve or
ionic run -l:
XMLHttpRequest cannot load http://localhost:3000/api/endpoint. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8100' is therefore not allowed access.
Points of reference
ionic.project for configuring the proxy server. Notice how we set the
/api - signifying any request to the Ionic server
http://localhost:8100/api will retrieve requests to the
www/js/app.js for setting up the Api Endpoint as an AngularJS constant. Notice here the address is pointed at the Ionic server.
www/js/services.js for using the AngularJS constant.
www/js/controllers.js for using the AngularJS service.
gulpfile.js to see how the gulp tasks are set up to replace your URL's in your files.
Run the following commands, the last two may require another console/terminal window: