JavaScript 读取剪切板内容 - navigator.clipboard 使用指南

使用 JavaScript 读取剪切板内容

在网页开发中，有时需要读取用户的剪切板内容，例如粘贴操作或处理复制文本。使用 JavaScript 的 navigator.clipboard 对象，可以方便地实现此功能。

navigator.clipboard.readText() 方法

readText() 方法用于读取剪切板中的文本内容，并返回一个 Promise 对象。如果读取成功，Promise 将解析为剪切板中的文本字符串；如果出现错误，则会拒绝并返回错误信息。

代码示例

以下代码演示了如何使用 navigator.clipboard.readText() 方法读取剪切板内容：

// 检查浏览器是否支持 navigator.clipboard 对象
if (navigator.clipboard) {
  // 读取剪切板的文本内容
  navigator.clipboard.readText()
    .then(text => {
      console.log('剪切板内容: ', text);
    })
    .catch(err => {
      console.error('读取剪切板内容出错: ', err);
    });
} else {
  console.warn('浏览器不支持 navigator.clipboard 对象');
}

安全注意事项

为了保护用户隐私，浏览器通常会要求用户在网站试图访问剪切板内容之前进行授权。因此，上述代码可能会触发一个权限请求对话框，询问用户是否允许访问剪切板。

总结

使用 navigator.clipboard 对象可以轻松读取剪切板内容，但请务必注意用户隐私和安全问题，并确保在用户明确授权的情况下才进行操作。