R
Railway10mo ago
Tonquin

Hosting Django backend and React frontend from the same Domain

I have two services, one for my backend and one for my frontend. They currently have two separate domains. I've been having some headache handling things like http only cookies so far... So, after doing some research (googling) I see that some people use NGINX to route requests to either the backend or frontend, and it all works under the same domain. Does anyone have advice for accomplishing this? Not sure if this is more work than dealing with the separate frontend/backend domains. Any advice is much appreciated 🙂
49 Replies
Percy
Percy10mo ago
Project ID: N/A
Tonquin
Tonquin10mo ago
N/A
Brody
Brody10mo ago
do I have the template for you https://railway.app/template/7uDSyj
Tonquin
Tonquin10mo ago
Wow this looks amazing, thank you so much!!! ❤️
Brody
Brody10mo ago
no problem, be sure to read the overview very closely
Tonquin
Tonquin10mo ago
Okay I think I have it set up pretty well! I am able to login and cookies get set correctly now, then able to hit my authenticated route and it returns data correctly. I am wondering if it's possible to access Django's admin view. I would like to have it in for now so I can set up some stuff to try to get my "Sign in with Google" working. I commented out the admin line in the Caddy file but still doesn't seem to let me log in. Also, if I go to the /admin route on the Caddy service it just takes me to the regular landing page.
Brody
Brody10mo ago
well that caddyfile is not a one size fits all solution by any means, that would be impossible, but lets see what you have for your current caddyfile
Tonquin
Tonquin10mo ago
I don't think I changed anything from what you provided
No description
Tonquin
Tonquin10mo ago
other than commenting the admin line for now
Brody
Brody10mo ago
what admin line? oh no that admin has absolutely nothing to do with django, that's caddy's admin thing, don't touch that please
Tonquin
Tonquin10mo ago
ohhhhhhh woops 😮
Brody
Brody10mo ago
one would think a comment on every line would be sufficient explanation 😉
Tonquin
Tonquin10mo ago
u underestimate my ability to misunderstand 🙂
Brody
Brody10mo ago
either way, if you want to proxy requests from /admin to the backend's /admin route you would need to add a reverse_proxy directive to handle that, there's a link to the docs for reverse_proxy in the template overview or readme file
Tonquin
Tonquin10mo ago
hmm okay, I will try to look into that a bit more. I can access the admin route if I go to the backend service, just seems like there are no styles cause my static files don't seem to be loading properly. Also doesn't seem to redirect me to the admin panel once I log in as a super user. Maybe trying to figure that out first is the better play though 🤔
Brody
Brody10mo ago
yeah common issue with improperly setup django apps
Tonquin
Tonquin10mo ago
Any idea if that's something wrong with how I set static up here or something else
No description
Brody
Brody10mo ago
no clue I'm not a django dev lol but are you running collect static in your start command?
Tonquin
Tonquin10mo ago
Yep
Tonquin
Tonquin10mo ago
No description
Brody
Brody10mo ago
I'm out of ideas then, sorry
Tonquin
Tonquin10mo ago
All good, you have helped a ton already!! Really appreciate it, thanks
Brody
Brody10mo ago
no problem 🙂 I'll still be around to help you with the proxy admin thing when you sort out the missing styles, though I do wanna see you attempt to add the proxy yourself since you wouldn't learn much if I did it for you 🙂
Tonquin
Tonquin10mo ago
of course, I will do my best to get that done on my own!!!
Brody
Brody10mo ago
well how did it go!?
Tonquin
Tonquin9mo ago
hey, so sorry for not ever responding to this! I got distracted with starting a new job and only have time to work on this on weekends im free. Just looking at it again for the first time this weekend. I ended up getting the styles working for the admin section which I think was just an issue with how I set up the static files. I'm trying to get my local development setup running right now with the proxy and also trying to set up a dev environment on railway. Just interested in getting a solid development "pipeline" going if that makes sense
Brody
Brody9mo ago
ah gotcha, well I wish you luck!
Tonquin
Tonquin9mo ago
thanks!! 🙂
Tonquin
Tonquin9mo ago
Having a bit of struggle getting things set up locally... I create a docker image: docker build -t caddy-proxy . Run a container from the image with PORT, FRONTEND_HOST, BACKEND_HOST added (1st image). Go to localhost:8080 and get a empty response error (2nd image). Verified that my backend and frontend are both running correctly on the right port
No description
No description
Tonquin
Tonquin9mo ago
Any help appreciated as always but i know its been a super long time since this thread was started lol
Brody
Brody9mo ago
try replacing localhost with http://127.0.0.1 also these highly cropped screenshots are not doing you any favours
Tonquin
Tonquin9mo ago
hmm still seem to be having the same issue
Tonquin
Tonquin9mo ago
No description
Tonquin
Tonquin9mo ago
No description
Brody
Brody9mo ago
can you show me that you can access the frontend and backend via those urls you have set in those variables
Tonquin
Tonquin9mo ago
No description
No description
Brody
Brody9mo ago
and show me trying to access those same pages from the proxy
Tonquin
Tonquin9mo ago
No description
Brody
Brody9mo ago
please stop using localhost lol
Tonquin
Tonquin9mo ago
sorry :/
No description
Brody
Brody9mo ago
now show me trying to access the backend through the proxy
Tonquin
Tonquin9mo ago
1st image: accessing it directly from backend url 2nd image: trying to access it from proxy
No description
No description
Brody
Brody9mo ago
does this work on railway
Tonquin
Tonquin9mo ago
yeah it does
Brody
Brody9mo ago
well then I have no clue, you're doing something wrong locally, and I have never used docker locally honestly you should throw out the whole proxy thing and just do two separate services, this proxy stuff is adding too much complexity
Tonquin
Tonquin9mo ago
ya fair lol. I was mostly using the proxy so I could get auth tokens to be stored as http only cookies which seemed to only work if backend/frontend were served from the same domain. Think maybe thats overkill/too much hassle for me at this point I appreciate all your help! Thanks again.
Brody
Brody9mo ago
there is some funky stuff with cookies when you go across different domains, but an hour's worth of good research on that topic and you won't have any mor issues
Tonquin
Tonquin9mo ago
kk ill take a closer look at that instead!
Brody
Brody9mo ago
sounds good