Access-Control-Allow-Origin不允许AngularJS Origin http：// localhost：8080

Question

I'm developing a web app with AngularJS. It consists in an admin interface that rely on an json-rpc API that resides on another domain.

In my local enviroment, if I make a Request (with AngularJS) to API server I get the error "Origin http://localhost:8080 is not allowed by Access-Control-Allow-Origin" in my console Browser".

I've read the limit of modern browsers to blocking the request to another domain, but.... if there is no solution... Do I need to create my web service (with one backend language: es: PHP or Python) that make requests to API web server and then make the AngularJS request to this?

Why I need another "web server" in the middle of my application infrastructure?

Thanks in advance. F.

Update: I've read about crossdomain.xml file here: http://www.adobe.com/devnet/adobe-media-server/articles/cross-domain-xml-for-streaming.html

Does it could be, in someway, the solution of my problem?

Answer 1

Because server must send headers with CORS enabled when responding to ajax requests. Something like:

'Access-Control-Allow-Origin', '*'

'Access-Control-Allow-Credentials', true

'Access-Control-Allow-Methods', 'POST, GET, PUT, DELETE, OPTIONS'

'Access-Control-Allow-Headers', 'Content-Type'

But read more about CORS to protect your server. Current internet browsers checks for these headers when You are sending ajax communication. It is for security reasons.

Answer 2

Having a web server is always an option, but if you want to stay on the client, consider using JSONP. Read about it here: What is JSONP all about?