如何防止用户使用浏览器隐藏元素攻击网页水印？-html教程-PHP中文网

如何防止用户使用浏览器隐藏元素攻击网页水印？

DDD

发布： 2024-11-11 12:30:16

原创

991人浏览过

如何防止用户使用浏览器隐藏元素攻击网页水印？

如何防范用户使用浏览器隐藏元素攻击网页水印

在创建网页水印系统时，防止用户使用浏览器工具篡改水印至关重要。其中一个潜在的攻击向量是浏览器提供的隐藏元素选项。

禁止浏览器隐藏元素

该选项无法完全禁止，但可以使用以下技术进行阻止：

1. 禁用调试工具

禁用右键查看源码和 F12（键盘事件）。
禁用右键菜单、选择和复制。

代码示例：

// 禁止 F12 键盘事件
document.addEventListener('keydown', function(event) {
  return 123 != event.keyCode || (event.returnValue = false);
});

登录后复制

// 禁用右键、选择、复制
document.addEventListener('contextmenu', function(event) {
  return event.returnValue = false;
});

登录后复制

2. 监控浏览器尺寸更改

利用浏览器可视区域宽高和整体宽高之间的差异，可以检测隐藏控制台的浏览器尺寸变化。

AppMall应用商店

AI应用商店，提供即时交付、按需付费的人工智能应用服务

查看详情

代码示例：

function resize() {
  var threshold = 200;
  var widthThreshold = window.outerWidth - window.innerWidth > threshold;
  var heightThreshold = window.outerHeight - window.innerHeight > threshold;
  if (widthThreshold || heightThreshold) {
    console.log('控制台打开了');
  }
}

window.addEventListener('resize', resize);
resize();

登录后复制

3. 利用调试器特性

使用调试器特性创建无限递归，阻止代码执行并降低网页性能。

代码示例：

function check() {
  function doCheck(a) {
    (function() {
      {}["constructor"]("debugger");
    })(); //debugger
    doCheck(++a);
  }

  try {
    doCheck(0);
  } catch (err) {
    console.log(err);
  }
}

登录后复制

其他建议