在接触了JavaScript世界中的Svelte/Rollup之后,我印象深刻的是,它可以在对源代码进行更改时自动刷新浏览器。在Python中寻找类似的行为时,我发现了支持与Flask集成的包livereload (非常确定地使用相同的技术)。我希望刷新的结果能够反映对源代码的所有更改。
我正在使用带有livereload v2.5.1的WSL,并通过Chrome查看。我可以成功地让页面刷新检测到的源代码更改,但刷新不会重新下载新文件,而只是显示缓存的文件。页面确实会刷新,但我需要按下Ctrl +单击刷新才能看到实际的更改。使用开发人员模式并关闭缓存可以按需工作。使用Svelte/Rollup不需要禁用缓存来查看源代码更改。
我的大多数更改都是从标准Flask项目模板中的'static‘文件夹中提供的*.css或*.js文件,并使用Flask的'render_template’函数呈现。
我启动我的Flask服务器,如下所示:
app = create_app()
app.debug = True
app.config['TEMPLATES_AUTO_RELOAD'] = True
server = Server(app.wsgi_app)
server.watch(filepath='static/*', ignore=lambda *_: False)
server.serve(liveport=35729, host='127.0.0.1', port=80)
我希望不必禁用缓存,这样由livereload触发的刷新实际上反映了源文件中的更改。我可以使用Flask或livereload中的设置来实现这一点吗?或者这是livereload包的一个功能请求?
相关问题:
How to automate browser refresh when developing an Flask app with Python?
更新编辑:进一步的测试表明这是Chrome的一个问题,对于Firefox来说,它开箱即用。深入研究底层的livereload.js库,似乎有一个'isChromeExtension‘参数,我曾试图强制将其设置为True,但没有效果。
发布于 2020-08-08 09:30:54
我遇到了同样的问题,下面是我为解决这个问题所做的。正如您所提到的,这是一个浏览器缓存问题。所以我们想要使缓存的css/js文件无效。我们可以通过在静态文件上设置版本来实现这一点。我们希望每次对css文件进行更改时,版本都会发生变化。我的所作所为听起来有点老生常谈,但你会明白的。
下面是我的html模板
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Hello World</title>
<link href="{{ url_for('static', filename='main.css', version=time)}}" rel="stylesheet" type="text/css" />
</head>
<body>
<h1 class="hello-color">
{{ message }}
</h1>
</body>
</html>
你可以看到version=time
,我正在传递当前时间的模板,如下所示。
from flask import Flask, render_template
from time import time
app = Flask(__name__)
@app.route("/")
def hello():
return render_template('hello.html', message="Hello World!", time=time())
from time import time
和time=time()
最后是我的主python文件
from app import app
from livereload import Server
if __name__ == '__main__':
server = Server(app.wsgi_app)
server.serve(port=2200, host='0.0.0.0')
希望这篇文章能帮助你或其他任何人解决这个问题。
https://stackoverflow.com/questions/57807391
复制相似问题