Apakah sebab tidak berjaya menyimpan data ke storan setempat?

Mengapa saya tidak berjaya menyimpan data ke dalam storan setempat?

Dalam pembangunan bahagian hadapan, kami selalunya perlu menyimpan data pada bahagian klien supaya data dapat dikekalkan selepas pengguna meninggalkan halaman. Localstorage ialah kaedah biasa yang boleh digunakan untuk menyimpan pasangan nilai kunci dan data masih wujud selepas pengguna menutup penyemak imbas. Walau bagaimanapun, kadangkala kami mungkin menghadapi beberapa masalah dan tidak berjaya menyimpan data ke dalam storan setempat. Artikel ini meneroka beberapa punca dan penyelesaian biasa serta menyediakan contoh kod khusus.

1. Had saiz data: Kapasiti storan setempat biasanya terhad dan penyemak imbas berbeza mempunyai sekatan yang berbeza. Had biasa ialah 5MB atau kurang. Jika anda cuba menyimpan lebih banyak data daripada had ini, storan akan gagal. Oleh itu, apabila menggunakan storan setempat untuk menyimpan data, perhatikan saiz data.

Penyelesaian: Anda boleh mengelak daripada melebihi had kapasiti storan setempat dengan mengehadkan saiz data yang disimpan. Sebagai contoh, untuk data besar, storan sharded boleh digunakan untuk membahagikan data kepada berbilang blok kecil untuk penyimpanan.

Kod sampel:

const data = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.';

// 检查数据大小是否超过localstorage的限制
if (data.length > 5 * 1024 * 1024) {
  // 数据过大，做相应处理
  console.log('数据过大，无法存储到localstorage中');
} else {
  // 将数据存储到localstorage中
  localStorage.setItem('data', data);
}

2. Ruang storan tidak mencukupi: Jika ruang cakera keras pengguna tidak mencukupi, atau penyemak imbas telah menetapkan dasar untuk mengehadkan ruang storan, menyimpan data dalam storan setempat mungkin gagal. Tetapan ini biasanya atas sebab keselamatan untuk mengelakkan tapak web daripada menggunakan ruang storan secara berlebihan.

Penyelesaian: Sebelum menyimpan data, anda boleh menyemak sama ada baki ruang storan setempat mencukupi. Jika ia tidak mencukupi, anda boleh mempertimbangkan untuk memadam beberapa data lama atau menggesa pengguna mengosongkan ruang storan.

Kod sampel:

const data = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.';

// 检查localstorage的剩余空间是否足够
if (data.length > (localStorage.remainingSpace || 0)) {
  // 存储空间不足，做相应处理
  console.log('存储空间不足，无法存储到localstorage中');
} else {
  // 将数据存储到localstorage中
  localStorage.setItem('data', data);
}

3. Sekatan mod privasi: Penggunaan storan setempat adalah dilarang dalam mod privasi sesetengah penyemak imbas, atau storan setempat dihadkan kepada mod baca sahaja. Akibatnya, percubaan untuk menyimpan data dalam storan setempat akan gagal.

Penyelesaian: Sebelum menggunakan storan setempat, anda boleh menyemak sama ada mod penyemak imbas ialah mod privasi dan melaksanakan gesaan atau pemprosesan yang sepadan.

Kod sampel:

// 检查浏览器是否处于隐私模式
if (localStorage === null || typeof localStorage === "undefined") {
  // 浏览器处于隐私模式，做相应处理
  console.log('浏览器处于隐私模式，无法使用localstorage');
} else {
  // 存储数据到localstorage
  localStorage.setItem('data', 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.');
}

4. Sekatan merentas domain: storan setempat terikat pada nama domain, iaitu data hanya boleh diakses di bawah nama domain yang sama. Jika terdapat permintaan merentas domain, percubaan untuk menyimpan data di bawah nama domain yang berbeza akan gagal.

Penyelesaian: Anda boleh menggunakan kaedah lain untuk menyimpan data merentas domain, seperti menggunakan kuki, IndexedDB, dsb.

Kod contoh:

// 跨域请求中无法使用localstorage
document.domain = "example.com";
localStorage.setItem('data', 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.');

Ringkasnya, kegagalan untuk berjaya menyimpan data ke dalam storan setempat mungkin disebabkan oleh sekatan saiz data, ruang storan yang tidak mencukupi, sekatan mod privasi, sekatan merentas domain, dsb. Dengan menyemak faktor seperti saiz data, ruang storan, mod privasi dan nama domain, kami boleh mencari punca kegagalan storan dan menyediakan penyelesaian yang sepadan. Dalam pembangunan sebenar, kita perlu memilih kaedah yang paling sesuai untuk menyimpan data mengikut situasi tertentu.

Atas ialah kandungan terperinci Apakah sebab tidak berjaya menyimpan data ke storan setempat?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!