https://api.aonesalons.com/dbsynch/webocitysalonpos/ When I send a request to the mentioned URL from POSTMAN, it works fine.
However, when sent through my angular application, running at demo.aonesalons.com,
I get:
Failed to load https://api.aonesalons.com/dbsynch/webocitysalonpos/: The 'Access-Control-Allow-Origin' header contains multiple values '*, https://demo.aonesalons.com', but only one is allowed. Origin 'https://demo.aonesalons.com' is therefore not allowed access. If I directly hit https://api.aonesalons.com/dbsynch/webocitysalonpos/in browser, it works. However, when the same url is accessed from angular app running at demo.aonesalons.com, it throws multiple CORS header error
In angular app or on directly hitting it in browser, I see that response for this request is 200, with this response:
Access-Control-Allow-Credentials:true Access-Control-Allow-Headers:* Access-Control-Allow-Origin:* Access-Control-Allow-Origin:https://demo.aonesalons.com Access-Control-Expose-Headers:Cache-Control, Content-Type, Server Cache-Control:must-revalidate, max-age=172800 Connection:close Content-Length:240 Content-Type:application/json Date:Sun, 25 Feb 2018 05:02:27 GMT Expires:Tue, 27 Feb 2018 05:02:27 GMT Server:CouchDB/1.6.1 (Erlang OTP/R14B04) When I hit it through postman,
access-control-allow-headers →* access-control-allow-origin →* cache-control →must-revalidate, max-age=172800 connection →close content-length →240 content-type →text/plain; charset=utf-8 date →Sun, 25 Feb 2018 05:11:50 GMT expires →Tue, 27 Feb 2018 05:11:50 GMT server →CouchDB/1.6.1 (Erlang OTP/R14B04) All my requests are proxied through apache server which has
Access-Control-Allow-Origin:*
but
before coming up with *, I had
#SetEnvIf Origin ^(https?://(?:.+\.)?aonesalons\.com(?::\d{1,5})?)$ CORS_ALLOW_ORIGIN=$1 #Header append Access-Control-Allow-Origin %{CORS_ALLOW_ORIGIN}e env=CORS_ALLOW_ORIGIN Now,
After having switched it to , all response headers have Access-Control-Allow-Origin: except for this request to couchdb . I am not sure where it is picking this from.
Here's what my ssl.conf looks like:
Header always set Access-Control-Allow-Headers "*" Header always set Access-Control-Allow-Origin "*" <VirtualHost *:443> ServerName api.aonesalons.com SSLEngine on SSLCertificateFile /home/user/abc.crt SSLCertificateKeyFile /home/user/bcf.key ProxyPreserveHost On ProxyRequests Off ProxyPass /dbsynch http://0.0.0.0:5984/ ProxyPassReverse /dbsynch http://0.0.0.0:5984/ ProxyPass / http://localhost:9999/ ProxyPassReverse / http://localhost:9999/ </VirtualHost> 1 Answers
Answers 1
As stated in the error message:
The 'Access-Control-Allow-Origin' header contains multiple values '*, https://demo.aonesalons.com', but only one is allowed Only one entry of Access-Control-Allow-Origin is allowed in a HTTP response. Now since you are using a ProxyPass, it is highly likely that the target application creates it's own header entry for Access-Control-Allow-Origin, which your Apache Server forwards - and in addition to that, it adds the entry containing *, since you specified this in your configuration.
So I guess that in your Angular app you have somewhere something like .header("Access-Control-Allow-Origin","(something)"); if you remove this, your app should be accessible via your Apache server.
Alternatively, you may remove the entry Header always set Access-Control-Allow-Origin "*" in your apache config and alter your Angular app in a way that it set the correct header.
0 comments:
Post a Comment