HTML5オフラインアプリケーションキャッシュを特定の目的で使用するウェブサイトのアイデアを試作しています。このウェブサイトはPythonとFlaskで構築され、私の主な問題は次のようなものです。私はこれらの2つを初めて使っているので、マニフェストファイルを期待どおりに動作させるのは苦労しています。Flaskを使ってオフラインWebアプリケーションを構築するには?
問題は、マニフェストファイルに含まれる静的ファイルから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が一度も失敗すると、プロセスは完全に停止し、オフラインキャッシュは機能しません。
- サンドボックス
- オフラインアプリ
- offline-app.py
- 静的
- manifest.appcache
- スクリプトを:
は、これは私のファイルが構成されている方法です.js
- style.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)
これは私がオフラインapp.htmlにしたものである:私は、マニフェストファイルを持つ試みた
CACHE MANIFEST
/style.css
/script.js
:
<!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
/static/style.css
/static/script.js
または
CACHE MANIFEST
/offline-app/static/style.css
/offline-app/static/script.js
これらのどれも機能しませんでした。毎回同じエラーが返されました。
ここで問題となるのは、サーバーがマニフェストにリストされているファイルをどのように提供しているかです。これらのファイルは間違った場所で検索されている可能性があります。私はそれらをどこか別の場所に配置するか、キャッシュマニフェストでは別のものが必要ですが、私は何が分かりません。FlaskでHTML5オフラインアプリケーションを使用することについてオンラインで何かを見つけることができませんでした。
誰も私を助けることができますか?
は、それがために変更します私のためにそれを解決したテンプレートとして役立った。ありがとうございました! これを将来使用する人には、Miguelの答えに欠けている小さなものが2つしかありませんでした。あなたのファイルにmake_responseへのインポートを追加する必要があります(私の.pyは "Flask import Flask、render_template、make_response" )、ビュー関数では、レスポンスを返す "Content-Type"ヘッダーが設定されている場所の下に行を挿入します( "return res"のように)。 –
優秀!あなたの訂正で私の例を更新しました。 – Miguel