Bagaimana cara mengatur header HTTP (untuk kontrol-cache)?

237

Bagaimana cara mengaktifkan cache browser untuk situs saya? Apakah saya hanya menempatkan kontrol cache: publik di suatu tempat di header saya seperti ini?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
Cache-Control:public;
>

Saya menggunakan versi terbaru PHP yang dikembangkan pada versi terbaru XAMPP.

andrew
sumber
bahasa sisi server apa yang Anda gunakan? PHP ?, ASP ?, JSP? cara Anda mengatur header serupa tetapi tidak persis sama. Atau jika Anda melakukan caching gambar ... sering kali ini dilakukan di konfigurasi Apache (atau server web) Anda
scunliffe
Sedihnya bahwa "solusi" hanya menghasilkan DOCTYPE yang tidak valid ;-) Jika Anda ingin melakukannya dari HTML (saya tidak akan merekomendasikannya), Anda akan menggunakan META HTTP-EQUIV

Jawaban:

198

Untuk menggunakan kontrol-cache dalam HTML, Anda menggunakan meta tag , mis

<meta http-equiv="Cache-control" content="public">

Nilai dalam bidang konten didefinisikan sebagai salah satu dari empat nilai di bawah ini.

Beberapa informasi pada Cache-Controlheader adalah sebagai berikut

HTTP 1.1. Nilai yang diijinkan = PUBLIC | PRIVATE | TANPA CACHE | TANPA TOKO.

Publik - dapat di-cache dalam cache bersama publik.
Pribadi - hanya dapat di-cache dalam cache pribadi.
No-Cache - mungkin tidak di-cache.
No-Store - mungkin di-cache tetapi tidak diarsipkan.

Arahan CACHE-CONTROL: NO-CACHE menunjukkan informasi yang di-cache tidak boleh digunakan dan sebaliknya permintaan harus diteruskan ke server asal. Arahan ini memiliki semantik yang sama dengan PRAGMA: NO-CACHE.

Klien HARUS menyertakan PRAGMA: NO-CACHE dan CACHE-CONTROL: NO-CACHE ketika permintaan no-cache dikirim ke server yang tidak memenuhi persyaratan HTTP / 1.1. Lihat juga kadaluarsa.

Catatan: Mungkin lebih baik untuk menentukan perintah cache di HTTP daripada di pernyataan META, di mana mereka dapat mempengaruhi lebih dari browser, tetapi proksi dan perantara lain yang mungkin menyimpan informasi cache.

Codemwnci
sumber
30
HTML5 melarang ini dan <meta>selalu menjadi cara yang mengerikan dan serpihan untuk menentukan caching.
Kornel
1
@porneL Saya mengalami kesulitan memahami bagian mana dari tautan Anda yang melarang bagian mana dari jawaban ... spesifikasi tag meta mengatakan apa-apa tentang tidak menyukai apa yang ditulis di sini, atau melarangnya?
Félix Gagnon-Grenier
1
@ FélixGagnon-Grenier "Atribut http-equiv adalah atribut yang disebutkan" artinya hanya memungkinkan nilai dalam tabel dalam spesifikasi. Bahkan menyebut caching di bagian selanjutnya ("arahan pragma lain"):> Arahan pragma terkait dengan header yang memengaruhi model pemrosesan HTTP (misalnya caching) tidak boleh didaftarkan, karena akan mengakibatkan perilaku tingkat HTTP berbeda untuk agen pengguna yang mengimplementasikan HTML daripada agen pengguna yang tidak.
Kornel
3
Dokumen yang dikutip tidak benar sehubungan dengan no-storenilai (meskipun dokumen itu sendiri merujuk RFC 2068 ) - no-storemencegah dokumen disimpan / di-cache sama sekali, di mana saja. Padahal no-cacheitu memungkinkan untuk disimpan, tetapi harus memeriksa dengan server setiap waktu. Browser akan cenderung untuk menyimpan no-cachehalaman untuk mengaktifkan fungsi tombol kembali dll.
MrWhite
3
Google menyediakan salah satu referensi termudah untuk IMO caching HTTP: developers.google.com/web/fundamentals/performance/…
MrWhite
137

Anda dapat mengatur tajuk di PHP dengan menggunakan:

<?php
  //set headers to NOT cache a page
  header("Cache-Control: no-cache, must-revalidate"); //HTTP 1.1
  header("Pragma: no-cache"); //HTTP 1.0
  header("Expires: Sat, 26 Jul 1997 05:00:00 GMT"); // Date in the past

  //or, if you DO want a file to cache, use:
  header("Cache-Control: max-age=2592000"); //30days (60sec * 60min * 24hours * 30days)

