zoukankan      html  css  js  c++  java
  • js实现防盗图

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
       <style>
        img {
          -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select:none;
          user-select:none;
    pointer-events:none;
        }
    </style>
    </head>
    <body>
       <div>test</div>
       <img id="DialogNoBtn" src="https://cdn.shopify.com/s/files/1/1811/7921/t/4/assets/us.jpg">
    </body>
    <script src="jquery-3.2.1.js"></script>
    <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
            $("body").append("<div id='picDisableWrap' style='position:fixed;100%;height:1500px;background:rgba(0,0,0,.8);top:0;left:0;display:none;'></div>");
            //  全屏禁用右键
            $(document).bind("contextmenu",function(e){ return false; });
        })
    //  防止截屏
        $(window).on('blur','#picDisableWrap',function(){})
        window.onblur = function () { $("#picDisableWrap").show(); }
        window.onfocus = function (){ $("#picDisableWrap").hide(); }
        document.onkeydown = function(){
            //  禁用F12
            if(window.event && window.event.keyCode == 123) { event.keyCode=0; event.returnValue=false; }
            //  禁用Ctrl + Alt + A
            if((event.ctrlKey && event.altKey)||(event.ctrlKey && event.altKey && window.event.keyCode == 65)){ $("#picDisableWrap").show(); }
        }
        //图片右键弹出提示框
        $("img").contextmenu(function(){ alert("Contact us to use our photos"); })
    </script>
    </html>

    以上,通过客户端脚步实现基本的防盗图功能。

    【技术栈】

        1. 禁用网页端F12调试模式。通过判断keycode。

               2. 禁用网页端鼠标右键。通过判断keycode。

               3. 防止截屏。监听鼠标focus/blur事件。

               4. 网页图片元素禁止用户选择。css实现。

               5. 防止chrome浏览器拖拽下载图片。(待更新。。。)

               补充说明:以上只能达到最基本的功能实现,对于前端程序猿来说,要破解也很简单,防盗图本身也只能防止作为大多数的小白。以上,欢迎补充。

  • 相关阅读:
    【NOIp复习】欧拉函数
    【vijos】【神读入】Knights
    【vijos】【位运算】Miku_Nobody
    【vijos】【二分图带权匹配】拯救世界-星际大战
    【模板】KM算法模板(带注释)——二分图带权最大匹配
    【vijos】【二分图最大匹配】银翼の舞
    【vijos】【树形dp】佳佳的魔法药水
    QuartusII 13.0的完美破解
    CANVAS实现调色板 之 我的第一个随笔
    Couldn't read row 0, col -1 from CursorWindow
  • 原文地址:https://www.cnblogs.com/hcxy/p/6771257.html
Copyright © 2011-2022 走看看