Cookie用于会话管理，大小受限且随请求发送；2. Web Storage提供大容量键值对存储，localStorage持久化，sessionStorage限会话；3. IndexedDB适合存储大量结构化数据；4. Cache API缓存网络资源，支持离线访问；5. File System Access API可读写本地文件，需用户授权。
JavaScript在浏览器中提供了多种存储机制，允许开发者在客户端保存数据。这些机制各有特点，适用于不同的使用场景。下面介绍几种常见的浏览器存储方式及其使用方法和适用情况。
Cookie
Cookies 是最早期的客户端存储技术，主要用于保存会话信息（如登录状态）或用户偏好设置。它们每次都会随HTTP请求发送到服务器，因此大小受限（通常为4KB左右）。
特点：
- 可设置过期时间（会话级或持久性）
- 可被服务器读取和设置（通过Set-Cookie响应头）
- 支持 domain 和 path 属性控制作用范围
- 存在安全风险（如XSS、CSRF），需设置HttpOnly、Secure、SameSite等属性增强安全性
使用示例：
立即学习“Java免费学习笔记（深入）”；
document.cookie = "username=John; expires=Fri, 31 Dec 2027 23:59:59 GMT; path=/";Web Storage（localStorage 和 sessionStorage）
HTML5 提供了更现代的存储方式：localStorage 和 sessionStorage，统称为 Web Storage。它们以键值对形式存储字符串数据，容量更大（通常为5~10MB），且不会随请求发送到服务器。
区别：
- localStorage：持久化存储，除非手动清除，否则数据一直存在
- sessionStorage：仅在当前会话有效，关闭标签页后自动清除
使用示例：
立即学习“Java免费学习笔记（深入）”；
localStorage.setItem('theme', 'dark');const theme = localStorage.getItem('theme');
localStorage.removeItem('theme');
IndexedDB
IndexedDB 是一个低级的、基于事务的数据库系统，适合存储大量结构化数据，比如文件、图片或离线应用数据。它支持异步操作，避免阻塞主线程。
专为中小型企业定制的网络办公软件,富有竞争力的十大特性： 1、独创 web服务器、数据库和应用程序全部自动傻瓜安装，建立企业信息中枢 只需3分钟。 2、客户机无需安装专用软件，使用浏览器即可实现全球办公。 3、集成Internet邮件管理组件，提供web方式的远程邮件服务。 4、集成语音会议组件，节省长途话费开支。 5、集成手机短信组件，重要信息可直接发送到员工手机。 6、集成网络硬
特点：
- 可存储对象、数组、二进制数据（Blob）等
- 支持索引和复杂查询
- 容量较大，通常可达几十MB甚至更多（取决于浏览器和设备）
- 使用较为复杂，需处理连接、事务、版本升级等逻辑
适用于需要离线工作的PWA应用或缓存大量数据的场景。
Cache API
Cache API 属于Service Worker生态的一部分，主要用于缓存网络请求和响应，实现离线访问和资源加速。
常见用途：
- 缓存静态资源（JS、CSS、图片）
- 实现自定义的网络请求拦截与响应策略
- 配合Service Worker构建PWA应用
不能直接存储普通数据，专为HTTP缓存设计。
File System Access API（实验性）
这是一个较新的API，允许网页安全地访问用户本地文件系统（需用户授权）。目前兼容性有限，主要用于特定场景如文档编辑器、代码编辑器等。
它不是传统意义上的“存储”，而是让用户主动选择文件进行读写。
基本上就这些主流的浏览器存储机制。选择哪种方式取决于你的具体需求：是否需要持久化、数据量大小、是否需要服务端访问、是否涉及二进制数据等。合理使用这些机制可以提升用户体验和应用性能。