?>

Perhatikan bahwa tajuk tepat yang digunakan akan tergantung pada kebutuhan Anda (dan jika Anda perlu mendukung HTTP 1.0 dan / atau HTTP 1.1 )

scunliffe
sumber
3
Pragmadan Expiresmungkin berlebihan untuk sebagian besar browser. fastly.com/blog/headers-we-dont-want
thijsai
1
@ Thijsai ya HTTP / 1.0 juga sudah ketinggalan zaman ... hanya gunakan header yang Anda butuhkan berdasarkan matriks pengguna Anda
scunliffe
50

Seperti yang saya tulis adalah yang terbaik untuk menggunakan file tersebut.htaccess . Namun waspadalah terhadap waktu Anda meninggalkan konten dalam cache.

Menggunakan:

<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$">
Header set Cache-Control "max-age=604800, public"
</FilesMatch>

Di mana: 604800 = 7 hari

PS: Ini bisa digunakan untuk mereset header apa pun

William
sumber
30

Halaman di http://www.askapache.com/htaccess/apache-speed-cache-control.html menyarankan penggunaan sesuatu seperti ini:

Tambahkan Header Kontrol-Cache

Ini berlaku di file root .htaccess Anda tetapi jika Anda memiliki akses ke httpd.conf itu lebih baik.

Kode ini menggunakan direktif FilesMatch dan direktif Header untuk menambahkan Header Cache-Control ke file tertentu.

# 480 weeks
<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$">
Header set Cache-Control "max-age=290304000, public"
</FilesMatch>
kiwi yang marah
sumber
3
Apakah ketertiban dalam hal ini penting? "max-age = 290304000, publik" Atau "public, max-age = 290304000" atau keduanya sama-sama benar?
Satya Prakash
2
Urutan tidak masalah jika nilai tidak bertentangan (suka cachedan no-cache). max-agedan publictidak bertentangan sehingga ketertiban tidak masalah.
Blaise
1
Perhatikan bahwa karena menggunakan Headerarahan, Anda harus mengaktifkan mod_headers.
Skippy le Grand Gourou
@ Skippy le Grand Gourou bagaimana cara mengaktifkan mod_headers?
Sam
@SamuelStratford Saya membacanya berbeda di distribusi lain, tetapi di bawah Debian Anda dapat menggunakan a2enmodatau membuat tautan simbolis dari /etc/apache2/mods-available/headers.loadke /etc/apache2/mods-enabled/headers.load.
Skippy le Grand Gourou
21

Ini adalah yang terbaik yang .htaccesssaya gunakan di situs web saya yang sebenarnya:

<ifModule mod_gzip.c>
mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_item_include file .(html?|txt|css|js|php|pl)$
mod_gzip_item_include handler ^cgi-script$
mod_gzip_item_include mime ^text/.*
mod_gzip_item_include mime ^application/x-javascript.*
mod_gzip_item_exclude mime ^image/.*
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
</ifModule>

##Tweaks##
Header set X-Frame-Options SAMEORIGIN

## EXPIRES CACHING ##
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg "access 1 year"
ExpiresByType image/jpeg "access 1 year"
ExpiresByType image/gif "access 1 year"
ExpiresByType image/png "access 1 year"
ExpiresByType text/css "access 1 month"
ExpiresByType text/html "access 1 month"
ExpiresByType application/pdf "access 1 month"
ExpiresByType text/x-javascript "access 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType image/x-icon "access 1 year"
ExpiresDefault "access 1 month"
</IfModule>
## EXPIRES CACHING ##

<IfModule mod_headers.c>
    Header set Connection keep-alive
    <filesmatch "\.(ico|flv|gif|swf|eot|woff|otf|ttf|svg)$">
        Header set Cache-Control "max-age=2592000, public"
    </filesmatch>
    <filesmatch "\.(jpg|jpeg|png)$">
        Header set Cache-Control "max-age=1209600, public"
    </filesmatch>
    # css and js should use private for proxy caching https://developers.google.com/speed/docs/best-practices/caching#LeverageProxyCaching
    <filesmatch "\.(css)$">
        Header set Cache-Control "max-age=31536000, private"
    </filesmatch>
    <filesmatch "\.(js)$">
        Header set Cache-Control "max-age=1209600, private"
    </filesmatch>
    <filesMatch "\.(x?html?|php)$">
        Header set Cache-Control "max-age=600, private, must-revalidate"
      </filesMatch>
