2016-03-21 43 views
1

私はチュートリアルに従い、Vagrant VM(提供者としてシェフを使用)上で実行されているnginxサーバーを持っています。私は単一のhtmlページ、index.htmlしか持っていません。変更を加えてvagrant provisionを実行すると、ブラウザのページに移動したときに変更が反映されます。しかし、nginxが提供しているcssとjsファイルもあります。変更を加えると、VMをリロードした後でも、その変更はページに反映されません。これは、私がVMにSSHできて、新しいバージョンのファイルが実際にVM上にあることを確認しているにもかかわらずです。変更を加えたときにVMを上書きしたときに、VMが古いファイルにどのようにアクセスできるかを把握することはできません。たぶん私のnginx設定ファイルに何か問題がありますか?ここです:CSSと.jsファイルの更新がnginxサーバーに表示されない

server { 
    listen 80 default_server; 
    listen [::]:80 default_server ipv6only=on; 

    root /home/vagrant/project/webroot; 
    index index.html index.htm; 

    # Make site accessible from http://localhost/ 
    server_name localhost; 

    location/{ 
     # First attempt to serve request as file, then 
     # as directory, then fall back to displaying a 404. 
     try_files $uri $uri/ =404; 
     # Uncomment to enable naxsi on this location 
     # include /etc/nginx/naxsi.rules 
    } 

私はVM上webrootに保存されているすべての3つのファイル(JS、CSSとHTML)ファイルを持っています。私が言ったように、私はSSHを利用して、彼らがどこにいるのかを確認できるので、構成上の問題でなければならないと思う。私はcssとjsファイルのために特別なことをする必要がありますか?

答えて

6

1)Nginxの設定にキャッシュコントロールヘッダーを追加できます。

location ~* ^.+\.(js|css)$ { 
    #old style: add_header Cache-Control "no-store, no-cache, must-revalidate, post-check=0, pre-check=0"; 
    #old style: add_header Pragma "no-cache"; 
    expires -1; 
    sendfile off; #if you're using virtualbox (it is not about cache, but you will need it) https://www.vagrantup.com/docs/synced-folders/virtualbox.html 
} 
+0

それはそれをやった!本当にありがとう、本当にこの壁の壁に私の頭を叩いていた。 – Adam

+0

上記のことは、静的ファイルが決してキャッシュされないことを意味します。ブラウザの呼び出しごとに、静的ファイルが送信されます。 @Kilizoが述べたように、この問題はブラウザ側でキャッシュする必要があります。上記の修正により問題は解決されている可能性がありますが、ブラウザのリクエストごとにファイルを送信するようにnginxサーバを設定している可能性があります(キャッシュなし)。詳細はこちら。 https://css-tricks.com/strategies-for-cache-busting-css/およびhttp://stackoverflow.com/questions/30921598/what-does-expires-1-mean-in-nginx-location-directive – bgth

1

あなたのブラウザが古いCSSファイルとJSファイルをキャッシュしていないことは確かですか?

+0

どうすれば確認できますか?私はちょうどキャッシュをクリアすると思いますか?違いがある場合はChromeを使用しています。 – Adam

+1

シークレットでサイトを読み込んだり、キャッシュをクリアしたりしてください。デベロッパーツールを使用して、キャッシュされたCSSファイルの有効期限を確認することができます。このリンクはhttp://www.devcurry.com/2012/03/how-to-determine-resources-coming-from.htmlに役立ちます – Kilizo

+0

いいえ、運もいい考えです。ありがとう – Adam

関連する問題