你如何用js检测屏幕截图 [英] How do you detect a screen shot with js

问题描述

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

Not sure how they do it but hulu has found a way to detect if a screenshot is taken or if the screen-record is on, and sets the video background to black. I'm on for mac os. It is all front end that I can tell, but how do they do it?

推荐答案

可能与 如何检测屏幕截图"使用 Javascript

然而，来自该来源的答案指出目前，无法通过 JavaScript 处理屏幕截图事件.手机的屏幕截图功能与浏览器没有任何联系."

However from this source, an answer states "Currently, there is no way to handle a screenshot event through JavaScript. The screenshot functionality of phones simply has no connection to the browser."

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

As for a PC device, you can capture all possible keyboard comibinations to trigger a screenshot. For example, most windows computers use WIN + prt scr, Mac uses Shift + Command + 3

最后，还有很多其他的可能性可以尝试"防止屏幕截图，但是，您可能会冒着可能触发某些浏览器或特定操作的错误结果的风险.

Aftermost, there are many other possibilities to "attempt" a prevention of screenshots, however, you are risking false results in which some browsers or specific actions could trigger.

使用剪贴板检测屏幕截图:

Detecting a screenshot using the clipboard:

使用 JavaScript 的本机剪贴板 API，您可以从剪贴板中获取上次复制的项目，就像看起来那样.唯一可能的问题是，它提示用户请求访问剪贴板数据的权限.

Using JavaScript's native Clipboard API, you can get the last copied item from the clipboard as what is seems to state. Only possible issue is, it prompts the user asking permission to access clipboard data.

navigator.clipboard.readText 可以读取之前复制的内容.这是我发现的一种简单的检测方法.参考:

navigator.clipboard.readText can read the previously copied content. Here is a simple way I found to detect this. Reference:

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);
  });

这篇关于你如何用js检测屏幕截图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！