Apakah tiga cara untuk menetapkan cache dalam html-html tutorial-php.cn

Apakah tiga cara untuk menetapkan cache dalam html

WBOY

Lepaskan： 2024-02-22 22:57:04

asal

1318 orang telah melayarinya

Apakah tiga cara untuk menetapkan cache dalam html

Apakah tiga cara untuk menetapkan cache dalam HTML? Dalam pembangunan web, untuk meningkatkan kelajuan akses pengguna dan mengurangkan beban pelayan, kami boleh mengurangkan masa memuatkan halaman web dengan menetapkan cache. Seterusnya, saya akan memperkenalkan anda kepada tiga kaedah cache HTML yang biasa digunakan secara terperinci dan memberikan contoh kod khusus.

Kaedah 1: Tetapkan cache melalui pengepala respons HTTP

"Kawalan Cache" dan "Tamat tempoh" dalam pengepala respons HTTP ialah dua atribut yang biasa digunakan untuk menetapkan cache. Dengan menetapkan dua sifat ini, anda boleh mengawal gelagat caching penyemak imbas untuk kandungan web.

Atribut Cache-Control

Atribut Cache-Control ditetapkan dalam pengepala respons HTTP dan digunakan untuk menentukan cara penyemak imbas menyimpan cache kandungan halaman web. Ia boleh mempunyai berbilang nilai, yang biasa digunakan ialah:

awam: membenarkan caching awam, iaitu, semua pelayan cache dan penyemak imbas boleh cache halaman web.
peribadi: Hanya caching peribadi dibenarkan, iaitu, hanya penyemak imbas boleh cache halaman web.
no-store: Lumpuhkan caching, penyemak imbas tidak akan cache kandungan halaman web.
max-age: Tetapkan masa kesahihan maksimum cache, dalam beberapa saat.

Berikut ialah contoh, menetapkan Kawalan Cache kepada awam dan umur maksimum kepada 3600 saat (1 jam):

HTTP/1.1 200 OK
Cache-Control: public, max-age=3600

Salin selepas log masuk

Atribut Tamat tempoh

Atribut Tamat Tempoh ialah nilai masa mutlak yang digunakan untuk menentukan tamat tempoh cache masa. Kali ini ialah rentetan tarikh dalam format GMT, menunjukkan bahawa cache akan tamat tempoh selepas masa ini.

Berikut ialah contoh, tetapan Tamat Tempoh hingga 1 Januari 2022:

HTTP/1.1 200 OK
Expires: Sat, 01 Jan 2022 00:00:00 GMT

Salin selepas log masuk

Kaedah 2: Gunakan tag HTML untuk menetapkan cache

Selain menetapkan atribut cache melalui pengepala respons HTTP, kami juga boleh menggunakan tag HTML untuk menetapkan cache . Teg yang biasa digunakan termasuk dan .

Gunakan teg

Teg boleh diletakkan dalam teg

Berikut ialah contoh, menetapkan Kawalan Cache kepada awam dan umur maksimum kepada 3600 saat:

<html>
<head>
<meta http-equiv="Cache-Control" content="public, max-age=3600">
</head>
<body>
<!-- 网页内容 -->
</body>
</html>

Salin selepas log masuk

Gunakan teg

Fail CSS. Kami boleh menetapkan atribut cache dalam teg

Berikut ialah contoh, menetapkan Kawalan Cache kepada awam dan umur maksimum kepada 3600 saat:

<link rel="stylesheet" href="styles.css" type="text/css" 
      http-equiv="Cache-Control" content="public, max-age=3600">

Salin selepas log masuk

Kaedah 3: Menggunakan JavaScript untuk menetapkan cache

Selain menetapkan atribut cache menggunakan pengepala respons HTTP dan tag HTML, kami juga boleh menggunakan JavaScript untuk menetapkan cache.

Dengan menggunakan objek localStorage atau sessionStorage pelayar, kami boleh menyimpan dan membaca data untuk mencapai kesan caching.

Berikut ialah contoh menggunakan localStorage untuk menetapkan pasangan nilai kunci dan mendapatkan nilai daripadanya:

<script>
// 设置缓存
localStorage.setItem("key", "value");

// 获取缓存
var value = localStorage.getItem("key");
console.log(value); // 输出"value"
</script>

Salin selepas log masuk

Ringkasan

Dengan menyediakan cache, kami boleh meningkatkan kelajuan pemuatan dan pengalaman pengguna halaman web dengan berkesan. Dalam HTML, kami boleh melaksanakan caching dengan menetapkan pengepala respons HTTP, menggunakan teg HTML dan JavaScript. Dengan memilih kaedah dan atribut yang sesuai, strategi caching boleh disesuaikan mengikut senario dan keperluan yang berbeza.

Atas ialah kandungan terperinci Apakah tiga cara untuk menetapkan cache dalam html. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!