javascript - JS : How I can detect if HTML was successfully copied to the clipboard?

Question

这个用于复制纯文本的示例代码似乎适用于大多数浏览器......

navigator.clipboard.writeText(text).then(() => {
    console.log("Copied.");
}).catch(err => {
    console.log("Error.");
});

…而将 HTML 复制到剪贴板的示例代码不适用于 Mobile Chrome，也不会返回错误…

navigator.permissions.query({name: "clipboard-write"}).then((result) => {
    if (result.state === "granted" || result.state === "prompt") {
        const blobInput = new Blob([exportContent], {type: "text/html"});
        const clipboardItemInput = new ClipboardItem({"text/html" : blobInput});                        

        navigator.clipboard.write([clipboardItemInput]).then(() => {
            console.log("Copied");
        }).catch(err => {
            console.log("Error.");
        });
    }
    else {
        console.log("Permission denied.");
    }   
});

是否有另一种方法来构建第二个示例以在 Android 中运行？如果不是，如果 navigator.clipboard.write 在 Mobile Chrome 中不返回错误，我如何检测失败？

---

更新:胜于无的解决方法

鉴于我不希望在没有 Google 解决这个问题的情况下解决这个问题，我至少想:(1) 找到一种方法，不让用户因为剪贴板为空而责备我的网站/应用程序； (2) 不要在编写特殊情况代码的同时尝试检测有问题的设备； (3) 确保如果 Google 有时间解决问题，该流程会立即开始工作。所以……

因为我可以成功地将纯文本写入键盘，所以我现在将代码分为两部分:

1. 我首先写了一条纯文本消息，例如“[应用程序名称] 已将 HTML 发送到剪贴板。如果这是粘贴的内容，则意味着您的设备是……[以及建议的替代方法，将内容附加到文件中代替粘贴]。”
2. 然后我尝试将 HTML 写入剪贴板。

编写 HTML 作品时，用户在粘贴时看不到第 1 部分中的消息。当它不起作用时，用户会看到该消息，并且至少对问题和备选方案了解更多。

---

最终更新

我开始相信 HTML 位于剪贴板上，但无法始终访问。这解释了没有错误被抛出的原因。如果我可以让 Android 中的 Gmail 显示上下文菜单(它只有 20% 的时间显示)，我就可以成功粘贴 HTML。 GBoard 从不显示 HTML 内容，但始终显示纯文本。

我可以接受上述解决方法。对于第一次遇到问题的用户来说，这只是一个小麻烦，但在他们意识到自己的设备有问题后，他们就会开始使用替代方案(这实际上有一些好处)。

Answer 1

我遇到了这个问题，我努力解决它，直到我发现一些移动浏览器不支持它。因此，您的第一个简单代码是最好的解决方案，但我建议您不要显示错误，而是显示提示，告诉用户复制给定的文本，以防浏览器无法执行或不支持。

function copyText() {

    navigator.clipboard.writeText(text).then(() => {
      alert("text is copied to clipboard");
    }, () => {
      window.prompt("Please copy this text", text);
    });
  }

编辑:关于您的评论，您可以将提示 block 放在 try and catch 中:

function copyText() {

    navigator.clipboard.writeText(text).then(() => {
      alert("text is copied to clipboard");
    }, () => {

      try {

        window.prompt("Please copy this text", text);

      } catch (error) {
        
        alert("Your browser doesn't support this function");
      }
      
    });
  }