Share cookie between subdomains

[Bazhan4ik]

Describe the bug

A cookie that was set on one subdomain can't be accessed on another. I want user's to login on account subdomain, save the cookie and when the user goes to dashboard it can be logged in.

Steps to Reproduce

None of the methods below work:

            this.cookieService.set("smjwt", result.token, new Date(result.expires), "/", ".localhost");
            this.cookieService.set("smjwt", result.token, new Date(result.expires), "/", "*.localhost");
            this.cookieService.set("smjwt", result.token, new Date(result.expires), "/", "dashboard.localhost");
            this.cookieService.set("smjwt", result.token, new Date(result.expires), "/", "localhost");

Please provide a link to a minimal reproduction of the bug. StackBlitz, CodePen or CodeSanBox

https://stackblitz.com/edit/angular-ivy-udfbca?file=src%2Fapp%2Fapp.component.html,src%2Fapp%2Fapp.component.ts

Expected behaviour

I want the cookie to be accessible on all the subdomains on my app

What version of the library you see this issue?

15.0.0

What version of Angular are you using?

Angular 13

Screenshots

No response

Desktop? Please complete the following information

No response

Mobile? Please complete the following information

No response

Anything else?

No response

[github-actions[bot]]

Hello 👋 @Bazhan4ik
Thank you for raising an issue. We will investigate into the issue and get back to you as soon as possible. Please make sure you have given us as much context as possible.
Feel free to raise a PR if you can fix the issue

[mkumar92]

@Bazhan4ik

I have also faced this issue, this solution work for me

this.cookieService.set('cookieName', data, { expires: new Date(), path: '/', sameSite: 'Strict' });

[boubou158]

Same here, i am also looking for an answer, @mkumar92 your solution does not work for me unfortunately.

[Bazhan4ik]

Sorry @mkumar92, your solution doesn't work for me either

[boubou158]

@Bazhan4ik There is a possibility it only does not work for localhost. I am currently doing a test with another domain from localhost. What i am trying to do is to create a cookie from a subdomain to its parent domain: example test.mydomain.com will create a cookie on mydomain.com to be readable by all others sub domains.

I will keep you posted once deployed :)

[mkumar92]

@boubou158 yes, this is working only on live domain.

[Bazhan4ik]

I think this is because browsers don't treat localhost as a real domain. This question's answer could be a workaround for localhost: https://stackoverflow.com/questions/38669040/share-cookies-to-subdomain-on-localhost

[boubou158]

Thanks a lot for the hint. In fact, localhost do not work the same way as per any deployed application on real domains. It is working fine once deployed. I think the solution you shared for localhost could work, i did not try personnally but it is worth a try if you really need it. I think it would be a good idea to add this in the documentation of the library to prevent other users to struggle as well.

[Bazhan4ik]

I couldn't find any solution about setting cookies to subdomains of localhost, but I found a workaround for development and testing cookies.

You can set .domain.com (which is all subdomains of domain.com domains) only if your domain has at least one dot in it. You can't set .localhost because localhost doesn't have a dot it in.

Workaround for development

What you can do is redirect a random domain to your localhost For example redirect mydomain.com to localhost and then you can set cookies to all subdomains of mydomain.com like this .mydomain.com

To redirect mydomain.com to localhost you will have to open c:\windows\system32\drivers\etc\hosts file and add some lines after the comments:

127.0.0.1    yourdomain.com
127.0.0.1    subdomain.yourdomain.com

There is 127.0.0.1 because localhost is redirected to 127.0.0.1 too, so instead of redirecting yourdomain.com to localhost and then to 127.0.0.1 you can just redirect yourdomain to 127.0.0.1.

Now you can use this method to save cookie to all subdomain of yourdomain.com

this.cookieService.set("name", value, 1, "/", ".yourdomain.com");

Don't forget the port! subdomain.yourdomain.com:3000 if your domain is yourdomain.com

[pavankjadda]

@Bazhan4ik I have tried this in https://setcookie.net/ and it works fine as expected. We need more details

Please everyone note that you can set a cookie from a subdomain on a domain (sent in the response for requesting subdomain.example.com)

Set-Cookie: name=value; Domain=example.com // GOOD

But you can't set a cookie from a domain on a subdomain(sent in the response for requesting example.com)

Set-Cookie: name=value; Domain=subdomain.example.com // Browser rejects cookie

And see https://stackoverflow.com/a/57803192/9244861 for more details on this

[Bazhan4ik]

Yes, it works on https://setcookie.net/ because setcookie.net has a dot in it. To set a cookie for all subdomains of a domain the domain has to have a dot in it. For example, if your domain is setcookie.net you can set a cookie .setcookie.net, but you can't set .localhost for all subdomains of localhost because localhost doesn't have a dot in it.

It will work when you host your website with a real domain, but on development (on localhost) you can only set cookie for localhost, meaning that on development (on localhost) if your website has subdomains, the subdomains will not see the cookie because you can't set .localhost cookie.

To test your cookies on development you have to use fake domain, a domain that will redirect to 'localhost'. Above there is a workaround.

Thanks @pavankjadda for replying!