terse pier
Hi! So, I'm trying to dockerize my flask web app, so far I have got Docker installed and working with its helloworld example. Next I was able to dockerize my app somewhat so that it compiled down to one image. But sadly it didn't run because the start command failed :/.
This is my filetree:
My backend is weirdly done, every other guide on the internet always either has only one flask file called app.py or has some kind of running done in that flask python file.
My dockerfile so far:
# syntax=docker/dockerfile:1
FROM python:3.10
WORKDIR /app
ADD backend/requirements.txt /app/
ADD backend/* /app/
ADD frontend/* /app/
RUN pip3 install -r requirements.txt
CMD ["gunicorn", "-b", "0.0.0.0:8000", "backend:app"]
I'm pulling both my backend and frontend folder with it's contents to my working directory /app and I'm kind of hoping it to start working. I did some research on it, but most of the guides have really simple flask apps in them, so that complicates it.
hybrid grove
u need to specify context in the docker build command
tidal sinew
You should add a docker ignore file to ignore __pycache__, .pytest_cache, and venv
terse pier
Whenever I run the docker container it terminates and gives Exited(3) as status
terse pier
u need to specify context in the docker build command
Sorry, what does that mean?
hybrid grove
is the dockerfile inside of the backend folder?
terse pier
no
tidal sinew
It is, it should be outside of the folder
terse pier
it is outside of the folder
tidal sinew
Oh wait yeah it's dedented, kinda hard to see
terse pier
hybrid grove
oh nvm, it looked confusing
terse pier
You guys probably need more info am I right?
tidal sinew
Why are you expanding the backend and frontend into the app directory??? Just add them. Right now you're creating one folder with all the files from both folders.
terse pier
Sorry, I literally just read like an hour of docker guides for a start, what am I doing wrong right now?
tidal sinew
/* says "copy all files and folders"
So when you do backend/* you're adding everything in backend to /app not adding backend to /app
tidal sinew
Do you not need the backend folder to run stuff?
terse pier
yes, I do
tidal sinew
Think of the docker container as another computer, add is copying files over to that computer.
terse pier
Okay, will try!
ModuleNotFoundError: No module named 'backend'
[2023-03-14 16:00:44 +0000] [7] [INFO] Worker exiting (pid: 7)
[2023-03-14 16:00:45 +0000] [1] [INFO] Shutting down: Master
[2023-03-14 16:00:45 +0000] [1] [INFO] Reason: Worker failed to boot.
hmm
# syntax=docker/dockerfile:1
FROM python:3.10
WORKDIR /app
ADD backend/requirements.txt /app/
ADD backend/ /app/
ADD frontend/ /app/
RUN pip3 install -r requirements.txt
CMD ["gunicorn", "-b", "0.0.0.0:8000", "backend:app"]
Are you able to share your project so I can mess with it
terse pier
/ between app shouldn't be problem here right?
yeah, how would you like it shared?
zip? github?
hybrid grove
does gunicorn also run the frontend?
terse pier
no, backend should serve my frontend
hybrid grove
also i think u should move the pip3 install command right under the requirements.txt
so it will cache the installed packages
tidal sinew
Try doing ADD backend backend/
hybrid grove
not /app/backend/ ?
tidal sinew
Working dir is already set to /app
hybrid grove
dont u need a leading dot slash ./? or it works even without it
tidal sinew
does gunicorn also run the frontend?
Yes gunicorn is running everything through the flask app
It should work without it
terse pier
Try doing `ADD backend backend/`
instead of ADD backend/ /app/?
tidal sinew
Correct
From the docs for ADD
So it's necessary to create the directory on the destination
So doing ADD backend /app/ just dumps all the files into the /app directory
terse pier
So doing `ADD backend /app/` just dumps all the files into the `/app` directory
same error ;/
hybrid grove
can u show your current dockerfile configuration?
terse pier
# syntax=docker/dockerfile:1
FROM python:3.10
WORKDIR /app
ADD backend/requirements.txt /app/
ADD backend /backend
ADD frontend/ /app/
RUN pip3 install -r requirements.txt
CMD ["gunicorn", "-b", "0.0.0.0:8000", "backend:app"]
remove the leading slashes
tidal sinew
You didn't copy the line I gave you correctly
hybrid grove
cuz then it becomes absolute path
tidal sinew
No leading slash
Must have a trailing slash
A leading slash will create a folder at the root of the file system. No leading slash will create the folder in WORKDIR.
A trailing slash tells Docker to create a folder. No trailing slash will tell Docker to create a file.
terse pier
Failed to find attribute 'app' in 'backend'.
wait nvm, I can fix that
waiting game I guess
docker is pretty slow ngl
hybrid grove
also i think u should move the `pip3` install command right under the requiremen...
try this if u want faster build btw
terse pier
`sqlalchemy.exc.OperationalError: (psycopg2.OperationalError) could not translate host name "None" to address: Name or service not known
(Background on this error at: https://sqlalche.me/e/14/e3q8)``
interesting
maybe this way it would be easier
tidal sinew
How are you setting the database address?
terse pier
this way:
app.config['SQLALCHEMY_DATABASE_URI'] = f'postgresql://{os.environ.get("DB_NAME")}'
is it because of .env-s?
hybrid grove
docker must be able to access it from within the container
terse pier
but backend/ folder has the .env in it
hybrid grove
where is the db hosted?
tidal sinew
The environment isn't inherited from your system. So you've gotta set the DB_NAME when you run the docker container
tidal sinew
where is the db hosted?
The DB address is set to None. Not an access issue
Please read the error messages
hybrid grove
oh my bad
tidal sinew
I dunno how flask loads that file
terse pier
so, in the Dockerfile I do:
ENV environment-variable=something
for every one?
hybrid grove
u can also use --env-file argument in the docker run command
terse pier
when I run that from command line?
hybrid grove
yea
terse pier
sudo docker run -p 5000:5000 python-docker --env-file in the terminal
hybrid grove
u need to specify the env file path for the env-file argument
tidal sinew
So add backend/.env
hybrid grove
ok so now i guess its an access issue
terse pier
imma try with my local db
tidal sinew
Wait, what is the DB name set to?
terse pier
if it even works at the first place
tidal sinew
127.0.0.1?
terse pier
it's a real db in the cloud
tidal sinew
Don't share that publicly. Anyone can access your db with that
terse pier
I'm going to make a new one after this discussion anyways, I know that 🙂
?ssl=true looks like should be added to db url
tidal sinew
Yes
terse pier
didn't work :/, maybe I have to allow it from my service provider, brb
thought I had to add my ip address as one of the sources, but doesn't look like this is it
with that ssl=true:
invalid dsn: invalid connection option "ssl"
tidal sinew
What did you change the database connection address to?
terse pier
I added that ?ssl=true part at the end of the url
tidal sinew
Odd
terse pier
There seems to be a better way of doing this, but I haven't set up my database configuration that way up
Here they are using create_engine when connecting with the database, I'm not establishing the connection that way:/
https://docs.sqlalchemy.org/en/20/dialects/postgresql.html#ssl-connections:~:text=import ssl
ssl_context %3D ssl.create_default_context()
engine %3D sa.create_engine(
"postgresql%2Bpg8000%3A//scott%3Atiger%40192.168.0.199/test"%2C
connect_args%3D{"ssl_context"%3A ssl_context}%2C
)
flask is handling that for me
I don't understand why it doesn't require that ssl when I'm connecting to the db from my development app?
And I don't have blocked addresses
tidal sinew
If the settings you had were correct, they should also be correct inside of Docker
terse pier
Mar 14 07:05:25 PM [6410a955.3d209-1] user=[unknown],db=[unknown],app=[unknown],client=::1,LOG: connection received: host=::1 port=58042
Mar 14 07:05:25 PM [6410a955.3d209-2] user=postgres,db=postgres,app=[unknown],client=::1,LOG: connection authenticated: identity="postgres" method=md5 (/pgdata/dpg-cg716bo2qv28u2r3arig-a/pg_hba.conf:90)
Mar 14 07:05:25 PM [6410a955.3d209-3] user=postgres,db=postgres,app=[unknown],client=::1,LOG: connection authorized: user=postgres database=postgres application_name=psql SSL enabled (protocol=TLSv1.2, cipher=ECDHE-RSA-AES256-GCM-SHA384, bits=256)
Mar 14 07:05:25 PM [6410a955.3d209-4] user=postgres,db=postgres,app=psql,client=::1,LOG: disconnection: session time: 0:00:00.082 user=postgres database=postgres host=::1 port=58042
database logs
and then 10 seconds later
Mar 14 07:05:35 PM [6410a95f.3d218-2] user=postgres,db=postgres,app=[unknown],client=::1,LOG: connection authenticated: identity="postgres" method=md5 (/pgdata/dpg-cg716bo2qv28u2r3arig-a/pg_hba.conf:90)
Mar 14 07:05:35 PM [6410a95f.3d218-3] user=postgres,db=postgres,app=[unknown],client=::1,LOG: connection authorized: user=postgres database=postgres application_name=psql SSL enabled (protocol=TLSv1.2, cipher=ECDHE-RSA-AES256-GCM-SHA384, bits=256)
Mar 14 07:05:35 PM [6410a95f.3d218-4] user=postgres,db=postgres,app=psql,client=::1,LOG: disconnection: session time: 0:00:00.008 user=postgres database=postgres host=::1 port=49466```@tidal sinew Out of ideas 😅 ?
Fine, Imma try to get dockerized version working at least with a local db then
tidal sinew
Just remember the docker container is essentially a different computer. So the loopback address will point at it not your computer.
terse pier
changed back to my local one, didn't fail this time 🙂
but, 0.0.0.0 refused to connect. when I try to access my app in web
more debugging I guess 🙂
tidal sinew
0.0.0.0 is the local computer. So in a docker container it references that docker container, not your computer.
terse pier
so, you want to say that this address is the wrong one?
tidal sinew
Yes
You might be able to use the IP address of your computer on your network. I can't recall how docker sets up its network by default.
tidal sinew
Localhost is the computer. So in a docker container it'll be the docker container.
terse pier
Okay, so to be completely clear:
-p 8000:5000 part in the run command of docker forwards anything that's on that port in the docker container to my localhost. SO if in my Dockerfile I run the app this way: CMD ["gunicorn", "-b","0.0.0.0:8000", "backend:app"], then theoretically it should forward that port 8000 to port 5000 in my computer? Did I get it right?
tidal sinew
Yes
terse pier
so this shouldn't be happening?
I can imagine how annoyed you are of me, you'ld probably be thinking right now like "omfg how can't this guy just get it working lol, this isn't that hard".
tidal sinew
Oh you've got the 8000 and 5000 backwards
steady ravine
if you look @ docker logs, is your application starting correctly?
terse pier
do you mean those logs which get printed out after I run the run command?
rbr4t@rbr4t-Linux:~/yhiselamu-p2evik$ sudo docker run -p 5000:8000 --env-file backend/.env python-docker
[2023-03-14 17:44:43 +0000] [1] [INFO] Starting gunicorn 20.1.0
[2023-03-14 17:44:43 +0000] [1] [INFO] Listening at: http://0.0.0.0:5000 (1)
[2023-03-14 17:44:43 +0000] [1] [INFO] Using worker: sync
[2023-03-14 17:44:43 +0000] [7] [INFO] Booting worker with pid: 7
if you try to do localhost:8000 do you see any new logs for attempted connections for example in docker?
tidal sinew
Might be worth using docker exec to test if the server is working inside the container
terse pier
wait, I need to go inside the docker now?
hybrid grove
Okay, so to be completely clear:
`-p 8000:5000` part in the run command of docke...
can u try doing -p 127.0.0.1:8000:5000 instead?
cuz if remember correctly, docker containers get their own local ip address
steady ravine
also first - does this work on your local machine outside docker
lol do you want to send me the project and I can save you from your suffering
terse pier
lol do you want to send me the project and I can save you from your suffering
that would be so nice
is github fine?
steady ravine
sure
terse pier
@steady ravine no .env files tho, https://github.com/Rbr4t/flask-docker
getting it working that much that I can access that website would be highly appreciated
😢
and I pushed my secret keys to github directly
that's just fabolous!
tidal sinew
Oooph haha
sturdy zenith
Nevermind, I deleted my last messages for no reason
rbr4t@rbr4t-Linux:~/yhiselamu-p2evik$ sudo docker run -p 5000:8000 --env-file backend/.env python-docker
[2023-03-14 17:44:43 +0000] [1] [INFO] Starting gunicorn 20.1.0
[2023-03-14 17:44:43 +0000] [1] [INFO] Listening at: http://0.0.0.0:5000 (1)
[2023-03-14 17:44:43 +0000] [1] [INFO] Using worker: sync
[2023-03-14 17:44:43 +0000] [7] [INFO] Booting worker with pid: 7
You've changed the gunicorn port here. It's listening on 5000
Just set all the ports to 8000 and call it done lol. Gunicorn to 8000 and then -p 8000:8000
-p HOST_PORT:CONTAINER_PORT
terse pier
I have tried every port combination, if it's the right one then it will just give me such screen:
I tried gunicorn outside of the container, there it works as expected
so that's not the cause
sturdy zenith
It must be the cause. Share your Dockerfile and share the command you're using to run it
I've not seen one example above where you've got the ports correct
terse pier
# syntax=docker/dockerfile:1
FROM python:3.10
WORKDIR /app
ADD backend/requirements.txt /app/
ADD backend backend/
ADD frontend/ /app/
RUN pip3 install -r requirements.txt
CMD ["gunicorn", "-b","0.0.0.0:8000", "backend:app"]
# command line run: sudo docker run -p 8000:8000 --env-file backend/.env python-docker
# command line build: sudo docker build --tag python-docker .
Okay and then in your web browser go to http://localhost:8000
Make sure your local gunicorn isn't running still on port 8000
tidal sinew
Well that's flask
terse pier
That's what you expected to see?
that's what I was asking 🙂
terse pier
Do it the same way you're doing backend
You must have some magical abilities
IT'S NOT BLANK ANYMORE!!!!!!!!!!!!!!!
2023-03-14 18:26:56 +0000] [7] [INFO] Booting worker with pid: 7
[2023-03-14 18:27:36 +0000] [1] [CRITICAL] WORKER TIMEOUT (pid:7)
[2023-03-14 18:27:36 +0000] [7] [INFO] Worker exiting (pid: 7)
[2023-03-14 18:27:36 +0000] [8] [INFO] Booting worker with pid: 8
should this be something to be worried about that [CRITICAL]?
tidal sinew
Looks like something didn't close correctly so Gunicorn killed it
terse pier
okay, imma try to connect my db again, maybe it just magically fixed itself????
🤣
nope -_-
maybe I should just try another database provider? how does that sound?
tidal sinew
I don't even understand what the problem is, so I have no suggestions
terse pier
I added that `?ssl=true` part at the end of the url
back here now, I switched the db out that I would get docker working at least
sorry, went to get coffee
sturdy zenith
What error are you getting now?
terse pier
qlalchemy.exc.ProgrammingError: (psycopg2.ProgrammingError) invalid dsn: invalid connection option "ssl"
sturdy zenith
Remove ssl?
terse pier
and connection to server failed, port 5432 failed: FATAL: SSL/TLS required when I didn't add ssl
and I tried a couple others as well, but they all gave me some kind of errors 🙂
sturdy zenith
Apparently it's sslmode
tidal sinew
That only happens when connecting from within the docker container, right?
terse pier
Apparently it's `sslmode`
I'm pretty sure I already tested that as well and it didn't work out for me.
but I can give it another try 🙂
maybe just maybe I mistyped or smh
sturdy zenith
You haven't given the line of code causing the error so I'm just guessing but googling around psycopg2 and ssl suggests it's sslmode='require'
steady ravine
<@105783166622552064> no .env files tho, https://github.com/Rbr4t/flask-docker
i'm at work currently I can look after, but looks like kintec/zech are on the case
terse pier
You haven't given the line of code causing the error so I'm just guessing but go...
Would faster computer build docker containers faster?
sturdy zenith
only when connecting from docker
Sorry I've only just seen this as I read the ping below it only. Does connecting to the database on render work if you run it on your PC? Just not in docker?
terse pier
outside of docker it works like a charm
takes a bit of time to connect, like 2 seconds and then the app launces
sturdy zenith
So lets circle back to using what works outside of docker. What error message were you getting then? The SSL one or something different?
terse pier
So lets circle back to using what works outside of docker. What error message we...
Outside of docker I didn't get any error message
sturdy zenith
But when you use whatever you used outside of docker inside docker, what error message do you get?
Like you shouldn't be having to change any code to get it to work inside docker
terse pier
But when you use whatever you used outside of docker inside docker, what error m...
connection to server failed, port 5432 failed: FATAL: SSL/TLS inside the docker
sturdy zenith
That's the full error?
terse pier
I can get you the whole error if you insist, but it's like really long
imma now have to build the app again so it takes a little time now
tidal sinew
You haven't given the line of code causing the error so I'm just guessing but go...
It's flask sqlalchemy that is being used
terse pier
sturdy zenith
Yeah I saw that after they linked the code 😅
tidal sinew
You shouldn't have to build every time. Only when you want new changes to be available
terse pier
You shouldn't have to build every time. Only when you want new changes to be ava...
changes to .env file require building every time, no?
sturdy zenith
FATAL: password authentication failed for user "'REDACTED"
I dunno if that's because of the SSL/TLS error or if one is causing the other but given it works outside docker and not insider docker it suggests it might be an environment variable issue again?
terse pier
but the environment variables are the same in both docker and development?
hybrid grove
changes to .env file require building every time, no?
if its being passed using --env-file then no
terse pier
if its being passed using --env-file then no
okay, good to know
sturdy zenith
For fun, can you hardcode the connection string in your python code?
sturdy zenith
No problem 😄
terse pier
and then we'll get an answer, hopefully
tidal sinew
@terse pier show me your dockerfile
There's likely something wrong if it's taking that long for code changes
terse pier
# syntax=docker/dockerfile:1
FROM python:3.10
WORKDIR /app
ADD backend/requirements.txt /app/
ADD backend backend/
ADD frontend frontend/
RUN pip3 install -r requirements.txt
CMD ["gunicorn", "-b","0.0.0.0:8000", "backend:app"]
# command line run: sudo docker run -p 8000:8000 --env-file backend/.env python-docker
# command line build: sudo docker build --tag python-docker .
i already suggested moving the pip3
under the requirements.txt
tidal sinew
Move the pip3 line above the backend line
Like giraffe started earlier
It'll cause the packages to be cached and code changes won't cause that layer to rerun
# syntax=docker/dockerfile:1
FROM python:3.10
WORKDIR /app
ADD backend/requirements.txt /app/
RUN pip3 install -r requirements.txt
ADD backend backend/
ADD frontend frontend/
CMD ["gunicorn", "-b","0.0.0.0:8000", "backend:app"]
# command line run: sudo docker run -p 8000:8000 --env-file backend/.env python-docker
# command line build: sudo docker build --tag python-docker .
So like that
terse pier
For fun, can you hardcode the connection string in your python code?
bro, could that be the .env file that's been messing with me for like 1.5 hours now
because when I hardcoded it
it didn't return db errror
sturdy zenith
Does your app work?
terse pier
yes, only the oauth doesn't
sturdy zenith
Probably because env file
terse pier
but that's because it can't access the env contents
there was possible to declare those env files in Dockerfile yeah?
sturdy zenith
I've just been having a look at the docker docs on --env-file. Can you try changing your command to
sudo docker run -p 8000:8000 --env-file ./backend/.env python-docker
https://docs.docker.com/engine/reference/commandline/run/#env here for reference
I can't think why the ./ would be any different to backend/.env but worth a try maybe
terse pier
no, that doesn't change anything, I'm pretty sure I tested it before
and it looks like this is the case
I guess I've to do it like so:
https://phoenixnap.com/kb/docker-environment-variables#:~:text=Set ENV Values,Docker Compose.
aka straight to the dockerfile
sturdy zenith
That defeats the whole point. You don't wanna do that. Can you share what your .env contains but change the values to nonsense?
terse pier
SECRET_KEY="REEEEEEEEEEEEE"
SECRET_KEY_TEST="REEEEEEEEEEEEE"
CLIENT_ID="REEEEEEEEEEEEE"
CLIENT_ID_TEST="REEEEEEEEEEEEE"
DB_SECRET_KEY="REEEEEEEEEEEEE"
DB_NAME='REEEEEEEEEEEEE'
Try remove the "
terse pier
something's off, it fails even when the env variable is in the Dockerfile
terse pier
Try remove the `"`
does it matter?
sturdy zenith
The docker docs don't include it so maybe...
terse pier
hmm, now it doesn't say that there is no OAuth client when I browse that far
so it seems like this actually did impact
sturdy zenith
Did it connect to the database?
terse pier
yes
sturdy zenith
Using the .env file only?
terse pier
yes
terse pier
kinda, now I gotta somehow get google OAuth working properly
whenever I try to get there it just keeps loading
sturdy zenith
After you login or?
terse pier
okay, this is just really slow
I now got to that account choosing panel, but it takes forever for website to load
sturdy zenith
Does it eventually load?
terse pier
hasn't been able to do it yet
but if it were the keys, it would have given me the error straight away
sturdy zenith
I dunno if it'll make a difference but are you using the same port as when you were running it outside docker? If so. Can you try incognito?
terse pier
I dunno if it'll make a difference but are you using the same port as when you w...
same port, tried on firefox already, same problem
sturdy zenith
It's when it's trying to load the callback URL?
sturdy zenith
What's your callback url and what url are you using to access the site in the first place?
terse pier
I know why it's failing
sturdy zenith
You got a fix?
terse pier
@auth.route('/login', methods=['GET'])
def login():
redirect_uri = "http://localhost:5000/callback"
return oauth.google.authorize_redirect(redirect_uri)
this is my login route
could it be the redirect_uri
?
sturdy zenith
What url are you accessing the site with?
If it's not http://localhost:5000 then yes probably
terse pier
the google site?
sturdy zenith
Nah your site, what do you put in your browser to get to the login page?
terse pier
/login
sturdy zenith
The full thing 😄
sturdy zenith
Not your code. So you have done docker run then you go to your browser and you type something in the URL bar to access your site. What do you type?
terse pier
localhost:8000
sturdy zenith
Okay then your callback should be http://localhost:8000/callback
sturdy zenith
Do you have to register it in the google dev console?
I think you have to set the callback there right?
sturdy zenith
Yeah that's probably easier. Make sure you change your docker run to do -p 5000:8000
terse pier
yes sir
sturdy zenith
Something for later once we have this working. But you'll need to "fix" the callback thing when you deploy. So if your site is like http://rbr4tsawesomesite.render.com you'll need to use that for your callback
sturdy zenith
Are you still running your local version? None docker?
terse pier
i'm not running local version
sturdy zenith
What's the output of docker ps?
terse pier
no applications running
CONTAINER ID IMAGE COMMAND CREATED STATUS PORTS NAMES
I could do a restart to my pc
probably the easiest 🤣
sturdy zenith
What's the output of sudo netstat -ano -p tcp
terse pier
even if something is running somewhere
terse pier
wait, I have to install it first
terse pier
yeah, too much data to handle
yeah, something is running
on that port
tcp 19 0 0.0.0.0:5000 0.0.0.0:* LISTEN 41554/python3
how can I kill it 🔪
sturdy zenith
Oh it might be because gunicorn is spawning them lol
Maybe
Yeah restart
Or ps aux | grep gunicorn
Then kill that pid
I guess you already restarted 😅
terse pier
yeah, I did
now my accessing localhost takes ages
and Access blocked: Authorization Error
sturdy zenith
Where's that error coming from?
terse pier
I don't know, it doesn't log anything
sturdy zenith
Is it displayed on your webpage?
terse pier
You can't sign in to this app because it doesn't comply with Google's OAuth 2.0 policy for keeping apps secure.
sturdy zenith
This might be where you need to use a different browser, clear your cache or use incognito
If your "local" non-docker version was running on port 5000
terse pier
okay, I built it again, and now doesn't throw me this error anymore
and boom!
working!!!!!!!!!!!!
sturdy zenith
terse pier
🤩
docker locally now working
time to deploy it online 😈
gotta change that uri tho first
sturdy zenith
While you were rebuilding I was googling the error https://developers.google.com/identity/protocols/oauth2/production-readiness/policy-compliance
This says you probably need a different project for production and there are some other criteria
Or maybe since it's for school you could just leave it as a testing project
sturdy zenith
Okay cool 🙂 Good luck!
terse pier
I should use flask's url_for() for that /login redirect
sturdy zenith
It's been so long since I used flask I can't remember what that does 😅
tidal sinew
Gets the URL from a route name
sturdy zenith
Ah that's handy. Can it be used in templates too?
tidal sinew
I think so
I've never actually used Flask, so I could be wrong about that...
It just makes sense to have it available in templates
sturdy zenith
Is it when it needs to hit the database?
terse pier
no, when I need to access some url-s
sturdy zenith
Do those URLs access the database though? Accessing a database across the internet will cause some slowdown
terse pier
feels like this error is given randomly:You can't sign in to this app because it doesn't comply with Google's OAuth 2.0 policy for keeping apps secure.
terse pier
Do those URLs access the database though? Accessing a database across the intern...
no, those are other ones
sturdy zenith
feels like this error is given randomly:`You can't sign in to this app because i...
Check that link above. You might need to create the project again. It seems there are some rules you need to follow to be compliant
terse pier
like /login, /homepage
sturdy zenith
I'm not sure then
terse pier
weird
I haven't tested the db part yet, so we'll see
😬
I wish docker would show me logs not only when some kind of error hits
tidal sinew
Logs of what?
terse pier
like print()s and stuff like this into the console
okay, got it working, it needed _exteranl=True parameter with that url_for()
database works as expected, no problems with that
did we really just got Docker working on my computer?
tidal sinew
like print()s and stuff like this into the console
Are you able to see those when running outside of Docker?
tidal sinew
With the docker container running, run docker logs ID_OF_CONTAINER
I think you can get the container ID with docker ps
terse pier
I open a new terminal and do that there yeah?
tidal sinew
Yeah
terse pier
okay, I was expecting it to run in real time not to print out once, but thx for that
Only thing what I don't quite like is that it takes quite some time to query data from the database
but the service did warn about that
terse pier
ok, that could have been easily googleable thing, but thx still
Now, Imma have a little break, eat smh and then I'm going to deploy it
terse pier
ok, back imma now start suffering again
terse pier
my app should have runtime of something else than python3 yeah?
docker or something?
nvm, found it
I'm hackerman now
nah, not really
build did succeed, but my application has no frontend
well shit
shouldn't docker be universal, when it works in one place it should always work in other places too, am I right?
well, shit 2x
sturdy zenith
shouldn't docker be universal, when it works in one place it should always work ...
Yes it should
terse pier
well shit 3x
any idea how to get frontend to my application?
I and Zech ran into the same problem yesterday when I hosted it straight from my repo
but that time I couldn't get frontend locally either working
tidal sinew
Does it find them locally now when you run it exactly how you run it in the docker?
terse pier
yes
tidal sinew
So you're running it from the folder that has the frontend and backend folders in it? Or are you running it from the backend folder?
terse pier
both are in it
it's the docker file
could ' strict-origin-when-cross-origin' have to do something with it?
tidal sinew
What do you see when you try to access the frontend using docker?
terse pier
like when I go there in the url?
tidal sinew
Yes
tidal sinew
That's the HTML
terse pier
oh, yeah
tidal sinew
Here, get rid of the ../ do the same a few lines down
That's assuming you're running from within the backend folder. You're not.
terse pier
uhm, now it completely broke
tidal sinew
How so
tidal sinew
File system???
tidal sinew
Did you get an error in the flask logs?
tidal sinew
Something is very wrong and I don't know what. Change the main function in views.py to return "Hello World" just to see if it works at all.
terse pier
no hello world either
tidal sinew
Ok in your dunder init don't register the auth and func views just to make sure they're not messing stuff up
sturdy zenith
Didn't you change your port to 5000 because that's what your callback was set to in Google dev?
tidal sinew
This is the home page. Not auth.
Trying to get the frontend to load.
The views.py views not the auth.py views.
terse pier
Didn't you change your port to 5000 because that's what your callback was set to...
not important right now, we have no frontend
sturdy zenith
not important right now, we have no frontend
It's important if your server is listening on port 5000, not 8000 but I'll stay out of it. Good luck!
tidal sinew
Yeah but this was working 5 seconds ago to send 404's now it's not even doing that
Dunno why the port would have changed in that time
tidal sinew
This one you went to a different URL than in the previous screenshot, why?
terse pier
oh, you mean why did I not try to access http://127.0.0.1:5000/frontend/src?
this time
tidal sinew
Yeah
terse pier
I'm not sure, but that didn't yield me any results either
tidal sinew
That was port 8000 though not 5000
terse pier
I changed that halfway through, but that doesn't matter
tidal sinew
What port is docker using, let's figure that out? You keep using two different ones and it's a problem.
terse pier
CMD ["gunicorn", "backend:app"]
not port specified
for some reason I needed it for Render to work properly
tidal sinew
What is docker run using
terse pier
sudo docker run -p 8000:8000 --env-file backend/.env python-docker
tidal sinew
Ok so 8000 not 5000
You will not be able to access the site on 5000 if that's how you're running the site
terse pier
okay, yeah, looks like I caused it
Hi World appeared when I fized it in the Dockerfile
tidal sinew
Ok. Now put it back to sending from the directory.
terse pier
back here
idk if that helps, but when I print out the path here:
@views.route("/<path:path>")
def home(path):
print(path)
return send_from_directory('frontend/public', path)
it's the one in the url
I guess mixing multiple human languages in one code wasn't a good idea
😅 for readabilty
tidal sinew
What happens if you go to the home page
terse pier
tidal sinew
Did you get any errors in the docker logs when loading that page?
terse pier
no
tidal sinew
Ok put it back to the way it was and show me what the code is
terse pier
@views.route('/', methods=['GET'])
def main():
return send_from_directory('frontend/public', 'index.html')
# static files, JS, CSS etc
@views.route('/<path:path>')
def home(path):
print(path)
return send_from_directory('frontend/public', path)
Ok get rid of the ../
Let's try to only change one thing at a time. So always use the same URL unless we decide to change it.
terse pier
yes yes, I was with without those ../ the whole time, I thought you wanted to go back all the way lol
I know it sounds scuffed, but I could give you access to my pc via some software if you feel like you have to test some stuff out yourself.
tidal sinew
So it doesn't work with and without the ../?
terse pier
with ../ the frontend is there, but when I try to navigate to that folder via URL it breaks
tidal sinew
Ok well that was useful information
terse pier
without ../ there is no frontend before and after I navigate
tidal sinew
Going to http://127.0.0.1:8000/ works when you use ../frontend/public?
terse pier
yes
tidal sinew
Ok so what URL doesn't work?
terse pier
when you are any of those directories after the slash
tidal sinew
Give me a URL
terse pier
http://127.0.0.1:8000/frontend/src for example
tidal sinew
What file should that show?
terse pier
routes folder and 2 js scripts
tidal sinew
The path is being appended to the path you have to send_from_directory. So going to http://127.0.0.1:8000/frontend/src will attempt to find a file at the path ../frontend/public/frontend/src
Which doesn't exist
terse pier
of
oh
okay, but when I go to http://127.0.0.1:8000/src nothing happens
still
even when I took away ../ from those routes
tidal sinew
Leave the ../ flask is using magic to make that work and it won't work otherwise.
When you go to /src it's looking for a file at ../frontend/public/src
It's looking in the folder you told it to look in
terse pier
which does not exist according to flask, because all I'm getting is that damn Not Found message
tidal sinew
It doesn't exist. frontend/src exists but you're telling it to look in frontend/public not frontend
terse pier
so if I would do http://127.0.0.1:8000/../src it would go one directory back and then src/ would be accessable in theory?
tidal sinew
No
There's nothing useful in the src directory anyways... Why are you trying to access it?
terse pier
just for demonstration purposes????
tidal sinew
There's nothing there to load. It's a svelte project, the browser doesn't understand svelte. I'm assuming it was built into what you have in frontend/public/build
terse pier
yes, the build files should be there indeed
Sorry, but does this shitstorm mean that I have built and app what you can't deploy?
tidal sinew
If you wanna load something different go to http://127.0.0.1:8000/diary.png
I'm assuming your svelte app is running from index.html? No?
terse pier
I don't know how Svelte works exactly, but this is what index.html looks like:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset='utf-8'>
<meta name='viewport' content='width=device-width,initial-scale=1'>
<title>Puudumispäevik</title>
<link rel='icon' type='image/png' href='/diary.png'>
<link rel='stylesheet' href='/global.css'>
<link rel='stylesheet' href='/build/bundle.css'>
<script defer src='/build/bundle.js'></script>
</head>
<body>
</body>
</html>
Does going to http://127.0.0.1:8000 show your svelte app?
terse pier
yes
tidal sinew
Ok. I'm assuming the router is what's not working, correct?
terse pier
at this point I'm not even sure anymore
tidal sinew
I think you need to do two things to make this work.
create a route in flask that uses an assets folder for all your images, CSS, and js files.
change the home route in views.py to send the index.html file so that your svelte app is loaded on all routes that flask isn't using.
terse pier
okay, so for 1) it would essentially be eternity of the public folder?
tidal sinew
So
assets../frontend/assetsThen finally change the home route in views.py to not use the path variable and instead just use the string "index.html". It'll be the same as the main route.
index.html is your svelte app, so in order for it to be used you have to send it.
terse pier
okay html file like so
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset='utf-8'>
<meta name='viewport' content='width=device-width,initial-scale=1'>
<title>Puudumispäevik</title>
<link rel='icon' type='image/png' href='/diary.png'>
<link rel='stylesheet' href='../assets/global.css'>
<link rel='stylesheet' href='../assets//bundle.css'>
<script defer src='../assets/bundle.js'></script>
</head>
<body>
</body>
</html>
assets directory like so:
so that only index.html remains in public/ directory?
tidal sinew
Yeah
Trying to isolate everything onto individual routes so that we can send everything else to svelte
terse pier
terse pier
@views.route('/', methods=['GET'])
def main():
return send_from_directory('../frontend/assets', "index.html")
# static files, JS, CSS etc
@views.route('/<path:path>')
def home(path):
return send_from_directory('../frontend/public', "index.html")
I said to add a new route for assets. You must leave the main route the way it was. index.html is your svelte app, so anywhere you want to access it you must send it.
terse pier
sorry, I'm starting to lose it, when did you give me such instruction?
tidal sinew
So
1) create a folder in frontend named `assets`
2) copy the home route in views...
Point 2
The new assets route will work exactly like the home route except it'll use the assets folder not the public folder
terse pier
@views.route('/', methods=['GET'])
def main():
return send_from_directory('../frontend/assets', "index.html")
@views.route('/assets/<path:path>')
def emoh(path):
return send_from_directory('../frontend/assets', path)
@views.route('/<path:path>')
def home(path):
return send_from_directory('../frontend/public', "index.html")
?
tidal sinew
Rename the assets route to have a different function name
Oh and change the path for it to '/assets/<path:path>'
terse pier
like so?
tidal sinew
Yep
Now make sure all the images, CSS, and js are moved to your assets folder
And make sure all the URLs to the images, CSS, and js in your HTML and svelte app are updated to be in the assets folder
terse pier
terse pier
I have no idea why my internet has fell into coma
tidal sinew
Lol
terse pier
okie dokie, it should be there lol
tidal sinew
That needs to use public not assets, only emoh should use assets
tidal sinew
Did you update the HTML to load it from /assets/bundle.css
You moved it to a new folder, so the HTML needs to be updated to match
terse pier
<link rel='stylesheet' href='../assets//bundle.css'>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset='utf-8'>
<meta name='viewport' content='width=device-width,initial-scale=1'>
<title>Puudumispäevik</title>
<link rel='icon' type='image/png' href='/diary.png'>
<link rel='stylesheet' href='../assets/global.css'>
<link rel='stylesheet' href='../assets//bundle.css'>
<script defer src='../assets/bundle.js'></script>
</head>
<body>
</body>
</html>
bruh
//
finally
It's almost 2 am
more than 7 hours of coding for me
tidal sinew
Why do you have the ..?
The route is at the root of your site so just do /assets/file.ext
terse pier
route aka index?
uhm, this is still in my public folder???
and assets is outside public folder
so I must first move out of it
before I can access assets/ folder
tidal sinew
No
terse pier
but it works
tidal sinew
Any URL that starts with / will be at the root of your site and not relative to the current page URL
It does but it could break
The correct way to do it is /assets
terse pier
okie dokie
<link rel='stylesheet' href='/assets/global.css'>
<link rel='stylesheet' href='/assets/bundle.css'>
<script defer src='/assets/bundle.js'></script>
looks like so
tidal sinew
Yay!
terse pier
imma try to deploy it
tidal sinew
You might need to hard refresh pages since you moved assets to a new folder
tidal sinew
Usually pressing shift while reloading the page to clear the browser cache
terse pier
if you refresh and look under networking tab it's pretty wild
tidal sinew
Is it working?
terse pier
not really
tidal sinew
What's wrong with it
terse pier
when you refresh the site, it alternates between Bad Gateway, the site it's supposed to look, the site with only HTML and the site with some CSS but it's clearly missing a lo
I can't function anymore, coffee has stopped working, good evening!
tidal sinew
Fwiw you only need to hard refresh once after uploading the changes
terse pier
Okay, that might have been my crappy internet connection
terse pier
Okay, last time before I close this issue, could you give me a bit more brief explanation on how do these routes work, because when I will open this project in the future I will have probably already forgotten how it works. This would be kinda like a documentation for this code snippet.
# homepage
@views.route('/', methods=['GET'])
def main():
return send_from_directory('../frontend/public', "index.html")
# what was this snippet's purpose again?
@views.route('/assets/<path:path>')
def emoh(path):
return send_from_directory('../frontend/assets', path)
# all routes that flask isn't using are being served svelte app
@views.route('/<path:path>')
def home(path):
return send_from_directory('../frontend/public', "index.html")
Anyway, for the most part the application is running, I fixed google OAuth issue, it just required updating Authorized redirect URIs in google console.
sturdy zenith
Using http://localhost as the example
http://localhost/ will serve ../frontend/public/index.html
http://localhost/assets/styles/style.css would serve ../frontend/assets/styles/some_file.css as an example
http://localhost/any/other/path would serve ../frontend/public/index.html as the comment says, this will basically have the effect of sending all other routes to svelte to be handled by it and it's router
So basically / is svelte
/assets/ is anything in the assets folder
Any other route will be sent to svelte and it's router will handle whatever route it is given
terse pier
okay, imma add those much needed comments
sturdy zenith
Zech can probably provide a more concise answer but that's the general idea of it 😅
terse pier
Either way, thank you both so much, I wouldn't been able to solve it on my own 🙂 . Even though I didn't understand all of it, it was a good learning experience and I'm much more comfortable with deploying now on. I just can't thank you guys enough for it 🙂