I got "The 'Access-Control-Allow-Origin' header contains multiple values '*, *', but only one is allowed. " error for an angular 2 application behind nginx server.

Jason Yu
Jason Yu used Ask the Experts™
on
Dear experts here:

I am working on an issue raised by our frontend web developer for his angular 2 application. The application is hosted on an nginx server with CORS configured. The Chrome throws an error and says multiple values for CORS. I am attaching the nginx configuration file in the attachment.



XMLHttpRequest cannot load http://dev-cms.avery.com/api/content/render/false/type/json/query/type:content%20+markerProductGroup-marker:6a12d922-ea1d-4a1b-8c46-3e3fbb9bcd5c. The 'Access-Control-Allow-Origin' header contains multiple values '*, *', but only one is allowed. Origin 'http://localhost:4200' is therefore not allowed access.
nginx.conf.txt
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Most Valuable Expert 2017
Distinguished Expert 2018
Commented:
Are you not adding another header in your actual script?

Author

Commented:
No, according to them, they didn't.

Author

Commented:
I tried to reproduce the issue on my laptop, I got the same error.

Angular is running in the development mode. Call enableProdMode() to enable the production mode.
markers:1 XMLHttpRequest cannot load http://dev-cms.avery.com/rest/product-filters. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:4200' is therefore not allowed access.
main.bundle.js:1137 Response
(anonymous) @ main.bundle.js:1137
Most Valuable Expert 2017
Distinguished Expert 2018

Commented:
No, according to them, they didn't.
According to who?

I put that url into an Angular app and it loads fine - see sample here

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial