Javascript 将navigator.clipboard与异步请求结合使用

我想使用

navigator.clipboard.writeText

将链接复制到剪贴板。但是，此链接必须由服务器生成，这就是为什么复制之前会有一个获取

示例代码：

<button onclick="onClick()">Copy</button>

<script>

    function onClick() {
        fetchLink()
            .then(function (link) {
                navigator.clipboard.writeText(link);
                alert('Copy ok');
            })
            .catch(function (err) {
                alert('Error: ' + err.message);
            })
    }
</script>

复制
函数onClick（）{
fetchLink（）
.then（功能（链接）{
navigator.clipboard.writeText（链接）；
警报（“复制正常”）；
})
.catch（函数（err）{
警报（“错误：”+错误消息）；
})
}

因此，复制目前似乎不起作用，特别是在iOS下，因为用户在事件处理程序中不会直接调用该函数

我怎样才能解决这个问题

---

非常感谢

虽然不是跨浏览器解决方案，但您可以使用权限API请求对剪贴板的访问，而无需用户手势来启动它。大概是这样的：

const queryOpts = { name: 'clipboard-write', allowWithoutGesture: false };
const permissionStatus = await navigator.permissions.query(queryOpts);

正如我所说，这种方法的缺点是，它不是跨浏览器的（请阅读：Safari不支持这种方式）。此外，它会弹出一个用户可能不接受的权限通知

---

如果这对你不起作用，我认为没有办法解决这个问题。我建议，根据您的用户界面，您可能希望将其更改为一个显示“生成链接”的按钮，然后在

fetch

之后，它将显示带有复制按钮的链接，但这超出了这个问题的范围。

是不是应该要求

剪贴板写入
？他们希望将URL放入剪贴板，而不是从中读取。在剪贴板上写入的可能解决方案。