clipboard api 可用需同时满足安全上下文、用户手势触发、页面有焦点等条件，仅检查 navigator.clipboard 存在会导致 securityerror；readtext() 需用户交互后请求权限，ios safari 不支持；writetext() 是最简写入方式，但需清理字符串并避免 null/undefined。
Clipboard API 的可用性判断不能只看 navigator.clipboard 是否存在
很多开发者直接检查 navigator.clipboard 存在就认为可用了，但实际会遇到 SecurityError: Clipboard API denied。这是因为 Clipboard API 只在安全上下文（HTTPS 或 localhost）中可用，且必须由用户手势（如 click、keydown）触发——异步回调（比如 setTimeout 或 Promise resolve 后）调用会失败。
正确做法是：
- 在事件处理器内直接调用，不跨 tick；
- 用
document.hasFocus()确保页面有焦点； - 捕获
NotAllowedError和SecurityError并降级到 document.execCommand（仅旧版 Safari 支持）； - 避免在 iframe 中调用，除非显式设置了
sandbox="allow-scripts allow-same-origin"且父页也满足安全上下文。
读取剪贴板文本需显式请求权限，且不能跳过用户交互
navigator.clipboard.readText() 是异步操作，但浏览器不会自动弹出权限提示——它只在首次调用时静默拒绝，后续才可能触发权限请求（行为因浏览器而异）。Chrome 和 Edge 在用户点击后首次调用会弹出“允许访问剪贴板”提示；Firefox 则要求先调用 navigator.permissions.query({name: 'clipboard-read'}) 主动申请，否则直接报错。
稳妥写法：
- 先尝试
navigator.clipboard.readText()，捕获NotAllowedError； - 若失败，再调用
navigator.permissions.query({name: 'clipboard-read'})，检查state是否为'granted'； - 不要在非用户手势中预请求权限，这会被忽略或拒绝；
- 注意：iOS Safari 目前完全不支持
readText()，只能写入。
写入纯文本最简路径是 navigator.clipboard.writeText()，但要注意字符串编码
navigator.clipboard.writeText() 是目前兼容性最好、最易用的写入方式（Chrome 66+、Firefox 63+、Safari 13.1+），但它只接受字符串，不处理富文本或图片。常见陷阱是传入含控制字符或未转义换行符的字符串，在某些终端或编辑器中粘贴异常。
实操建议：
- 写入前用
String.prototype.trim()清理首尾空白； - 换行统一用
'\n'（而非'\r\n'），浏览器会按目标应用习惯转换； - 避免传入
undefined或null，会转成字符串"undefined"或"null"； - 如需写入 HTML 片段，必须用
write()+ClipboardItem（兼容性差，Safari 不支持），不推荐在原生方案中强求。
降级到 document.execCommand 需绕过现代浏览器限制
尽管 document.execCommand('copy') 已废弃，但在 Safari
实现要点：
- 创建临时
<textarea></textarea>或<input type="text">，设style="position:fixed;opacity:0;top:-9999px;"； - 设置
value或textContent，然后调用select()； - 立即执行
document.execCommand('copy')，不能加 delay； - 执行后移除元素，避免累积 DOM 节点；
- 注意：Firefox 57+ 默认禁用
execCommand，需在 about:config 中开启dom.allow_cut_copy（用户侧不可控，仅作兜底说明）。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
