Why is same origin policy kicking in when making request from localhost to localhost?

Question

I\'m keeping the backend API as a separate project from the frontend HTML5 app consuming it. I\'m using Yeoman for the frontend development. Yeoman runs on localhost:3501 an

Answer 1

According to W3C, "An origin is defined by the scheme, host, and port of a URL", so the different port is causing your problems.

Two possible solutions:

• CORS (Cross Origin Resource Sharing)
• Using JSONP requests

Both would require changes to your backend (I'm not familiar enough wo. CORS would probably mean the least changes to your frontend (I think AngularJS supports it out-of-the-box).

Answer 2

The ports also count for cross domain requests, therefore http://localhost:3000 and http://localhost:3501 are 2 different domains (from browser's point of view).

If you need both applications (client and backend) to run on different ports, consider using http://enable-cors.org/