deploy（google appengine）で更新されないCSSファイル

Question

私は自分のウェブサイトの新しいバージョンをプッシュしましたが、今ではCSSと静的画像が適切に展開されていません。

これがめちゃくちゃページです： http://www.gaiagps.com

Appengineには、最新バージョンが正しいと表示されます。 http://1.latest.gaiagps.appspot.com/

何か助けがありますか？

Answer 1

キャッシュバスティングクエリパラメーターを使用している場合でも、アプリエンジンでこれを見たことがあります /stylesheets/default.css?{{ App.Version }}.

これが私の（未確認の）理論です：

1. 新しいバージョンを展開または変更することにより、新しいバージョンをプッシュします default.
2. このアップデートは、アプリを実行しているすべてのGAEインスタンスに伝播されています...
3. ...誰かがあなたのサイトにぶつかります。
4. 静的リソースのリクエスト default.css{{ App.Version }} GoogleのCDNに送信されていますが、まだありません。
5. GoogleのCDNは、ステップ＃2からの伝播がすべてのインスタンスで行われる前に、リソースをGAEに尋ねます。
6. あなたが不運であれば、Gaeは古いバージョンを実行しているインスタンスからリソースを提供します...
7. ...これは、GoogleのCDNで権威ある「新しい」バージョンとしてキャッシュされています。

これ（これが起こっている場合）が発生した場合、キャッシュバスティングブラウザの作業が役に立たないことを確認できます。 Google CDNサーバーは間違ったバージョンを保持しています。

修正する： これを修正する唯一の方法は、別のバージョンを展開することです。レースの状態が発生したとしても、おそらく2番目のアップデートが2番目のアップデートを展開するまでに行われるため、これが再び発生するリスクを再び実行しません（レースの状態からCSSの変更を行っていない場合）したがって、すべてのインスタンスは、何があっても正しいバージョンを提供します。

Answer 2

以下は私のために働いたものです。

1. 静的ドメインからCSSファイルを提供します。これはGAEによって自動的に作成されます。

   //static. {your-app-id} .appspot.com/ {css-file-path}

2. アプリケーションを展開します。この時点で、アプリは壊れます。

3. CSSファイルのバージョンを変更します

   //static.（your-app-id} .appspot.com/ {css-file-path}？v= {version-name}

4. もう一度展開します。

CSSファイルを変更するたびに。 2,3と4を繰り返す必要があります。

Answer 3

私が何かが足りないのでなければ、あなたのリンクは私にはうまく見えます。

古いCSSをキャッシュしており、更新後に新しいCSSを取得していない場合があります。ブラウザキャッシュをクリアしてみて、それが機能するかどうかを確認してください。

1.latestに行くと、新しいCSSがキャッシュに含まれていないため、新しいCSSをダウンロードするため、正しく表示されます。

Answer 4

私もこの問題を抱えていました。私はゲーと一緒にフラスコを使用していたので、静的ハンドラーがありませんでした app.yaml. 。追加すると、展開が機能します。このようなものを追加してみてください

handlers:
- url: /static
  static_dir: static

あなたに app.yaml もう一度展開します。それは私のために働いた。どうやらGoogleは、ユーザーが表示できないと思われるファイルを更新しないことで最適化しようとしているようです。

Answer 5

によって見つかったように ショレシュ, 、Pyhtonの標準環境のドキュメントは、両方の設定が 静的キャッシュの有効期限, 、個々の要素 expiration トップレベルの要素 default_expiration, 、「有効期限の時間」を定義する責任があります。 Cache-Control と Expires HTTP応答ヘッダー」。これは、「ファイルがユーザーのブラウザ、およびインターネットサービスプロバイダーなどの中間キャッシュプロキシサーバーによってキャッシュされる可能性が高いことを意味します。

ここでの問題は、「アプリの新しいバージョンを再展開する」 いいえ キャッシュをリセットします。したがって、セットがある場合 default_expiration たとえば、15日間ですが、CSSまたはJSファイルを変更してアプリを再デプロイするには、特に中間キャッシュプロキシサーバーのために、アクティブなキャッシュのためにこれらのファイルが自動的に提供されるという保証はありません。 Google Cloudサーバーを含める - Project-name.appspot.comにアクセスしてから時代遅れのファイルも提供しているため、どのように思われます。

