Javascript 跨浏览器的自定义剪贴板数据类型

我们试图允许用户在两个系统之间复制粘贴数据。从网页到电子应用程序

用户将单击一个按钮，在此按钮上，我们将在的帮助下触发复制事件

在Electron应用程序中，我们收听粘贴事件：

onPaste = (evt) => {
    if(evt.clipboardData.getData("mumbo/jumbo")) {
        // Handle custom data-type
    } else if(evt.clipboardData.getData("text/html")) {
        // Handle html
    } else {
        // Handle plain text
    }
}

当用户在Chrome中使用我们的网页时，一切正常。我们可以读取自定义数据类型的数据。但是，当用户访问Firefox

evt.clipboardData.getData（“mumbo/jumbo”）

中的网页时，将返回未定义。我们为

text/plain

和

text/html

设置的数据仍然可用

如果我们将数据粘贴回Firefox

evt.clipboardData.getData（“mumbo/jumbo”）

将正确返回我们设置的数据

我已经试着找到关于这是否有效的信息，但什么也找不到。浏览器之间是否支持自定义剪贴板数据类型，而我做错了什么？还是说它永远不会起作用

---

对

application/json

数据类型执行同样的操作在Firefox和Electron之间也不起作用。我们能够使用的唯一数据类型是

text/plain

和

text/html

，但这两种数据类型都已用于其他目的。

最后，我检查了中列出的所有数据类型。此时，在Firefox和Chrome之间进行复制粘贴时，我只能使用

text/plain

和

text/html

我最终使用

text/html

传递数据：

const copyHandler = (evt) => {
    evt.preventDefault();

    evt.clipboardData.setData("text/plain", url);
    evt.clipboardData.setData("text/html", `<div id="${btoa("mumbo/jumbo")}" data-foo="${bar}"></div>`);
}

constcopyHandler=（evt）=>{
evt.preventDefault（）；
设置数据（“文本/普通”，url）；
setData（“text/html”，``）；
}

---

我使用

btoa（）

对ID进行Base64编码，以尽量减少与常规HTML粘贴的冲突。

firefox似乎有一个复制粘贴交互的非常基本的实现，我建议如果需要跨浏览器/平台识别，可以在粘贴中包含xml标识符。

const copyHandler = (evt) => {
    evt.preventDefault();

    evt.clipboardData.setData("text/plain", url);
    evt.clipboardData.setData("text/html", `<div id="${btoa("mumbo/jumbo")}" data-foo="${bar}"></div>`);
}