浏览器网页剪贴板及其存储不同类型数据的方式
💡
原文中文，约13800字，阅读约需33分钟。
📝
内容提要
本文探讨了网页剪贴板及其API，分析了剪贴板如何存储文本、HTML和图像等不同数据类型。介绍了异步剪贴板API及其对非标准数据类型（如JSON）的支持限制，讨论了剪贴板事件API的历史与安全性问题。最后提到Web自定义格式提案，旨在安全实现自定义数据类型的剪贴板写入。
🎯
关键要点
- 网页剪贴板可以存储多种类型的数据，如文本、HTML和图像。
- 异步剪贴板API支持的强制数据类型仅限于text/plain、text/html和image/png。
- 剪贴板事件API允许写入任意数据类型，但仅在用户代理触发的事件中有效。
- 使用ClipboardItem可以将多个表示形式写入剪贴板，但不支持application/json等非标准类型。
- Google Docs和Figma等应用通过execCommand实现自定义数据类型的剪贴板写入。
- Web自定义格式提案允许通过异步剪贴板API安全地写入自定义数据类型。
- 当前没有通用的方法在所有浏览器中实现自定义数据类型的剪贴板写入。
- unsanitized选项允许从剪贴板读取未经清理的数据，但目前仅在基于Chromium的浏览器中支持。
❓
延伸问答
网页剪贴板支持哪些数据类型？
网页剪贴板支持的强制数据类型包括text/plain、text/html和image/png。
异步剪贴板API的限制是什么？
异步剪贴板API仅支持text/plain、text/html和image/png等强制数据类型，不支持application/json等非标准类型。
如何使用剪贴板事件API写入自定义数据类型？
可以通过在copy事件中使用clipboardData.setData方法来写入自定义数据类型，但必须在用户代理触发的事件中使用。
Web自定义格式提案的目的是什么？
Web自定义格式提案旨在通过异步剪贴板API安全地写入自定义数据类型。
为什么不能在所有浏览器中实现自定义数据类型的剪贴板写入？
目前尚无通用的方法在所有浏览器中实现自定义数据类型的剪贴板写入，主要是由于安全性和兼容性问题。
如何通过execCommand实现自定义数据类型的剪贴板写入？
通过调用document.execCommand('copy')，可以触发一个可信的复制事件，从而实现自定义数据类型的剪贴板写入。
➡️
