5

特定の目的で HTML5 オフライン アプリケーション キャッシュを使用する Web サイトのアイデアを試作しています。Web サイトは Python と Flask で構築されますが、そこが私の主な問題の原因です。この 2 つを初めて使用するので、マニフェスト ファイルを期待どおりに動作させるのに苦労しています。

問題は、マニフェスト ファイルに含まれる静的ファイルから 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 が 1 回でも失敗すると、プロセスが完全に停止し、オフライン キャッシュが機能しなくなります。

これが私のファイルの構造です。

  • サンドボックス
    • オフラインアプリ
      • オフライン app.py
      • 静的
        • マニフェスト.appcache
        • script.js
        • スタイル.css
      • テンプレート
        • offline-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