上記の同じドキュメントには、「静的ファイルを変更する予定がある場合は、短い（1時間未満）有効期限が必要です。ほとんどの場合、デフォルトの10分の有効期限が適切です」と述べています。それは考えるべきことです 前 静的キャッシュの有効期限を設定します。しかし、私のように、 事前にこのすべてを知りませんでした そして、すでにこの問題に巻き込まれているので、解決策を見つけました。

ドキュメントでは、これらの中間キャッシュプロキシをクリアすることは不可能であると述べていますが、少なくともGoogleクラウドキャッシュを削除できます。

そうするために, 、あなたに向かいます Googleクラウドコンソール そして、あなたのプロジェクトを開きます。左のハンバーガーメニューの下で、ストレージに移動します - >ブラウザ。そこには、少なくとも1つのバケツがあります：あなたのproject-name.appspot.com。ライフサイクル列の下で、project-name.appspot.comに関するリンクをクリックします。既存のルールは、今すぐ作成するルールと競合する可能性があるため、削除します。

ルールの追加]ボタンをクリックして、新しいルールを作成します。オブジェクト条件については、選択してください それだけ 「新しいバージョン」オプションを設定し、1に設定します。「続行」ボタンをクリックすることを忘れないでください。アクションについては、[削除]を選択し、[続行]ボタンをクリックします。新しいルールを保存します。

この新しく作成されたルールは、実施するのに最大24時間かかりますが、少なくとも私のプロジェクトでは数分しかかかりませんでした。稼働していると、アプリがあなたのproject-name.appspot.comの下であなたのアプリが提供するファイルのバージョンは 常に最新の展開になります, 、問題を解決します。また、静的ファイルを定期的に編集している場合は、 default_expiration app.yamlファイルの要素は、他のサーバーによる意図しないキャッシュを回避するのに役立ちます。

Answer 6

ここで何が私のために働いたのか：

最初に、私は変更しました バージョン の上 app.yaml.

次に、以下の手順に従ってください

コンソールに移動します - >プロジェクトをクリックします。

サイドメニューで、クリックします 計算 -> バージョン:

そこにはすべてのバージョンがあり、どのバージョンがデフォルトです。鉱山は古いバージョンに設定されていました。

新しいバージョンをマークします。

私のために働いた。懸念はありますか？

Answer 7

Pyhtonの標準環境のドキュメントから： static_cache_expiration.

特定の有効期限が刻まれたファイルが送信された後、ユーザーが独自のブラウザキャッシュをクリアしたとしても、中間キャッシュからそれをクリアする方法は一般にありません。アプリの新しいバージョンを再展開すると、キャッシュがリセットされません。したがって、静的ファイルを変更する予定がある場合は、短い（1時間未満）有効期限が必要です。ほとんどの場合、デフォルトの10分の有効期限が適切です。

Answer 8

この古い質問/一連の答えに来る新しい人々のために、私は更新された答えを与えたいと思いました。 2018 - 19年には、次の情報がおそらく人々が抱えているCSS更新のほとんどの問題のほとんどを修正すると思います。

あなたを確認してください app.yaml 以下があります：

 handlers:
   - url: /static
     static_dir: static

• 走る gcloud app deploy
• 10分間冷やします。

Answer 9

この問題を見ている新しい人には、キャッシュバーストアプローチを試してみましたが、ここで修正したようです。App.cfgファイルでCSSインポートに対して行ったことの例です。ファイルして、以下に設定します

<link href="{{ url_for('static', filename='file.css') }}?{{config.APP_ID}}" rel="stylesheet"> 

また、app.yamlファイルには、この構成を安全な側に追加する

ハンドラー：

• url： /static static_dir：static

Answer 10

ブラウザでキャッシュをクリアしてみてください。まったく同じ問題があり、キャッシュをクリアするだけで修正しました。