首页 > 其他分享 >页面禁止复制功能

页面禁止复制功能

时间:2022-10-06 11:33:51浏览次数:80  
标签:禁止 浏览器 样式 复制 select 页面

前端实现禁止复制功能的方法,目前就两大类

  1. 通过js阻止复制功能实现禁止复制。
  2. 通过css样式user-select:none阻止选中实现禁止复制。
    目前一般选择其中一种,比如简书、掘金、知乎等资讯问答类,也有混合使用的,比如起点网这类阅读为主的。

破解禁止复制功能的方法

  1. 禁止当前页面的javascript,毕竟我们对复制拦截就是通过js实现的。
  2. 删除或者覆盖oncopy和onselect属性事件。
  3. 有些网站直接让你无法选中,给文本增加了css样式user-select:none。
  4. 非开发实现:将文章转发到手机,使用手机的长按选择复制文本
  5. 仍旧是非开发实现:截图,哈哈哈,皮一下就很开心。
  6. 最牛皮的方法:手敲,解决一切妖魔鬼怪。

防复制技术升级

        虽然是升级,但说到底也就是稍微恶心下人,经过测试发现,防复制网站一般是文章,文章一般是多段内容,那么在每一个内容元素 上加内联样式:user-select: none !important,那么想要手工复制的人就需要将每一个内容的内联样式都删除或去掉,因为是 用内联样式写的,所以无法通过通用样式进行覆盖,手工操作起来比较繁琐,而且目前常用的浏览器脚本还未对于此项防复制技术升级。不过解禁复制也就是遍历下元素进行样式删除更改, 但是由于元素量比较大,就会导致访问页面会比较卡顿,由于浏览器插件会一直开启,除非手动关闭,那么就存在性能消耗,如果 插件升级了此项功能,就会导致浏览器性能降低,长期使用或者当用户大量打开浏览器的情况下,卡顿就会明显,从而影响用户体验, 至于用户到底怎么选择,还是取决于用户自己。

作者:前端架构师陈龙威
链接:https://www.jianshu.com/p/f22cb7c4c82f
来源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

标签:禁止,浏览器,样式,复制,select,页面
From: https://www.cnblogs.com/little-monster-lhq/p/16757271.html

相关文章