在浏览器中的粘贴事件之外从剪贴板读取文件

Question

我想知道用户剪贴板数据上是否有文件。

当我像这里这样捕获粘贴事件时，这是可能的：

document.addEventListener('paste', (event) => {
  const data = event.clipboardData;
  const file = data && data.files && data.files[0];
  if (file) {
      // do something with the file.
  }
  
});

然而，这需要用户将其粘贴到页面。我想在他们不做任何操作的情况下实现它，类似于从剪贴板捕获文本：

setInterval(()=>{
    const text = await navigator.clipboard.readText();
    if (text){
       // do something....
    }
},1000)

我可以随时运行此代码，并“查明”用户的剪贴板上是否有任何文本。

问题是我无法访问那样的文件。如果剪贴板上有文件，我得到一个空字符串。

我知道这可能是一个安全问题，但至少我想知道他们的剪贴板上是否有任何文件（而不是文本）

Answer 1

使用 clipboard.read 方法代替 readText。适用于任何类型的数据。

https://developer.mozilla.org/en-US/docs/Web/API/Clipboard/read

在浏览器中的粘贴事件之外从剪贴板读取文件

Read file from clipboard outside the paste event in a browser

javascript

browser

safari

firefox

google-chrome