四行js代码让别人无法复制你的网站文字

2022-03-22 09:06:46

我们常常会看到百度文库和一些王网站无法复制文字,这究竟是怎样做到的呢。


1.普通版-无法复制文字

对于普通人来说他们复制网页内容无非就是选中一段文字,然后鼠标右键打开菜单进行鼠标点击复制,所以我们针对这种方法的措施就是禁用鼠标右键菜单。


 // 1.禁用右键菜单
        document.addEventListener('contextmenu',function(e){
            e.preventDefault();  // 阻止默认事件
        });


上面步骤完成之后,我们再来考虑另为一种情况,有些键盘党可能会直接选中文字然后进行CRL + C 复制,这时我们只禁用鼠标右键菜单就不行了,因此我们还需要禁止鼠标选中。


// 2.禁止鼠标选中
        document.addEventListener('selectstart',function(e){
            e.preventDefault();  
        });

这样就鼠标右击不会出现属性框,并且crl+c也被禁用就无法复制内容了。


2.升级版-禁用 f12

上面的四行代码拦住了普通人,但对我们的程序员无所不能的程序员是没有作用的,他们可以打开F12在源码中复制,因此还需要在上述基础上再加四行代码,这四行代码负责禁用F12。


// 3.禁止键盘F12键
        document.addEventListener('keydown',function(e){
            if(e.key == 'F12'){
                e.preventDefault(); // 如果按下键F12,阻止事件
            }
        });

这样就连f12开发者工具就打不开了。