# Web API Reference

URL: https://caijiao.org/reference/web-api/
Source: docs/reference/web-api/index.md
Description: Web API Reference 汇总浏览器常用 API，包括 Clipboard、URL、URLSearchParams、FormData、Blob、Web Storage、Web Crypto 等语法、示例、常见错误和可运行演示。

Web API Reference 用于快速查询浏览器提供的能力，例如剪贴板、URL 解析、表单数据、文件对象、二进制数据和本地存储。这里的页面优先给出可复制写法，并在适合时提供可运行演示。

## 常用 Web API

- [Clipboard API](/reference/web-api/clipboard)：复制文本、读取剪贴板和处理权限限制。
- [URL API](/reference/web-api/url)：解析、拼接和修改 URL 的协议、域名、路径、查询参数和 hash。
- [URLSearchParams](/reference/web-api/urlsearchparams)：读取、追加、删除和序列化查询参数。
- [FormData](/reference/web-api/formdata)：收集表单字段、上传文件和构造 multipart 请求体。
- [Blob](/reference/web-api/blob)：创建文本、JSON、文件下载和对象 URL。
- [Web Storage](/reference/web-api/web-storage)：使用 localStorage 和 sessionStorage 保存少量浏览器本地数据。
- [Web Crypto API](/reference/web-api/web-crypto)：生成安全随机数、UUID、哈希摘要和基础密码学操作。
- [Fetch API](/reference/web-api/fetch)：发送 HTTP 请求并处理响应。
- [File API](/reference/web-api/file)：读取用户选择或拖拽的文件信息。
- [FileReader](/reference/web-api/filereader)：把 File 或 Blob 读取为文本、Data URL 或 ArrayBuffer。
- [WebSocket](/reference/web-api/websocket)：建立浏览器与服务端的实时长连接。
- [IntersectionObserver](/reference/web-api/intersectionobserver)：观察元素进入视口，适合懒加载和曝光统计。
- [ResizeObserver](/reference/web-api/resizeobserver)：监听元素尺寸变化。
- [MutationObserver](/reference/web-api/mutationobserver)：监听 DOM 结构和属性变化。
- [Web Workers](/reference/web-api/web-workers)：把耗时任务放到后台线程。

## 适合配演示的场景

- 剪贴板复制需要用户点击触发，适合做按钮演示。
- URLSearchParams 可以直接展示查询参数读取和修改结果。
- Blob 可以演示创建文本文件并下载。
- Web Storage 可以演示写入、读取、删除和过期时间处理。

## 相关内容

- [Reference 技术手册](/reference/)
- [JavaScript Reference](/reference/javascript/)
- [JavaScript / TypeScript 问题](/how-to/javascript/)
- [URL Encoder / Decoder](/tool/url-encoder-decoder)
- [Base64 Encoder / Decoder](/tool/base64-encoder-decoder)
- [Hash Generator](/tool/hash-generator)
- [UUID Generator](/tool/uuid-generator)