客户端存储解析：cookie、indexedDB、本地存储、会话存储区别

2023-10-25 07:36:58

cookie和indexedDB#

cookie和indexedDB本质区别

cookie是由服务器发送给客户端并保存在客户端计算机上的小块数据。cookie通常用于跟踪用户的浏览活动，如用户访问过的页面、用户在网站上花费的时间等。indexedDB是一种浏览器提供的本地数据库，允许Web应用程序在客户端计算机上存储数据。indexedDB比cookie更强大，可以存储更复杂的数据类型，如对象和数组。

存储大小

cookie的大小限制为4KB，而indexedDB的存储大小限制为250MB。

存储期限

cookie的存储期限由服务器决定，而indexedDB的存储期限由浏览器决定。

安全性

cookie可以被第三方读取和修改，而indexedDB只有创建它的应用程序才能读取和修改。

用途

cookie通常用于跟踪用户的浏览活动，如用户访问过的页面、用户在网站上花费的时间等。indexedDB可以存储更复杂的数据类型，如对象和数组，因此可以用于存储更广泛的数据，如用户数据、应用程序数据等。

例子

cookie示例：

setcookie("username", "John Doe", time() + (86400 * 30), "/");

这段代码设置了一个名为"username"的cookie，其值为"John Doe"，有效期为30天，作用域为整个网站。

indexedDB示例：

var request = indexedDB.open("myDatabase", 1);

request.onsuccess = function(event) {
  var db = event.target.result;

  var transaction = db.transaction(["users"], "readwrite");

  var objectStore = transaction.objectStore("users");

  var request = objectStore.add({
    name: "John Doe",
    email: "john.doe@example.com"
  });

  request.onsuccess = function(event) {
    console.log("User added successfully");
  };
};