Flask - 向路由中断图像添加参数
Flask - Adding Parameter to Route Breaks Images
看来我误解了 Flask 应用程序中的路由与本地文件(图像)的关系。
基本示例:
- 在我网站的主页上(
@main_bp.route('/index')
,我有一些内容,包括一个导航栏。导航栏包含一个图像,称之为logo.svg
。导航栏中的图像始终在主页上正确呈现 ('/index')。
导航栏在 base.html
中呈现。 img src 是 ../static/images/logo.svg
- 我还有一个页面,称它为
web_content/<content_number>
。
在routes.py
中,它看起来像这样:@main_bp.route('/web_content/<content_number>', methods=['GET', 'POST'])
图像,包括导航栏中的 logo.svg
,在我导航到此页面时呈现得很好。此页面使用 {% extends 'base.html' %}
- 我正在尝试在我的网站中添加一个图层,将其命名为
content_category
。所以,像这样修改 routes.py:@main_bp.route('/web_content/<content_category>/<content_number>
此页面呈现,所以我相信我在 routes.py 中的代码是正确的(content_category 在函数中定义等)但是,当我添加 content_category
参数,导航栏中的图像在内容页面上中断。 如果我返回主页,导航栏中的图像呈现得很好。所以它似乎不是全局破损,仅在我添加另一个参数时在/web_content
页面上出现。
这让我感到困惑,因为我只在 1 个地方定义了导航栏,base.html
,如果图像在一个地方呈现,我希望它们在所有地方呈现。
使用 ../static/images/logo.svg
这样的路径将使浏览器加载该图像,相对于 URL 中的路径。通过添加像 content_category
这样的参数,这正在改变 URL 路径。
而是在您的模板中使用 Flask 的 url_for
函数来动态呈现正确的路径:
<img src="{{ url_for('static', filename='logo.svg') }}" />
看来我误解了 Flask 应用程序中的路由与本地文件(图像)的关系。
基本示例:
- 在我网站的主页上(
@main_bp.route('/index')
,我有一些内容,包括一个导航栏。导航栏包含一个图像,称之为logo.svg
。导航栏中的图像始终在主页上正确呈现 ('/index')。
导航栏在 base.html
中呈现。 img src 是 ../static/images/logo.svg
- 我还有一个页面,称它为
web_content/<content_number>
。
在routes.py
中,它看起来像这样:@main_bp.route('/web_content/<content_number>', methods=['GET', 'POST'])
图像,包括导航栏中的 logo.svg
,在我导航到此页面时呈现得很好。此页面使用 {% extends 'base.html' %}
- 我正在尝试在我的网站中添加一个图层,将其命名为
content_category
。所以,像这样修改 routes.py:@main_bp.route('/web_content/<content_category>/<content_number>
此页面呈现,所以我相信我在 routes.py 中的代码是正确的(content_category 在函数中定义等)但是,当我添加 content_category
参数,导航栏中的图像在内容页面上中断。 如果我返回主页,导航栏中的图像呈现得很好。所以它似乎不是全局破损,仅在我添加另一个参数时在/web_content
页面上出现。
这让我感到困惑,因为我只在 1 个地方定义了导航栏,base.html
,如果图像在一个地方呈现,我希望它们在所有地方呈现。
使用 ../static/images/logo.svg
这样的路径将使浏览器加载该图像,相对于 URL 中的路径。通过添加像 content_category
这样的参数,这正在改变 URL 路径。
而是在您的模板中使用 Flask 的 url_for
函数来动态呈现正确的路径:
<img src="{{ url_for('static', filename='logo.svg') }}" />