0
votes

For some reason angular is not sending the Authorization headers for POST requests

// DOES NOT SEND HTTP HEADERS
let request = this.http.post(root + '/api/lands/favourites', {
  headers: new HttpHeaders({
    'Authorization': 'Bearer mytoken',
    'Accept': 'application/json'
  })
});
request.subscribe();

If I change the HTTP verb, it works perfectly

let request = this.http.delete(root + '/api/lands/favourites/'+landId, {
  headers: {
    'Authorization': 'Bearer myToken',
    'Accept': 'application/json'
  }
});
request.subscribe();

I can see the pre-flight request working, the second request however lacks the authorization headers, so it fails to authenticate returning a 401.

I cant find any information on why angular does this.

CORS pre-flight request:

OPTIONS /api/lands/favourites HTTP/1.1
Host: api.tierras.landium.test.com.ar
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache
Access-Control-Request-Method: POST
Origin: http://tierras.landium.test.com.ar
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/537.36
Access-Control-Request-Headers: content-type
Accept: */*
Accept-Encoding: gzip, deflate
Accept-Language: es-ES,es;q=0.9

CORS pre-flight response:

HTTP/1.0 200 OK
Date: Mon, 13 Aug 2018 20:29:06 GMT
Server: Apache/2.4.33 (Win32) OpenSSL/1.1.0h PHP/7.2.5
X-Powered-By: PHP/7.2.5
Cache-Control: no-cache, private
Access-Control-Allow-Credentials: true
Access-Control-Allow-Origin: http://tierras.landium.test.com.ar
Access-Control-Max-Age: 50000
Access-Control-Allow-Methods: POST
Access-Control-Allow-Headers: accept, accept-language, content-language, content-type, authorization, accept-encoding, cache-control, connection, pragma
Content-Length: 0
Connection: close
Content-Type: text/html; charset=UTF-8

Actual POST request that follows

POST /api/lands/favourites HTTP/1.1
Host: api.tierras.landium.test.com.ar
Connection: keep-alive
Content-Length: 52
Pragma: no-cache
Cache-Control: no-cache
Accept: application/json, text/plain, */*
Origin: http://tierras.landium.test.com.ar
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/537.36
Content-Type: application/json
Referer: http://tierras.landium.test.com.ar/land/5
Accept-Encoding: gzip, deflate
Accept-Language: es-ES,es;q=0.9

Response from the server

HTTP/1.1 401 Unauthorized
Date: Mon, 13 Aug 2018 20:29:06 GMT
Server: Apache/2.4.33 (Win32) OpenSSL/1.1.0h PHP/7.2.5
X-Powered-By: PHP/7.2.5
Cache-Control: no-cache, private
X-RateLimit-Limit: 60
X-RateLimit-Remaining: 57
Access-Control-Allow-Origin: http://tierras.landium.test.com.ar
Vary: Origin
Access-Control-Allow-Credentials: true
Access-Control-Expose-Headers: *
Content-Length: 30
Keep-Alive: timeout=5, max=99
Connection: Keep-Alive
Content-Type: application/json
1
Does the preflight include Access-Control-Allow-Credentials: true? - Tobias K.
I just did, no changes :/ - Joaquin Brandan

1 Answers

6
votes

If you send a post, i think you shoud add body with post.

// DOES NOT SEND HTTP HEADERS
let request = this.http.post(root + '/api/lands/favourites', {BODY}, {
   headers: new HttpHeaders({
   'Authorization': 'Bearer mytoken',
   'Accept': 'application/json'
 })
});
request.subscribe();

atleast empty {}