5

我正在为一个将 HTML5 离线应用程序缓存用于某些目的的网站设计一个想法。该网站将使用 Python 和 Flask 构建，这就是我的主要问题所在：我是第一次使用这两个，所以我很难让清单文件按预期工作。

问题是我从清单文件中包含的静态文件中获取 404。清单本身似乎已正确下载，但它指向的文件却没有。这是加载页面时在控制台中吐出的内容：

Creating Application Cache with manifest http://127.0.0.1:5000/static/manifest.appcache offline-app:1

Application Cache Checking event offline-app:1

Application Cache Downloading event offline-app:1

Application Cache Progress event (0 of 2) http://127.0.0.1:5000/style.css offline-app:1

Application Cache Error event: Resource fetch failed (404) http://127.0.0.1:5000/style.css

错误在最后一行。

当appcache失败一次时，它会完全停止进程并且离线缓存不起作用。

这就是我的文件的结构：

  • 沙盒
    • 离线应用
      • 离线-app.py
      • 静止的
        • manifest.appcache
        • 脚本.js
        • 样式.css
      • 模板
        • 离线-app.html

这是offline-app.py的内容：

from flask import Flask, render_template
app = Flask(__name__)

@app.route('/offline-app')
def offline_app():
    return render_template('offline-app.html')

if __name__ == '__main__':
    app.run(host='0.0.0.0', debug=True)

这就是我在offline-app.html中的内容：

<!DOCTYPE html>
<html manifest="{{ url_for('static', filename='manifest.appcache') }}">
<head>
    <title>Offline App Sandbox - main page</title>
</head>
<body>
<h1>Welcome to the main page for the Offline App Sandbox!</h1>
<p>Some placeholder text</p>
</body>
</html>

这是我的manifest.appcache文件：

CACHE MANIFEST
/style.css
/script.js

我尝试过以我能想到的所有不同方式拥有清单文件：

CACHE MANIFEST
/static/style.css
/static/script.js

或者

CACHE MANIFEST
/offline-app/static/style.css
/offline-app/static/script.js

这些都不起作用。每次都返回相同的错误。

我确定这里的问题是服务器如何提供清单中列出的文件。我猜这些文件可能是在错误的地方查找的。我要么应该将它们放在其他地方，要么在缓存清单中需要不同的东西，但我不知道是什么。我在网上找不到任何关于使用 Flask 使用 HTML5 离线应用程序的信息。

有人能帮我吗？

4

1 回答 1

7

我原以为这个会起作用：

CACHE MANIFEST
/static/style.css
/static/script.js

但无论如何，您都不应该对静态文件的 URL 进行硬编码。最好将清单作为模板提供（移动到“模板”文件夹），以便您可以使用它url_for来生成静态文件的路径，如下所示：

CACHE MANIFEST
{{ url_for('static', filename='style.css') }}
{{ url_for('static', filename='script.js') }}

然后在您的 HTML 模板中，您将引用路由而不是静态文件：

<html manifest="{{ url_for('manifest') }}">

最后，您将添加一个返回清单的新视图函数：

from flask import make_response

@app.route('/manifest')
def manifest():
    res = make_response(render_template('manifest.appcache'), 200)
    res.headers["Content-Type"] = "text/cache-manifest"
    return res
于 2013-06-27T22:19:10.190 回答