Bagaimana untuk melumpuhkan caching css

Dalam pembangunan web, helaian gaya CSS adalah bahagian penting. Semasa pembinaan tapak web, kami sentiasa mengubah suai helaian gaya untuk memenuhi keperluan reka bentuk dan fungsian. Walau bagaimanapun, kadangkala kami mengalami masalah yang mengecewakan: kami mengubah suai lembaran gaya, tetapi tiada perubahan dalam prestasi tapak web. Ini kerana penyemak imbas menyimpan cache fail CSS kami dan tidak lagi membuat permintaan kepada pelayan. Satu cara untuk menyelesaikan masalah ini ialah menggunakan kawalan cache CSS, yang memastikan perkara ini tidak berlaku apabila kami membuat pengubahsuaian lembaran gaya.

Kawalan cache CSS merujuk kepada menetapkan fail CSS dalam pelayar klien supaya tidak dicache, dengan itu memastikan penyemak imbas akan meminta fail CSS terkini daripada pelayan setiap kali. Proses ini perlu diselesaikan melalui pengepala HTTP. Kita boleh mengawal tingkah laku caching penyemak imbas untuk helaian gaya dengan menetapkan pengepala ini.

Berikut ialah beberapa cara untuk melumpuhkan caching CSS:

1. Tambah nombor versi semasa memperkenalkan fail CSS ke dalam HTML

Setiap kali fail CSS berada diubah suai, Kami boleh menambah nombor versi pada fail CSS, seperti yang ditunjukkan di bawah:

<link rel="stylesheet" href="style.css?v=1.0">

Dengan cara ini, selepas setiap pengubahsuaian, cuma tetapkan nilai baharu pada nombor versi, dan penyemak imbas akan berfikir ini ialah sumber yang berbeza, dengan itu meminta semula pelayan untuk mendapatkan fail CSS terkini.

2. Mengkonfigurasi kawalan cache pada pelayan

Menetapkan kawalan cache pada pelayan ialah kaedah yang sangat cekap. Kami boleh melumpuhkan cache CSS dengan menetapkan maklumat pengepala Tamat Tempoh atau Kawalan Cache dalam pengepala respons HTTP. Contoh berikut:

Cache-Control:no-cache, no-store, must-revalidate
Pragma: no-cache
Expires: 0

Antaranya, arahan Cache-Control no-cache menunjukkan bahawa kami tidak mahu penyemak imbas mencache sumber ini, dan Pragma:no-cache memberitahu penyemak imbas untuk tidak menggunakan versi lama kandungan cache, oleh itu Setiap permintaan akan mengambil sumber daripada pelayan. Akhir sekali, Tamat Tempoh: 0 menunjukkan bahawa sumber telah tamat tempoh dan oleh itu perlu diperolehi daripada pelayan sekali lagi.

3. Gunakan tag meta untuk mengawal caching

Kaedah lain ialah menggunakan tag meta untuk mengawal caching. Kaedah ini biasanya digunakan dalam halaman HTML, tetapi juga boleh digunakan dalam fail CSS. Kami boleh menambah kod berikut pada fail HTML atau CSS:

<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="0">

Dengan cara ini, semua pengepala permintaan akan mengandungi arahan ini dan memberitahu penyemak imbas untuk memaksa fail CSS terkini diperoleh daripada pelayan.

Ringkasan

Kawalan cache CSS adalah kunci untuk memastikan tapak web kami sentiasa boleh memaparkan gaya terkini apabila pengubahsuaian gaya dibuat. Di antara tiga kaedah di atas, kaedah pertama adalah kaedah yang mudah dan berkesan, tetapi ia memerlukan pengurusan nombor versi manual, kaedah kedua ditetapkan pada bahagian pelayan, supaya pelayar klien tidak lagi menyimpan fail CSS untuk memastikan pelayan dikonfigurasikan dengan betul. Kaedah ketiga ialah menggunakan tag meta dalam teg HTML, yang memastikan bahawa fail CSS tidak akan dicache, tetapi anda perlu menambah teg ini pada setiap halaman halaman web. Secara keseluruhan, kami perlu memilih kaedah yang paling sesuai untuk situasi khusus kami untuk melumpuhkan cache CSS bagi memastikan pengubahsuaian helaian gaya kami boleh berkuat kuasa tepat pada masanya.

Atas ialah kandungan terperinci Bagaimana untuk melumpuhkan caching css. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!