使用Clipboard API前是否需查询权限？浏览器差异及演进解析

Async Clipboard API存在一些安全限制，不同浏览器的要求有所区别：

Chromium系浏览器：

• 读取剪贴板操作需要获取clipboard-read权限（通过Permissions API管理）
• 写入剪贴板操作需要clipboard-write权限，或处于临时激活状态（比如由用户交互触发）

Firefox 和 Safari：

• 暂不支持clipboard-read和clipboard-write权限，且暂无支持计划

针对所有支持该API的浏览器，到底需要先查询权限再调用接口，还是可以直接使用Clipboard API？过去的要求是否不同？未来会有变化吗？

我原本认为正确的流程是先查询权限（至少在Chromium系浏览器中），获得权限后再调用API，示例代码如下：

navigator.permissions.query({ name: "clipboard-read" }).then((result) => {
  if (result.state === "granted") {
    navigator.clipboard.readText().then((text) => console.log(text));
  }
});

但实际测试发现，直接调用Clipboard API而不提前查询权限，在支持的浏览器中仍能正常运行。Chromium系浏览器会在首次调用时自动弹出权限请求弹窗：

直接调用的示例代码：

navigator.clipboard.readText().then((text) => console.log(text));

完整可测试示例：

<html>
<body>
    <input id="b1" type="button" value="click" />
</body>
<script>
    document.querySelector("#b1").addEventListener('click', (e) => {
        navigator.clipboard.readText().then(
            (clipText) => console.log(clipText));
    });
</script>
</html>

内容的提问来源于stack exchange，提问作者Eisenfrost