1

How to send http only cookies with every request in decoupled frontend and backend? My frontend and backend are deployed through heroku , frontend is here :- https://chatapp-client-12345.herokuapp.com/

backend is here :- https://chatappbackend12345.herokuapp.com/

I want to send my http only cookie(containing jwt) to my backend with every request that I set with my backend like this :-

// generate jwt
    let jwtToken = jwt.sign({
        email:email,
        userId:userData._id
    },"somesupersecret");
    res.cookie("jwtToken",jwtToken,{
        expires:new Date(Date.now() + 3600000),
        httpOnly:true,
        domain:"chatapp-client-12345.herokuapp.com"
    });

but the http only cookie is not set in the frontend

Through my research I came to know that I can only access cookie on same domain , but what should I do if my frontend and backend are decoupled?

my backend is based on node js built with rest apis and frontend containing simple html css js served with node js

BHANU ARORA
  • 81
  • 1
  • 8

1 Answers1

1

Assuming your domain is https://chatappbackend12345.herokuapp.com/, you could only set cookies on two domains:

(1) Exact domain and sub-domain:

chatappbackend12345.herokuapp.com

(2) Root domain:

.herokuapp.com

For your case, the domain of your frontend and backend is different, which means the cookies could never be able to access by both side simultaneously.

It is also not likely (or not feasible) to set the cookies to root domain, because you could hardly trust the cookies from websites not belong to you.

Domain and decoupling are separated concept. You could have the same domain while the frontend and backend applications remain decoupled.

One way to achieve it is by reverse proxy (Reference: nginx reverse proxy). You could add a reverse proxy on top of your frontend and backend, routing them to the same domain.

For instance, under your own domain, you could make your reverse proxy application with following routing policy:

https://chatappbackend12345.herokuapp.com/login: backend application https://chatappbackend12345.herokuapp.com/* : frontend application

For the case, cookies could be set in client side by your server, while both applications remain decouple.

For more information about cookies policy, please check rfc6265.

Atomyyy
  • 81
  • 2
  • How I can set a reverse proxy to share my http cookie? and one more thing below linked article conveys that I can share cookies between these two subdomains. https://stackoverflow.com/questions/18492576/share-cookie-between-subdomain-and-domain#:~:text=8%20Answers&text=Two%20different%20domains%20(e.g.%20mydomain,restricted%20to%20the%20request%20host. – BHANU ARORA Aug 12 '21 at 09:21
  • Yes, the cookies could be shared between two subdomains via root domain. In your case, if you set cookies in herokuapp.com, both of your subdomains could obtain the cookies. However, I am not sure if this would work in your case, as herokuapp.com isn't a domain own by you and there might be some logic removing third party hosting website from setting cookies in root domain. You could try to set cookies in your root domain and see if it works first. – Atomyyy Aug 13 '21 at 09:46
  • However, even if it works, it is not a recommended approach. Imagine that you could set cookies to the root domain, but so do other herokuapp user. There is no a real integrity on the root domain cookies, as it could be set by any other herokuapp user. – Atomyyy Aug 13 '21 at 09:49
  • To setup a reverse proxy, you could check this [website](https://www.docker.com/blog/how-to-use-the-official-nginx-docker-image/) – Atomyyy Aug 13 '21 at 09:50