Bagaimana Saya Boleh Menghalang Pelayar dan Pelayan Caching Fail CSS?

Menghalang Pelayar dan Pelayan Caching Fail CSS

Apabila membangunkan tapak web, selalunya mengecewakan untuk membuat perubahan CSS yang tidak mencerminkan serta-merta dalam pelayar. Ini mungkin disebabkan oleh caching oleh kedua-dua penyemak imbas dan pelayan.

Adakah Apache Cache CSS Fail?

Ya, Apache melakukan cache sumber secara lalai. Untuk menyemak sama ada pelayan Apache anda meng-cache fail CSS, anda boleh mendayakan penyahpepijatan dengan menambahkan baris berikut pada fail .htaccess anda:

LogFormat "%r %s %b %H" debuglog
CustomLog "| tail -f /dev/stderr -" debuglog

Muat semula halaman dan semak log nyahpepijat untuk baris berikut:

GET /css/main.css 200 7122 0

Nombor terakhir, "0," menunjukkan bahawa fail telah disampaikan daripada cache.

Mencegah Caching

Terdapat beberapa kaedah untuk mengelakkan cache fail CSS:

1. Tambahkan Rentetan Pertanyaan pada Nama Fail

Anda boleh menambahkan rentetan pertanyaan rawak pada penghujung nama fail CSS, memaksa penyemak imbas memuat turun fail dan bukannya menggunakan versi cache. Contohnya:

<link rel="stylesheet" type="text/css" href="style.css?v=2" />

2. Gunakan Pengepala Kawalan-Cache

Anda boleh menambah pengepala "Kawalan-Cache" pada respons HTTP, dengan menyatakan berapa lama penyemak imbas perlu cache fail. Contohnya:

header("Cache-Control: no-cache, no-store, must-revalidate");
header("Pragma: no-cache");

3. Gunakan mod_headers dalam Apache

Untuk pelayan Apache, anda boleh menggunakan modul mod_headers untuk mengelakkan caching. Tambahkan baris berikut pada fail .htaccess anda:

Header set Cache-Control "max-age=0, s-maxage=0, must-revalidate"

4. Panggil CSS dengan Nombor Versi

Pendekatan yang biasa digunakan oleh kebanyakan tapak web ialah memanggil CSS dengan nombor versi. Apabila anda mengemas kini CSS, tingkatkan nombor versi, memaksa penyemak imbas untuk memuatkan fail baharu. Contohnya:

<link rel="stylesheet" type="text/css" href="style.css?v=1" />

Apabila anda mengemas kini CSS, tukar "v=1" kepada "v=2".

Dengan melaksanakan satu atau lebih kaedah ini, anda boleh memastikan bahawa perubahan CSS anda serta-merta ditunjukkan dalam penyemak imbas, walaupun pada pelayan pengeluaran.

Atas ialah kandungan terperinci Bagaimana Saya Boleh Menghalang Pelayar dan Pelayan Caching Fail CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!