Flask app is fetching the assets (css, js) from a strange path

Question

I have a simple flask app that has a strange behaviour.

It seems that passing a route name is making the browser fetch the assets from another folder.

My html

<link href="./static/assets/main.css" rel="stylesheet">
<a href="/work/22" title="" class="btn btn-default">Reserva já</a>

My Flask route

@app.route('/work/<int:store_id>')
def stores(store_id):
        mycursor.execute("SELECT * FROM stores WHERE store_id = %s" % store_id)
        result = mycursor.fetchone()
        return render_template("work.html")

The console says the browser now is looking for the css file here:

http://localhost:5000/work/static/assets/main.css

I dont understand why it puts the "work" in the path here. Im new to flask, maybe Im not understanding exactly how the routing works. I pass "work/22" because I want to pass two pieces of information, it this bad practice?

Thanks

score 1 · Answer 1 · answered Jan 10 '21 at 23:29

This here is a relative path:

<link href="./static/assets/main.css" rel="stylesheet">

It is relative to the current location, which is /work/store_id. This works the same way as in a file system, so /work would be the current directory and the relative path therefore resolves to /work/static/assets/main.css.

If you want the path to be /static/assets/main.css, remove the leading dot:

<link href="/static/assets/main.css" rel="stylesheet">

Flask app is fetching the assets (css, js) from a strange path

1 Answers1