有些时候,我们可能想要禁止用户修改或者调试我们HTML页面的代码,这个时候需要组织用户打开调试窗口,下面介绍一些能够阻止用户在浏览器中打开调试窗口的方法,这些方法只能一定程度的提高打开调试的门槛,并不能完全杜绝。

禁用F12

对于使用F12打开调试窗口的方法,我们只要注册F12按键的处理方法,并阻止默认事件行为即可:

window.onkeydown = window.onkeyup = window.onkeypress = function (event) {
// 判断是否按下F12,F12键码为123
if (event.keyCode === 123) {
event.preventDefault(); // 阻止默认事件行为
window.event.returnValue = false;
}
}

禁用右键

对于使用右键菜单,在右键菜单里面选择查看源代码的行为,我们只要覆盖右键菜单点击事件的行为就即可:

// 为右键添加自定义事件,可以禁用
window.oncontextmenu = function() {
event.preventDefault(); // 阻止默认事件行为
return false;
}

禁用预先调试

就算是同时禁用掉F12和右键,用户还是可以提前打开调试窗口,然后在地址中输入网址,这样就算不用右键和F12也是打开调试窗口的。

另外用户也可以通过浏览器菜单打开开发者工具来开启调试窗口,还有诸如 shift+ctrl+i 的快捷键打开控制台。

对于这种预先打开调试窗口的方法,我们可以通过比较屏幕 window.outerWidth 和页面可见内容区域 window.innerWidth 的差距判断是否打开控制台。

var threshold = 160; // 打开控制台的宽或高阈值
// 每秒检查一次
setInternet(function() {
if (window.outerWidth - window.innerWidth > threshold ||
window.outerHeight - window.innerHeight > threshold) {
// 如果打开控制台,则刷新页面
window.location.reload();
}
}, 1e3);

这种方法对于像IE8这种,打开调试窗口是在一个新的Windows窗口中,而不是在当前页面的下面或者上面的情况会失效。

原文地址:http://uusama.com/543.html

禁止用户打开HTML页面调试的更多相关文章

  1. 010医疗项目-模块一:用户添加的实现(Dao,Service,Action,增加页面调试,提交页面调试)

    要实现的效果:

  2. 判断手机端用户打开页面时是android还是ios,并将判断结果通过ajax返回给url接口,传递回去

    首先判断页面是android还是ios,然后利用ajax将结果通过接口url返回回去,记录到log日志中,以统计android和ios用户访问该页面的数量(数据统计) <script type= ...

  3. Ajax异步打开新页面弹框被拦截,无法将参数值传递到后台

    一.Form提交,打开新页面被拦截 手动触发Form提交打开新页面是不会被拦截的,但是如果通过Ajax异步处理回调后再程序自动触发Form提交的话,就会被浏览器当成广告弹框拦截 1.暂时的解决办法:如 ...

  4. 纯CSS如何禁止用户复制网页的内容?

    大家好,我是半夏,一个刚刚开始写文的沙雕程序员.如果喜欢我的文章,可以关注 点赞 加我微信:frontendpicker,一起学习交流前端,成为更优秀的工程师-关注公众号:搞前端的半夏,了解更多前端知 ...

  5. 移动端页面调试神器-browser-sync

    最近公司赶一个项目,是mobile端,之前没怎么做过移动端的开发,这个项目算是个小尝试. 在做项目的过程中,用到了一个神器--browser-sync,在这里分享给大家. 1.静态页面调试 作为前端, ...

  6. ASP.net 实现禁止用户重复登录

    本文先为大家介绍如何利用缓存Cache方便地实现此功能. Cache与Session这二个状态对像的其中有一个不同之处,Cache是一个全局对象,作用的范围是整个应用程序,所有用户:而Session是 ...

  7. 解决ios下的微信打开的页面背景音乐无法自动播放

    后面的项目发现,还有两个坑,需要注意下: ·本文的解决方案的核心是利用了 微信/易信 在ready的时候会有个 WeixinJSBridgeReady/YixinJSBridgeReady事件,通过监 ...

  8. A、B同时打开一个页面进行同一条数据库记录进行修改,A修改完成后提交表单,A修改的数据保存完成后;当B也修改完成后,提交数据进行数据修改。此时B修改的内容会覆盖A修改的内容,请问如何避免?

    A.B同时打开一个页面进行数据中的一条数据进行修改,A修改完成后提交表单,数据修改保存完成后B开始页面也修改完成,开始提交进行修改.此时B修改的内容会覆盖A的内容,请问如何避免? 通过搜索和我个人总结 ...

  9. 微信跳转,wap网页跳转微信打开指定页面

    最近一朋友的客户有这么一需求,wap网页跳转微信打开指定页面,让用户去关注公众号.想这么干,通过网页跳转到微信并打开带有二维码的网页,用户长按识别二维码就可以关注了.想法很好,于是去搜索了“微信跳转, ...

随机推荐

  1. sunTime

    哈哈哈  开通了博客,有缘的你看能不能来到这里,或许我们认识呢

  2. 2分钟读懂大数据框架Hadoop和Spark的异同

    转自:https://www.cnblogs.com/reed/p/7730313.html 谈到大数据,相信大家对Hadoop和Apache Spark这两个名字并不陌生.但我们往往对它们的理解只是 ...

  3. 《SpringMVC从入门到放肆》十三、SpringMVC数据校验

    上一章,我们学习了SpringMVC的自定义类型转换器,但是如果转换后的数据传递到Controller的方法中,忽然发现有某些属性为Null了,这怎么办?我们需要一种有效的数据校验机制,来对数据进行有 ...

  4. Qt5+MSVC2015编译器编译发布的Release程序运行崩溃,如何查找崩溃的原因??

    除了加log信息,还有什么方法?? ==================================2019/4/26============================= 1 常见的c++内 ...

  5. 关于如何在Visual Studio上仿真调试安卓的U3D应用

    正巧最近需要开发一个安卓手机上的Unity3D游戏功能,想着既然要开发么,当然需要调试.本来的话一些基础功能是不需要使用仿真模拟器,直接在U3D的开发编辑器上就能调试,不过有一些安卓上才能执行,比如 ...

  6. 约瑟夫环问题 --链表 C语言

    总共有m个人在圆桌上,依次报名,数到第n个数的人退出圆桌,下一个由退出人下一个开始继续报名,循环直到最后一个停止将编号输出 #include <stdio.h>#include <s ...

  7. python语法_模块_os_sys

    os模块:提供对此操作系统进行操作的接口 os.getcwd() 获取python运行的工作目录. os.chdir(r'C:\USERs') 修改当前工作目录. os.curdir 返回当前目录 ( ...

  8. 动态添加echarts

    本次只贴js和jsp代码 jsp只需添加一个div即可, <div class="fLayout-right-box"> <hy:layoutArea width ...

  9. FBOSS: Building Switch Software at Scale

    BOSS: 大规模环境下交换机软件构建 本文为SIGCOMM 2018 论文,由Facebook提供. 本文翻译了论文的关键内容. 摘要: 在网络设备(例如交换机和路由器)上运行的传统软件,通常是由供 ...

  10. FCC(ES6写法) Validate US Telephone Numbers

    如果传入字符串是一个有效的美国电话号码,则返回 true. 思路:用正则,参考网上资料和js高级程序设计(5.4RegExp类型). let telephoneCheck = str => /^ ...