navigator.clipboard 读取剪贴板和写入剪贴板

系列文章目录

---

---

前言

背景：一起工作的小伙伴，遇到的需求问题。想要在页面进入的时候对请求过来的内容进行自动的复制。

这个功能听起来是一个如此easy的一个功能，其实这里面存在一个大坑。那就是网络请求的时长居然长达6s-8s，这期间尝试了很多种方法都是陆陆续续的不太好实现。相信你们看到这篇文章的时候一定也知道,老的Api被废弃⚠️的消息。简直是一个晴天霹雳！！！！！！，经过一天半的不懈努力，最终还是找到了一种可替代的解决方案（必须在https下才生效）,接下来让我们一起去看看新Api。

---

一、介绍下navigator.clipboard（新Api）

navigator.clipboard 是一个现代的Web API，它提供了对剪贴板（Clipboard）的访问和控制。这个API允许网页开发者异步地读取剪贴板的内容，将文本或其他数据写入剪贴板，以及在需要的时候粘贴剪贴板中的数据。它为处理剪贴板操作提供了一种更安全和可控的方式，同时尊重用户的隐私(这句话很重要，看下面第三点)。

二、使用方法如下（获取和读取）

1.读取剪贴板内容

API名称如下（promise类型）：

navigator.clipboard.readText()

使用方法如下：

navigator.clipboard.readText()
  .then(text => {
   
    console.log('剪贴板内容：', text)