chrome调试键盘事件&使页面不可复制的方法

遇到一个网站,想要对其内容进行复制,发现复制不了。

在网上找了一圈:如何在页面中禁用复制。发现是用 js 来对按键进行监听,如果发现用户按下了Ctrl + c则阻止掉该事件,于是用户就不能复制了。

后来发现一个更简单的方法,就是在你不希望用户复制的地方,比如说某个 div 标签上,加入oncopy="return false"oncut="return false"这两个属性,在该 div 中的内容就不能被复制了。

我之前是不知道这两个属性可以阻止用户复制的,那我是怎么找到的呢?

因为这个网站里面的 js 是经过压缩的,我也不方便找到对应的代码来打断点调试,也不知道怎么调试键盘事件,后来还是在 Chrome devolopers 这个网站上找到了灵感:https://developers.google.com/web/tools/chrome-devtools/javascript/?hl=zh-cn

打开 Chrome 控制台,进入 Sources 选项,面板上有 Event Listener Breakpoints 这个选项卡,里面是一些事件监听的选项。

在我这个需求里,我只需要找到复制这个操作,于是我找到了 Clipboard 这个选项下面的 copy ,给它打上勾。

回到页面上按Ctrl + c,它就打断点标记到触发该事件的地方,我发现在这个 div 里面,有oncopy="return false"oncut="return false"这两个属性,我改成return true,于是就可以愉快地复制了。

同时也学到了一个如何阻止用户复制页面内容的简单的方法。

你学到了吗?

你可能感兴趣的:(chrome调试键盘事件&使页面不可复制的方法)