当前位置：首页 > JavaScript

原生js实现禁止截屏

2026-03-01 22:30:09JavaScript

在原生JavaScript中实现完全禁止截屏存在技术限制，因为浏览器安全策略不允许网页直接控制操作系统级别的功能（如截屏）。但可以通过以下方法增加截屏难度或干扰截屏结果：

禁用右键和快捷键

通过阻止默认行为和禁用常见截屏快捷键（如PrtSc、Win+Shift+S）降低用户手动截屏的可能性：

document.addEventListener('keydown', function(e) {
  if (e.key === 'PrintScreen' || 
      (e.ctrlKey && e.key === 'p') || 
      (e.metaKey && e.shiftKey && e.key === '4')) {
    e.preventDefault();
    alert('截屏功能已禁用');
  }
});

document.addEventListener('contextmenu', e => e.preventDefault());

动态内容干扰

通过定时修改DOM或添加水印，使截屏内容难以使用：

// 周期性闪烁敏感内容
setInterval(() => {
  const sensitiveElements = document.querySelectorAll('.sensitive');
  sensitiveElements.forEach(el => el.style.visibility = 
    el.style.visibility === 'hidden' ? 'visible' : 'hidden');
}, 500);

// 全屏覆盖水印
const watermark = document.createElement('div');
watermark.style.position = 'fixed';
watermark.style.top = '0';
watermark.style.left = '0';
watermark.style.width = '100%';
watermark.style.height = '100%';
watermark.style.background = 'url("data:image/svg+xml;utf8,<svg...>") repeat';
watermark.style.pointerEvents = 'none';
document.body.appendChild(watermark);

检测DevTools打开

当检测到开发者工具打开时清除敏感内容（部分浏览器适用）：

原生js实现禁止截屏

setInterval(function() {
  const devtools = /./;
  devtools.toString = function() {
    document.body.innerHTML = '<h1>禁止调试</h1>';
    return '';
  };
  console.log(devtools);
}, 1000);