如何用js检测屏幕截图

Question

不知道他们是如何做到的，但 hulu 找到了一种方法来检测是否截取屏幕截图或是否打开屏幕录制，并将视频背景设置为黑色。我的是mac os。我能说的都是前端，但是他们是怎么做到的呢？

Answer 1

可能重复如何使用 Javascript 检测“屏幕截图”

然而，从这个来源来看，一个答案指出“目前，没有办法通过 JavaScript 处理屏幕截图事件。手机的屏幕截图功能根本没有与浏览器的连接。”

对于PC设备，您可以捕获所有可能的键盘组合来触发屏幕截图。例如，大多数 Windows 计算机使用WIN + prt scr，Mac 使用Shift + Command + 3

最后，还有许多其他可能性来“尝试”阻止屏幕截图，但是，您面临着某些浏览器或特定操作可能触发的错误结果的风险。

编辑：使用剪贴板检测屏幕截图：

使用 JavaScript 的本机剪贴板 API，您可以从剪贴板获取最后复制的项目，正如所显示的那样。唯一可能的问题是，它提示用户请求访问剪贴板数据的权限。

navigator.clipboard.readText可以读取之前复制的内容。这是我发现的检测此问题的简单方法。参考：

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

navigator.clipboard.readText()
  .then(text => {
    console.log('Pasted content: ', text);
  })
  .catch(err => {
    console.error('Failed to read clipboard contents: ', err);
  });