Access-Control-Allow-Origin error when using ember.js (with ember-cli)

Question

Here are my routes at (app / routes / customers.js):

export default Ember.Route.extend({ model: function() { return $.getJSON("http://127.0.0.1:3000/odata/customers"); } }); 

here is my router.js:

 export default Router.map(function() { this.route('customers', {path: '/'}); }); 

http://localhost:4200/ //127.0.0.1∗000/odata/customers is my api, but ember-cli uses http://localhost:4200/ , when I open http://localhost:4200/ ,

in the console, error message: XMLHttpRequest cannot load http://127.0.0.1:3000/odata/customers. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:4200' is therefore not allowed access. XMLHttpRequest cannot load http://127.0.0.1:3000/odata/customers. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:4200' is therefore not allowed access.

I find an article: https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS

so I know what is wrong, but I do not know how to fix it when using ember.js.

Sorry for my poor English, hope this is clear ...

Answer 1

This is not Amber, this is a problem. it is a server in port 3000. If your Ember application runs on a different port, it is basically a cross-domain, and therefore the server on port 3000 must have CORS enabled. An example of this is for node js and the expression: http://enable-cors.org/server_expressjs.html You need to figure out how to do this for your end. But it comes down to simply adding the right headers to the response stream.

Another example:

http://enable-cors.org/server_iis7.html

http://enable-cors.org/server_php.html