Access Control Allow Origin issue in Angular 2

by

Access-Control-Allow-Origin is a response header, not a request header.

You need to have it appear on the response, not the request.

You have attempted to put it on the response:

resp.setHeader('Access-Control-Allow-Origin','*')

… but it hasn’t worked.

This is probably because you haven’t put it on the response to the right request. The error message says:

Response to preflight request doesn’t pass access control check

You have done something to make the request preflighted. This means that before the browser makes the GET request you are trying to make, it is making an OPTIONS request.

This is, presumably, being handled by a different piece of code on your server so the line resp.setHeader('Access-Control-Allow-Origin','*') isn’t being hit.

One thing that causes a preflighted request to be made is the addition of request headers (other than a small number of exceptions). Adding Access-Control-Allow-Origin to the request will trigger a preflighted request, so the first thing to do to try to fix the problem is to remove Access-Control-Allow-Origin from the request.

If that fails, then you need to set up your server so it can respond to the OPTIONS request as well as the GET request.

More Related Contents:

  1. I want to create a color picker in ionic app [closed]
  2. What does enctype=’multipart/form-data’ mean?
  3. Binding select element to object in Angular
  4. What to use in place of ::ng-deep
  5. How to declare a variable in a template in Angular
  6. Angular 2 Dropdown Options Default Value
  7. Show loading screen when navigating between routes in Angular 2
  8. Angular2 – Input Field To Accept Only Numbers
  9. What is “X-Content-Type-Options=nosniff”?
  10. Angular 2 Checkbox Two Way Data Binding
  11. Detect click outside Angular component
  12. Angular 2 Remove Hash (#) from the URL
  13. How can I repeat a piece of HTML multiple times without ngFor and without another @Component?
  14. How to load image (and other assets) in Angular an project?
  15. Dynamically ADDING and REMOVING Components in Angular
  16. Spring Boot with AngularJS html5Mode
  17. Angular2, what is the correct way to disable an anchor element?
  18. How to convert input value to uppercase in angular 2 (value passing to ngControl)
  19. How to remove the previously selected option from a drop-down menu in a table?
  20. How to show split header in the material table having nested group of data in angular
  21. How to render string with html tags in Angular 4+? [duplicate]
  22. Remove host component tag from html in angular 4
  23. Detecting real time window size changes in Angular 4
  24. Angular4 – Scrolling to anchor
  25. How to translate HTML string to real HTML element by ng-for in Angular 2?
  26. Angular2 without hash in the url
  27. Get Angular2 routing working on IIS 7.5
  28. Using HTML anchor link fragment in Angular 6
  29. Create tree view with horizontal and vertical lines showing the connectivity using css
  30. How to serve up images in Angular2?

Leave a Comment