Browser won't store cookie

Question

I'm running an angular 4 client on localhost:3000, which is communicating with a WEB API localhost:5000. My problem is, that I can't figure out why the browser refuses to store a cookie, when the server instructs it to do so.

Client Request Headers

Request URL:https://local.dev:5000/user/list?page=1&column=Email&listOrder=2 Request Method:POST Status Code:200 OK Remote Address:127.0.0.1:5000 Referrer Policy:no-referrer-when-downgrade Accept:application/json Accept-Encoding:gzip, deflate, br Accept-Language:en-NZ,en-GB;q=0.8,en-US;q=0.6,en;q=0.4 Cache-Control:no-cache Connection:keep-alive Content-Length:0 Content-Type:application/json DNT:1 Host:local.dev:5000 Origin:https://localhost:3000 Pragma:no-cache Referer:https://localhost:3000/user

Server Response Headers:

Access-Control-Allow-Credentials:true Access-Control-Allow-Origin:https://localhost:3000 Cache-Control:no-cache Content-Type:application/json; charset=utf-8 credentials:include Date:Tue, 09 May 2017 08:22:25 GMT Expires:-1 Pragma:no-cache Server:Kestrel Set-Cookie: <cookiename>=<somedata>; expires=Tue, 09 May 2017 09:22:23 GMT; domain=local.dev; path=/; secure; httponly Transfer-Encoding:chunked Vary:Origin withCredentials:true

As you can see CORS is also enabled. HTTPS is used for transmission. Also tried without setting an expiration date. The cookie's domain is set to local.dev. I also tried with / and localhost.

Afterwards Chrome's debug view does not display the cookie. Just some default angular cookie. Therefore I assume the set-cookie header is ignored for some reason.

HELP!

Did you specify that cookies should be accepted for cross-domain requests in your API call? — C3roe
– C3roe, Commented May 9, 2017 at 8:51
That’s what the withCredentials flag of XMLHttpRequest is for. (How that translates into angular, please research yourself.) — C3roe
– C3roe, Commented May 9, 2017 at 8:53
@CBroe Access-Control-Allow-Credentials is true on the server's repsonse if that's what you mean. — wodzu
– wodzu, Commented May 9, 2017 at 9:33

Community · Accepted Answer · 2017-05-23 12:34:31Z

4

For cross-domain AJAX requests, you need to explicitly specify that cookies should be send with the request, and accepted in the response.

This is done using the withCredentials flag of the XMLHttpRequest object.

In Angular, you can set it as an option of the $http service, see also AngularJS withCredentials

edited May 23, 2017 at 12:34

CommunityBot

11 silver badge

answered May 9, 2017 at 9:52

C3roe

97.6k15 gold badges100 silver badges172 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

wodzu Over a year ago

I don't see any difference in neither request and response headers, do you know why it is important to explicitly set that option? I thought the browser is repsonsible to store the cookie and not the application itself.

C3roe Over a year ago

You should see a difference in request headers, if you are sending cookies, or additional credentials such as for HTTP Auth. In the response you don’t see a difference, because the server tries to set the cookie anyway. The withCredentials flag determines whether the browser accepts that cookie from the response header for cross-domain requests.

Collectives™ on Stack Overflow

Browser won't store cookie

1 Answer 1

2 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Linked

Related