首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >让Livereload + Flask触发硬刷新

让Livereload + Flask触发硬刷新
EN

Stack Overflow用户
提问于 2019-09-05 22:11:14
回答 1查看 849关注 0票数 1

在接触了JavaScript世界中的Svelte/Rollup之后,我印象深刻的是,它可以在对源代码进行更改时自动刷新浏览器。在Python中寻找类似的行为时,我发现了支持与Flask集成的包livereload (非常确定地使用相同的技术)。我希望刷新的结果能够反映对源代码的所有更改。

我正在使用带有livereload v2.5.1的WSL,并通过Chrome查看。我可以成功地让页面刷新检测到的源代码更改,但刷新不会重新下载新文件,而只是显示缓存的文件。页面确实会刷新,但我需要按下Ctrl +单击刷新才能看到实际的更改。使用开发人员模式并关闭缓存可以按需工作。使用Svelte/Rollup不需要禁用缓存来查看源代码更改。

我的大多数更改都是从标准Flask项目模板中的'static‘文件夹中提供的*.css或*.js文件,并使用Flask的'render_template’函数呈现。

我启动我的Flask服务器,如下所示:

代码语言:javascript
运行
复制
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,但没有效果。

EN

回答 1

Stack Overflow用户

发布于 2020-08-08 09:30:54

我遇到了同样的问题,下面是我为解决这个问题所做的。正如您所提到的,这是一个浏览器缓存问题。所以我们想要使缓存的css/js文件无效。我们可以通过在静态文件上设置版本来实现这一点。我们希望每次对css文件进行更改时,版本都会发生变化。我的所作所为听起来有点老生常谈,但你会明白的。

下面是我的html模板

代码语言:javascript
运行
复制
<!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,我正在传递当前时间的模板,如下所示。

代码语言:javascript
运行
复制
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 timetime=time()

最后是我的主python文件

代码语言:javascript
运行
复制
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')

希望这篇文章能帮助你或其他任何人解决这个问题。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/57807391

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档