navigator.clipboard.readText() 在 Firefox 中不起作用

Question

我有这个粘贴代码：

navigator.clipboard.readText().then(
  clipText => document.querySelector("#Note").innerText += clipText);

但是它有这个错误：

未捕获类型错误：navigator.clipboard.readText 不是函数

帮我解决这个bug

Answer 1

我猜你正在 Firefox 中测试它，在这种情况下：

Firefox 仅支持在浏览器扩展中读取剪贴板，使用“clipboardRead”扩展权限。

https://developer.mozilla.org/en-US/docs/Web/API/Clipboard/readText#browser_compatibility

Answer 2

在 Firefox（版本 94，2021 年 11 月）上读取剪贴板似乎不起作用并引发错误：

var promise = navigator.clipboard.readText();

// Uncaught TypeError: navigator.clipboard.readText is not a function

MDN Web Docs 上的文档建议通过 Permission API 授予权限：

必须授予 Permissions API 的“剪贴板读取”权限 然后才能从剪贴板读取数据。

但是

clipboard-read

似乎不支持：

navigator.permissions.query({ name: "clipboard-read" });

// Uncaught TypeError: 'clipboard-read' is not a valid value for enumeration PermissionName.

启用剪贴板读取（和写入）的唯一方法是在 Firefox 客户端上启用

dom.events.testing.asyncClipboard

：

1. 在导航栏中输入

   about:config

2. 单击“接受风险并继续”
3. 搜索

   dom.events.testing.asyncClipboard

   并设置

   true

Answer 3

尽管 Firefox 不支持

navigator.clipboard.readText()

，但我还是不得不指出，您可以使用 Firefox 使用不同的方法将某些内容复制到剪贴板，而无需明确启用它：

const copy = document.getElementById('copy');
const copy2 = document.getElementById('copy2');
const copyIt = document.getElementById('copyIt');

const copyToClipboard = (str) => {
  if (navigator 
      && navigator.clipboard 
      && navigator.clipboard.writeText)
    return navigator.clipboard.writeText(str);
    return Promise.reject("The Clipboard API is not available.");
};

copyIt.addEventListener('click', function() {
  copyToClipboard(copy.value);
  copy2.focus();
  copyIt.innerText = "Now right-click & paste into textarea above.";
});

  <textarea name="copy" id="copy" cols="30" rows="10" style="width:90vw;height:25px;">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ad quos, quae a dicta. Quibusdam autem debitis beatae laboriosam nemo illo aliquid. Itaque, doloremque, dicta. Culpa officiis illo cum quisquam rem.</textarea>
<textarea name="copy2" id="copy2" cols="30" rows="10" style="width:90vw;height:25px;"></textarea>
<br><button id="copyIt">Copy It</button>

我只是想让任何与 OP 一样使用 Firefox 遇到同样问题的人都知道，它是可能做到的......