ホームページ  >  記事  >  バックエンド開発  >  Docker の nginx によって提供されるスタイルと画像がページ上で機能しない

Docker の nginx によって提供されるスタイルと画像がページ上で機能しない

王林
王林転載
2024-02-09 08:00:10707ブラウズ

docker 中 nginx 提供的样式和图像在页面上不起作用

php Xiaobian Youzi さんは、Docker で nginx を使用すると、ページ上にスタイルと画像が正しく表示されないという問題が発生する可能性があることを発見しました。これは、構成の問題または間違ったパスが原因である可能性があります。この問題を解決する前に、nginx 構成ファイルとファイル パスを注意深くチェックして、正しく設定および参照されていることを確認する必要があります。次に、この厄介な問題の解決に役立ついくつかの一般的な解決策を検討します。

質問内容

私は golang Web アプリケーションを持っており、その前に Nginx を使用して静的ファイルを提供し、それを Web アプリケーションのリバース プロキシとして使用することにしました。

Web アプリケーション用の Dockerfile:

リーリー

Docker 構成ファイル:

リーリー

および nginx 構成:

リーリー

Web ページ上に 2 つの画像があります。1 つは png、もう 1 つは svg です。css ファイルは非常に単純で、body タグとして background-color: lightblue と、js ファイルのみが含まれています。コンソールには「Loaded!」という文字列が記録されるだけです。 docker compose を使用してコンテナーを起動した後、次の問題が発生しました:

  1. 静的ファイルはランダムに提供されます。たとえば、png 画像は表示されるが svg は表示されない、CSS スタイルはページに適用されませんが、JavaScript コードは正常に実行されます。興味深いことに、ブラウザの開発ツールのネットワーク タブによれば、すべての静的ファイルが正常にフェッチされており、その内容を調べることができます。はい、キャッシュせずにページをリロードしようとしましたが、無駄でした。これはどんな魔法ですか?
  2. docker compose ファイルでわかるように、nginx と webapp のボリュームを設定しました。nginx の場合は正常に動作します。一部のアセットを削除してキャッシュせずにページをリロードすると、変更が適用されますが、変更するとテンプレート内のテキストはページには表示されませんが、Web アプリのコンテナーに移動してテンプレートのコンテンツを検査すると、変更されていますが、docker compose を使用してコンテナーを再起動するまでページには表示されません。ここで何か問題がありますか?

完全なコードはこちら - https://github.com/ivnku/tmp

ソリューション

  1. go Fiber の template は、Engine.Reload(true) を介してこの機能を提供します:
リーリー
  1. 静的ファイルは確かに Nginx によって提供されますが、正しい MIME タイプを持っていないだけです。 nginx.conf の http セクションに MIME タイプを含めると、この問題は解決されます:
リーリー

以上がDocker の nginx によって提供されるスタイルと画像がページ上で機能しないの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はstackoverflow.comで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。