navigator.clipboard.writeText() 不适用于特定的 IOS 设备

Question

我目前正在使用navigator.clipboard.writeText()将元素中的值复制到剪贴板，但是，它似乎适用于除Safari 中的 iPhone X 和 iPhone 6 Plus 之外的所有设备。

浏览器是最新的，根据 MDN，它们应该可以与这些版本的 safari 配合使用。该代码似乎适用于桌面、Android 和其他 IOS 设备（例如 iPhone 12）。

在 iPhone X 和 6 Plus 上，它会在控制台中的这两个设备上引发 Promise 错误，并且不会复制到剪贴板：

Unhandled Promise Rejection: TypeError: undefined is not an object (evaluating 'navigator.clipboard.writeText')

完全错误

有没有人经历过类似的事情并看到/提出了解决方案？谢谢！

代码片段：

   const coupon = couponSelector.value;
    if (notMissing(coupon) && coupon !== '') {
      navigator.clipboard
        .writeText(coupon)
        .then(() =>
          LOGGER.debug({}, `${LOGGER_PREFIX}: Promise Successful.Copied coupon: ${coupon}`),
        )
        .catch((e) => LOGGER.error({ e }, `${LOGGER_PREFIX}: Promise Failed:`));
    }

Answer 1

请参阅我在 Damian Demasi 的回答中链接的帖子中的回答，为方便起见，在此处转载\xe2\x80\xa6

\n

（移动）Safari 中此 API存在安全限制，其中之一是它必须在使用 保护的网站上执行https，因此无法在 Safari 上运行localhost，例如：

\n

\n

\n
• 该 API 仅限于安全上下文，这意味着网站navigator.clipboard不存在该 API http://。
\n
• 写入剪贴板的请求必须在用户手势期间触发。对用户手势（例如事件处理程序）clipboard.write或clipboard.writeText用户手势范围之外的调用将导致立即拒绝 API 调用返回的承诺。\n[\xe2\x80\xa6]"click""touch"
\n

\n

\n

Answer 2

我有同样的问题。尝试了不同的可能解决方案，但没有成功。我最终使用了这个包：copy-to-clipboard。

用法：

import copy from 'copy-to-clipboard';
 
copy('Text');

这里有一个类似的问题，我是从那里了解到这个包的。