Missing headers in response for jQuery request with CORS

Question

I'm trying to execute CORS request with jquery buy I'm getting strange behaviour. When I use curl to execute the request everything is working fine. But when I use jQuery the things goes horribly wrong. In the "Network" tab in my browser I can inspect the request and the response from the back-end there everything is correct but although I have Access-Control-Expose-Headers: Set-Cookie header I get null when I try to print it out using console.log(response.getResponseHeader("Set-Cookie")); When I try to print out the response headers of my ajax request in the console with console.log(response.getAllResponseHeaders()) I get only these 3 headers:

Pragma: no-cache
Cache-Control: no-cache, no-store, max-age=0, must-revalidate
Expires: 0

The code that I'm using to execute requests is:

$.ajax({
    method: "POST",
    url: "http://localhost:8808/storage/login",
    data: {
        username: email,
        password: password,
    },
    success: function(data, textStatus, response){
        console.log(response.getAllResponseHeaders());
        console.log(response.getResponseHeader("Set-Cookie"));
        this.setState({showAlert: true, alertMessage: "You are logged in.", alertType: "success"});
    }.bind(this),
    error: function (xhr, status, err) {
        this.setState({showAlert: true, alertMessage: "Wrong email or password", alertType: "danger"});
    }.bind(this)
});

Answer 1

Are you making a cross domain request?

http://www.html5rocks.com/en/tutorials/cors/ :

During a CORS request, the getResponseHeader() method can only access simple response headers. Simple response headers are defined as follows:

• Cache-Control
• Content-Language
• Content-Type
• Expires
• Last-Modified
• Pragma

If you want clients to be able to access other headers, you have to use the Access-Control-Expose-Headers header. The value of this header is a comma-delimited list of response headers you want to expose to the client.