0

I'm sending an Angular http request with headers

 let auth = 'user:pass';
 const httpOptions = new HttpHeaders({
      'Content-Type': 'application/x-www-form-urlencoded',
      'Access-Control-Request-Headers': 'Content-Type, Authorization',
      'Authorization': 'Basic ' + btoa(auth)
  });
  this.http.get<any>(backendUrl, { headers: httpOptions })

on my php backend (that is protected with htaccess password) i have in the first lines of the .htaccess file:

Header set Access-Control-Allow-Headers "Content-Type, Authorization"
Header set Access-Control-Allow-Origin "*"
Header set Connection keep-alive
Header set Access-Control-Max-Age "1000"


SetEnvIf Host myproject.localhost passreq
AuthType Basic
AuthName "Password Required"
AuthUserFile "C:\wamp64\www\my-project\.htpasswd"
Require valid-user
Order allow,deny
Allow from all
Deny from env=passreq
Satisfy any

It works without any problem if I use direct backendUrl and enter the login and pass manually. It works without any problem if I use postman, givin the login and pass. In both case i have a response 200 But when i try via the angular component I have

Access to XMLHttpRequest at 'http://my-project.localhost/' from origin 'http://localhost:4200' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Some one can tell me where is the problem? i'm not able to find. thanks in advance...

Roberto Q
  • 1
  • 2
  • Does this answer your question? [Why does my JavaScript code receive a "No 'Access-Control-Allow-Origin' header is present on the requested resource" error, while Postman does not?](https://stackoverflow.com/questions/20035101/why-does-my-javascript-code-receive-a-no-access-control-allow-origin-header-i) – He3lixxx Jun 06 '21 at 13:41
  • The preflight request does not send any credentials. You need to configure your server to allow that one without asking for authorization, and you also need to indicate in the response, that the real request will be _allowed_ to be made with credentials, which it looks you have not done so far either. https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS#preflight_requests_and_credentials – CBroe Jun 07 '21 at 06:49
  • Thanks for your response. The backend website is protected by basic authentification and needs credentials. When I send the request with curl or postman, i receive the reponse with 200. why with angular does not work? is there some other particular configuration in the headers of the angular http request? I also added this header in the backend htaccess as you recommended... Header set Access-Control-Allow-Credentials true – Roberto Q Jun 09 '21 at 20:38

0 Answers0