"Refused to set unsafe header 'Cookie' " while sending cookies with GET request in angular 6

Question

I am using spring security with angular 6. When i login using basic Auth server sends a cookie JessionID with response. I want to send this cookie with other request for authentication purpose but it gives me error Refused to set unsafe header 'Cookie' . When i hit the same endpoint from postman with same cookie in header it works.

Below is the method in angular:

Note: Currently i am manually adding it with headers.

private heroesUrl = 'http://localhost:8080/hi';
     header = new HttpHeaders().set("Cookie", "JSESSIONID=A2A75EC9A3E1172D60060C6E708549B5");
    getMessage() :Observable<Message>{
      return this.http.get<Message>(this.heroesUrl,{headers:this.header});
    }

Response which i get when i login using basic Auth

Answer 1

You can't do this, cause the browser doesn't allow you to do it. Let me describe the problem here:

Did you notice the Set-Cookie: JSESSIONID=......; Path=/; HttpOnly in your response headers? Well, The problem is the HttpOnly flag. Actually :) it's not a problem, it's a feature to prevent attacks that aim to steal your browser cookies:

HttpOnly is a flag added to cookies that tell the browser not to display the cookie through client-side scripts (document.cookie and others). ... When you set a cookie with the HttpOnly flag, it informs the browser that this special cookie should only be accessed by the server

So the browser doesn't allow any javascript code to access this variable. If you could change that value, then it's not a HttpOnly flagged cookie anymore:)

If you want to send this cookie via javascript, you should send it via the Authorization header for example and write middleware in Java server so that it captures these values from the Authorization header and think of them as JSESSIONID cookie. No more options for you :)