Flask CSS not found for dynamic routing

Question

• I am using same html file for two routes.
  • Where one route is static and other route is dynamic.
  • Static route loading the page with out any issue, but dynamic route shows page not found error while loading css files.

Sample code :

WORKFLOW_DIAGRAM = Blueprint('workflow_diagram', __name__)

@WORKFLOW_DIAGRAM.route('/workflow-diagram', methods=['GET'])
def show_workflow():
    return render_template('workflow.html')

@WORKFLOW_DIAGRAM.route('/workflow/<workflow_id>', methods=['GET'])
def show_workflow_with_id(workflow_id):
    return render_template('workflow.html')

while hitting first route it fetches css from,

assets/a.css

while hitting second route it fetches css from,

workflow/assets/a.css

So how can I change the route to use the path assets/a.css

Answer 1

You can indicate which static files to use by referencing them explicitly in your layout.html file via request.endpoint.

{% if request.endpoint == 'show_workflow_with_id' %}
    <link href="{{ url_for('static/assets/', filename='a.css') }}" rel="stylesheet" type="text/css">
{% endif %}