【完美解决】python flask如何直接加载html,css,js,image等下载的网页模板

最新推荐文章于 2026-05-13 08:15:00 发布

原创最新推荐文章于 2026-05-13 08:15:00 发布 · 4.8k 阅读

3 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#flask #python

本文介绍了Python Flask新手在加载HTML模板时遇到的CSS、JS、IMAGE等静态资源无法找到的问题。通过详细阐述问题背景和尝试的错误解决方案，作者分享了一个无需修改HTML文件中href路径的方法，即在初始化Flask应用时设置`static_folder`和`static_url_path`参数，从而能够正确加载静态文件，使得模板的资源得以正常显示。

Python3.8

Conda

Python

Python 是一种高级、解释型、通用的编程语言，以其简洁易读的语法而闻名，适用于广泛的应用，包括Web开发、数据分析、人工智能和自动化脚本

问题

本人网页开发小白，刚学了用flask，下载了一套网页模板，启动一个网页的确很简单，但是发现无论怎么改这里的 static_folder值都无法找到CSS,JS,IMAGE,FONT等资源
app = Flask(name, static_folder=‘static’, template_folder=‘templates’)
报错如下：

127.0.0.1 - - [04/Mar/2023 22:03:00] "GET / HTTP/1.1" 200 -
127.0.0.1 - - [04/Mar/2023 22:03:00] "GET /css/bootstrap.css HTTP/1.1" 404 -
127.0.0.1 - - [04/Mar/2023 22:03:00] "GET /css/bar.css HTTP/1.1" 404 -
127.0.0.1 - - [04/Mar/2023 22:03:00] "GET /css/style.css HTTP/1.1" 404 -
127.0.0.1 - - [04/Mar/2023 22:03:00] "GET /css/style4.css HTTP/1.1" 404 -
127.0.0.1 - - [04/Mar/2023 22:03:00] "GET /js/script.js HTTP/1.1" 404 -
127.0.0.1 - - [04/Mar/2023 22:03:00] "GET /js/simplyCountdown.js HTTP/1.1" 404 -
127.0.0.1 - - [04/Mar/2023 22:03:00] "GET /css/simplyCountdown.css HTTP/1.1" 404 -
127.0.0.1 - - [04/Mar/2023 22:03:00] "GET /js/amcharts.js HTTP/1.1" 404 -
127.0.0.1 - - [04/Mar/2023 22:03:00] "GET /js/bootstrap.min.js HTTP/1.1" 404 -
127.0.0.1 - - [04/Mar/2023 22:03:00] "GET /images/clone.jpg HTTP/1.1" 404 -
127.0.0.1 - - [04/Mar/2023 22:03:00] "GET /images/profile.jpg HTTP/1.1" 404 -

搜出来的大多数文章都只是说目录要放在static下，或者是要修改html文件里href后面的路径，用url_for之类的。
改目录怎么改都不管用。
最笨的办法就是把html里的href后的路径改了，我也试过，有用，比如把
href=“css/bootstrap.css” 改成 href=“/static/css/bootstrap.css”，一个index.html就有十几处，改了后的确渲染成功了，但是当点击其他链接要打开其他html时又提示找不到。
所以不可能把哪些全都改一遍吧，太费劲了，应该还是flask的参数配置没对，终于参考这篇找到了真正的解决办法。

解决办法

在不改动任何下载的网页模板html情况下，
加上static_url_path=‘’，就可以加载指定的文件夹里的静态文件。我把静态文件也指定到templates里，从而让他们和html文件保持在同一目录，跟下载下来的一样，就可以完美加载所有模板里的资源了。

from flask import Flask, request, render_template

app = Flask(__name__, static_url_path='', static_folder='templates', template_folder='templates')

@app.route('/', methods=['GET', 'POST'])
def home():
    return render_template('/index.html')