JS禁止查看网页源代码的简单实现方法

简介: JS禁止查看网页源代码的简单实现方法

在项目开发中有时会遇到不想让别人轻易查看到网页的源代码信息,有多种方法可以轻保护自己的网站源码。最常见查看网站源码的无非有这四种:

  • F12
  • 鼠标右键单击
  • Ctrl+Shift+I
  • Ctrl+U

以上的四种方法都可以查看到网站的源代码,可以通过使用JavaScript来屏蔽掉这四种状态从而实现禁止查看源代码效果。下面直接放源码。

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
      <title>JS禁止查看网页源代码的简单实现方法</title>
  </head>
  <body>
    <script type="text/javascript">
      window.onload = function(){
        //屏蔽键盘事件
        document.onkeydown = function () {
          var e = window.event || arguments[0];
          //F12
          if (e.keyCode == 123) {
            return false;
            //Ctrl+Shift+I
          } else if ((e.ctrlKey) && (e.shiftKey) && (e.keyCode == 73)) {
            return false;
            //Shift+F10
          } else if ((e.shiftKey) && (e.keyCode == 121)) {
            return false;
            //Ctrl+U
          } else if ((e.ctrlKey) && (e.keyCode == 85)) {
            return false;
          }
        };
      //屏蔽鼠标右键
      document.oncontextmenu = function () {
              return false;
      }
      }
    </script>
  </body>
</html>

真正能实现源代码屏蔽的单纯的.html是不可能的!想看源代码也是没办法阻止的。此脚本这只能防止不劳而获的小白,针对计算机老鸟、大神是无法作用的;并且现在很多浏览器自带有查看网页源代码的功能。用TELEPROT这类网站下载工具可以下载任何文件,相当于做镜像网站。想真正的保护源代码,除非服务器进行安全设置、加密。

目录
相关文章
|
4天前
|
前端开发 JavaScript UED
深入理解 JavaScript 同步和异步,让网页灵动起来!
深入理解 JavaScript 同步和异步,让网页灵动起来!
|
2天前
|
前端开发 JavaScript 开发者
JavaScript中的异步编程方法总结
在JavaScript开发中,处理异步操作是非常常见的情况。本文将总结JavaScript中常用的异步编程方法,包括Callback、Promise、Async/Await等,分析其优缺点,并提供使用建议。
|
3天前
|
缓存 前端开发 JavaScript
React和Next.js开发常见的HTTP请求方法
React和Next.js开发常见的HTTP请求方法
7 0
|
3天前
|
前端开发 JavaScript
前端 JS 经典:Math 常用方法汇总
前端 JS 经典:Math 常用方法汇总
6 0
|
3天前
|
前端开发 JavaScript
前端 js 经典:Object 常用原生方法
前端 js 经典:Object 常用原生方法
10 2
|
3天前
|
前端开发 JavaScript
前端 js 经典:array 原生方法
前端 js 经典:array 原生方法
10 1
|
4天前
|
JavaScript 前端开发
JS中正则方法的使用 - 蓝易云
以上就是JavaScript中正则方法的基本使用。这些方法可以用于执行复杂的字符串处理和验证任务。
23 1
|
4天前
|
前端开发 JavaScript UED
CSS顶部与JS后写:网页渲染的奥秘
CSS顶部与JS后写:网页渲染的奥秘
|
4天前
|
JavaScript 前端开发
JavaScript的`apply`方法:函数的“应用”与“调用”
JavaScript的`apply`方法:函数的“应用”与“调用”
|
4天前
|
JavaScript 前端开发
JavaScript的`bind`方法:函数的“复制”与“定制”
JavaScript的`bind`方法:函数的“复制”与“定制”