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 的答案中链接的帖子上的回答，为了方便起见，在此处转载......

（移动）Safari 中此 API 存在安全限制，其中之一是它必须在使用

https

保护的网站上执行，因此不适用于

localhost

，例如：

• API 仅限于安全上下文，这意味着

  navigator.clipboard

  不存在于

  http://

  网站。
• 写入剪贴板的请求必须在用户手势期间触发。在用户手势范围之外调用

  clipboard.write

  或

  clipboard.writeText

  （例如

  "click"

  或

  "touch"

  事件处理程序）将导致 API 调用返回的 Promise 被立即拒绝。 […]

Answer 2

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

用途：

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

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

Answer 3

对我来说，问题是我没有在“安全上下文”（HTTPS）中运行网络应用程序。在控制台中尝试

window.isSecureContext

。