</IfModule>
Erich García
sumber
3
Contoh yang hampir sempurna dari file .htaccess ... Ini akan lengkap jika gambar tertentu dimasukkan & bagaimana menulis path ke gambar DAN di mana harus meletakkan file .htaccess (mis. Dalam dir gambar atau dir indeks)? .. .misalnya. '<IfModule mod_headers.c> <Files /img/myimage.jpg> Header menambahkan Kontrol-Cache "max-age = 3600, harus divalidasi ulang" </Files> </IfModule>' ... apakah ini akan berfungsi? .. . ATAU ... atau disisipkan ke img dir '<filesmatch "^ (contoh \ .jpg | sample \ .png) $"> Header atur Cache-Control "max-age = 31536000, publik" </filesmatch>' .. . Sebuah semua sama strategi tampaknya berisiko - pula contoh-contoh spesifik akan menjadi besar jika poss
Marco-UandL
2
hanya FYI: kompresi gzip pada file JS dan CSS dapat membantu memecah enkripsi SSL Anda. Jika Anda mengandalkan keamanan, jangan nyalakan gzip
Eduard Void
1
Ini adalah caching halaman akun login, jadi Anda tidak bisa keluar dari akun Anda. Lebih buruk lagi seseorang tidak bisa hanya mengakses halaman akun dan masuk dengan login pengguna terakhir. Ini tidak disarankan untuk digunakan di situs eCommerce, Anda kemudian harus menghapus <filesMatch "\.(x?html?|php)$">untuk menghindari halaman HTML statis di-cache. Sisa dari filematch tidak masalah.
nicoX
1
Anda telah menggandakan <filesmatch "\.(eot|woff|otf|ttf|svg)$">.
nicoX
2
Anda mengatur cssdan jske pribadi jika Anda memiliki caching proxy. Saya tidak dapat menemukan rekomendasi di tautan Anda mengenai hal itu. Kebanyakan CDN merekomendasikan Anda untuk menyimpan nilai-nilai itu.
nicoX
14

Untuk server Apache, Anda harus memeriksa mod_expires untuk mengatur Expires dan header Cache-Control.

Atau, Anda bisa menggunakan arahan Header untuk menambahkan Cache-Control sendiri:

Header set Cache-Control "max-age=290304000, public"
Peter Štibraný
sumber
5

Tag kontrol cache meta memungkinkan penerbit Web untuk menentukan bagaimana halaman harus ditangani oleh cache. Itu termasuk arahan untuk menyatakan apa yang harus disimpan dalam cache, apa yang dapat disimpan oleh cache, modifikasi mekanisme kedaluwarsa, dan validasi ulang dan memuat ulang kontrol.

Nilai yang diizinkan adalah:

Publik - dapat di-cache dalam cache bersama publik
- Pribadi - hanya dapat di-cache dalam cache pribadi
no-Cache - mungkin tidak di-cache
tanpa-Store - dapat di-cache tetapi tidak diarsipkan

Harap berhati-hati tentang sensitivitas kasus. Tambahkan tag meta berikut di sumber halaman web Anda. Perbedaan dalam pengejaan di akhir tag adalah Anda menggunakan "/> = xml atau"> = html.

    <meta http-equiv="Cache-control" content="public">
    <meta http-equiv="Cache-control" content="private">
    <meta http-equiv="Cache-control" content="no-cache">
    <meta http-equiv="Cache-control" content="no-store">

Sumber- > MetaTags

Karthik NG
sumber
koreksi: no-store tidak boleh di-cache, tidak ada cache diizinkan untuk di-cache tetapi harus diperiksa dengan server sebelum dipesan - lihat palizine.plynt.com/issues/2008Jul/cache-control-attributes
DangerMouse
Cache-Control no-store - no-store mirip dengan no-cache karena respons tidak dapat di-cache dan digunakan kembali, namun ada satu perbedaan penting. no-store membutuhkan sumber daya yang diminta dan diunduh dari server asal setiap kali. Ini adalah fitur penting ketika berhadapan dengan informasi pribadi.
MarcoZen
5

OWASP merekomendasikan yang berikut ini,

Kapan pun memungkinkan memastikan header HTTP kontrol-cache diatur dengan no-cache, no-store, harus divalidasi ulang, pribadi; dan bahwa header HTTP pragma diatur tanpa-cache.

<IfModule mod_headers.c>
    Header set Cache-Control "private, no-cache, no-store, proxy-revalidate, no-transform"
    Header set Pragma "no-cache"
</IfModule>
Won Jun Bae
sumber