pipech
March 30, 2021, 3:48pm
1
Scenario
I’m using Frappe as Headless CMS and using React as a frontend.
Frappe Backend will be locate on ‘https://v13.testing.apps ’
React Frontend will be locate on ‘https://fe.testing.apps ’
Problems
I can’t get frontend to register cookies on the domain with out specify the domain name on cookies such as this.
Set-Cookie: sid=0347dfc3cdbdbbfb7abfce3b4cff9a3a0ec7da3b2934bc891a98ed3e; Domain=.testing.apps; Expires=Fri, 02-Apr-2021 15:09:36 GMT; Secure; HttpOnly; Path=/; SameSite=Lax
Without Domain=.testing.apps
cookies will be set to backend domain and it won’t presist after reload page
Cookies will be save to storage only after I’ve add Domain=.testing.apps
to set cookie response.
Things I’ve tried to fixed this problem
Set allow_cors
on frappe site config "allow_cors": "https://fe.testing.apps:3000"
Add withCredentials: true
to axios call
Set both frontend and backend to use SSL (I don’t think this is related, it just some thing I’ve tried before ended up adding domain to set-cookies)
Question
Should we add domain config to set cookies function on frappe ?
So that we can set cookies to another domain.
Or am I just mis-config something?
Proposal
Some thing like this to set cookies function on frappe .
Function will get cookies domain from site_config.json so that we will be able to set cookies on another subdomain.
self.cookies[key] = {
"value": value,
"expires": expires,
"secure": secure,
"httponly": httponly,
"samesite": samesite,
"domain": get_domain_name_from_site_config(),
}
Limitation, domain name set in site config must be parent domain for both Frontend and Backend or else it’ll end up causing error for backend.
Or we could add a function to check if request comes form CORS domain, if it is return cookie with that domain.
How did you set the domain in each of the cookies?
pipech
December 30, 2021, 4:29am
4
I just hard code domain
value into the cookies.
So it’ll be something like this in frappe/frappe/auth.py
file.
self.cookies[key] = {
"value": value,
"expires": expires,
"secure": secure,
"httponly": httponly,
"samesite": samesite,
"domain": "testing.apps",
}
But for production I’m not sure about this but I believed you can add domain header using nginx config.
sumanth
December 30, 2021, 8:40am
5
1.React and any other frontend frame work if you are using frappe as a backend after login cookies will store in web browser. After that you have to use that cookies like example you have to set with-credentails as true in api. Browser will automatically attach that cookies
2.if you have cros issues use nginx to overcome
Please feel free post questions on this topic I can help you further
dont’t try to change any code on frappe core API
Rafi
December 30, 2021, 12:58pm
6
I am developing an angular app and considering frappe as back end.
Is it OK to use JWT instead of cookie If I am using frappe as back end?
Even if I am using JWT to authenticate users I have to store api_key and api_secret at the browser’s localstorage .Is it OK to store api_key and api_secret at the browser’s localStorage of browser?
sumanth
December 30, 2021, 1:16pm
7
No option to use JWT you have to use basic, frappe api_key and secret or sso auth.you can create keys on frappe
Rafi
December 30, 2021, 1:36pm
8
So Is it OK to store api_key and api_secret at localStorage?
Don’t do that api_secret mechanism you can use for server to server communication
why should not use api_key and secret_key for client side? Is there any specific reason?
Rafi
January 3, 2022, 1:59pm
11
Could you please what is the exact purpose of api_key and api_secret?
Have you checked GitHub - castlecraft/portal_spa from @revant_one ?
Also regarding jwt and overall authentication, check also GitHub - castlecraft/castlecraft_auth as a reference.
Rafi
January 3, 2022, 9:35pm
13
Could you please help me to configure castlecraft?
Did anyone get this to work on the different domain? I have the same issue as the original post.
Thanks!
ankush
January 3, 2023, 7:22pm
16
For developing SPAs using things like Vite do not use separate local domain, instead try to use separate port to avoid this problem altogether. A domain can’t set HttpOnly cookies for another domain that’s just not how cookies work.
Look at how all new Frappe UI based frappe apps are written for example.
1 Like