Closed dleute closed 8 years ago
hi!
ws
is CORS-friendly, meaning it will accept requests from any origin. Is your API on a remote server? Are you proxying to a remote API?
So you want to customise the headers of the proxy request to your remote API?
I want the angular js on the locally hosted web server to be able to talk to another locally hosted api server on a different port.
To solve this we used a browser plugin. But it seems like setting that header to the api server value should solve this locally without plugins or other things.
I would prefer not to proxy as we would have to change the path of the api calls. Perhaps we don't need to do that? the goal would be to get calls to localhost:8080 to be accepted from the site located at localhost:8000 (this server)
I could proxy requests to localhost:8000/api -> localhost:8080/ but that would involve changing any code for that target url. (we may need to do that anyway, so production targets can be different from dev targets. etc)
I was hoping for a quick fix, like just setting the header so the browser doesn't block these calls while we develop.
Thanks for the fast response!
If you proxy /api/*
to localhost:8080/api/$1
it should work fine..
With that config, all requests to http://localhost:8000/api/blah
will be proxied to http://localhost:8080/api/blah
.
This is a common use case. Or did i misunderstand your issue?
Access-Control-Allow-Origin header not sent?
This is not a header that is "sent". Anyway, CORS does not affect local-web-server proxy requests. One of the main benefits of proxying to an API via local-web-server is that you bypass the API server CORS config.
The problem is the target API is at the root of the domain. So to do a proxy I would either have to identify all url's (and hope they don't conflict with the UI url's). so to do /api I have to change a lot of code currently.
Isn't Access-Control-Allow-Origin a response header sent from the server that tells the client that JS can talk to certain sites?
in that case, proxy /api/*
to localhost:8080/$1
.
Yes, it's a response header but it only affects requests coming from the browser. When local-web-server proxies a request from /api/resource
to localhost:8080/resource
it pays no attention to CORS.
but that means all of my code has to be modified to hit /api instead of / as it does now (which is unfortunately not trivial at the moment). So the proxy solution is not ideal.
I may not have a correct understanding of the header. Is it possible my API response needs to set the Access-Control-Allow-Origin header allowing calls from the originating site?
browser makes request to local-web-server (localhost:8000)-> returns html -> browser processes html and JS and makes a request to localhost:8080/ which is blocked.
Using a proxy is not ideal because the request to localhost:8000 would need an additional path to forward. /api which would then map to localhost:8080/ That would require code changes to the underlying JS. That is why this isn't a good solution.
What I want to do for the sake of development, tell the browser it is ok to talk to localhost:8080. My understanding is that is the point of the Access-Control-Allow-Origin header. Is that wrong?
yes, your API server responses need this header to permit requests from different origins:
Access-Control-Allow-Origin: *
Ok, that may be easier to accomplish.
Thanks! One of the problems is spring data rest didn't honor cors configurations. But I did get it to output a proper header.
Thanks for the help.
I'm running in single page application mode. I never see this header which is preventing api calls to my backend from working while in development mode.
The docs say this:
CORS-friendly, all origins allowed by default.
making me think it should be set by default.Furthermore, I thought there would be a way to customize headers. I can't find any documentation that shows how to add specific headers to all request responses. Is that possible?
Thanks!