I have the following two endpoints defined within a flask app, they are both the exact same at this point except one is dynamic and takes a variable (that is not used right now):
@app.route('/cats')
def reports():
return render_template('cat.html')
@app.route('/view_cat/<cat_id>')
def view_report(cat_id):
return render_template('cat.html')
the cat.html file imports some things from the /static folder in my flask app like so:
<link rel="stylesheet" href="static/cat_assets/css/style.css">
Oddly, visiting the first endpoint, /cats, loads fine - everything looks good and there are not import errors for my css and js imports in the html.
However, if I go to the dynamic flask url /view_cat/ (with something like localhost:5000/view_cat/abc) suddenly all the imports in the html break giving errors like:
GET http://localhost:5000/view_cat/static/cat_assets/css/style.css net::ERR_ABORTED 404 (NOT FOUND)
It's like being a dynamic url somehow confuses flask and makes it think the static file is within some folder called /view_cat that doesn't exist and it should just be looking where flask normally looks for /static and /templates folders but it's not.
How can I fix this?