如何做到内容不允许选择复制如果不希望网页内容被随意取用

优采云 发布时间: 2021-04-28 07:03

  如何做到内容不允许选择复制如果不希望网页内容被随意取用

  在日常学习和工作中,每个人都不可避免地需要查找信息。从每个网站中提取文本和图片已经是常规操作。但是有时您可能会发现无法选择某个网站的文本,并且无法通过右键单击来下载图片!然后无法复制文本,如果我真的要提取文本怎么办?

  本文文章将分为两部分为您解释此问题:

  如果您不是网站站长,则可以跳过第一部分以查看解决方案。

  重要声明:本文仅用于鼓励互联网学习和交流,网站十六进制复制可能是由于版权,知识产权,法律法规等采取的限制和措施,请不要使用该方法对本网站的任何非法使用,作者(Camillet)概不承担相关责任。

  

  如何使内容不允许选择复制

  如果您不希望随意使用网络内容,则基本思路可以从两个方向开始:使用哪种技术和禁止哪种行为。

  对于一般的网站,可以采用的技术有:CSS禁止,标签属性禁止和Javascript禁止。也许您的cms系统可以找到实现相似功能的插件,但是原理基本上是以上三种类型。还有两种邪恶的方法:插入具有100%透明度的遮罩层,然后使用iframe进行召回。

  对于常规网站,可以禁止的操作包括:禁用选择(浏览器无法选择文本和其他内容),禁止鼠标右键(无法调用页面上的右键菜单),并且不能使用Ctrl + C(块特定的复制指令输入)。

  因此,结合每种技术的功能限制,可以组合不同的特定操作。具体来说,您可以选择以下方法:

  可以同时使用以上方法。但应注意,任何方法都不是没有后门的,任何额外的代码都会减慢网站的速度,并且内容可以得到适当的保护。

  01使用CSS禁止选择

  通过将none属性添加到访问页面的用户的-select操作中,可以实现用户无权执行选择的效果。您可以将以下CSS代码直接添加到根目录或某个类中以保护内容。

  *{

moz-user-select: -moz-none;

-moz-user-select: none;

-o-user-select:none;

-khtml-user-select:none;

-webkit-user-select:none;

-ms-user-select:none;

user-select:none;

}

  如果只希望某些类型的用户有权选择,则可以单独删除该行。

  02使用CSS创建遮罩层

  所谓的掩膜层可以理解为在内容物上覆盖一层透明塑料薄膜。用户只能触摸塑料薄膜,不能触摸其中的内容物,从而达到保护的效果。

  对于特定用途,可以将遮罩层设置为一个类,以有针对性地保护某个零件。请注意,某些搜索引擎可能会误认为当前的蒙版层会影响用户使用的浮动广告,从而可能会影响SEO的效果。

  .mark{

background:#000!important;

opacity:.01!important; //透明度调整

position:fixed!important;

left:0!important;

top:0!important;

width:100%!important;

height:100%!important;

z-index:998!important; //高度调整,注意应为全站最高

pointer-events: none!important; //禁止操作穿透

}

  03使用标记属性禁止选择和右键单击菜单

  在HTML中,有两个标记属性oncontextmenu和onselectstart,可以将其添加到任何位置。这两种数学控制着右键单击和选择后页面的响应模式。可以通过修改内容来实现在右键菜单上添加其他选项的功能。但是在这里,我们直接将其设置为没有返回内容。以商品标签为例,同时添加禁止右击和禁止选择:

  您还可以添加禁止右键单击/禁止选择的内容。

  对于图片,您还可以选择从meta标签开始。添加以下meta语句以禁用浏览器的图像工具,以达到无法下载页面图像的效果。

  04使用Javascript禁止选择和右键单击菜单

  在讨论此问题之前,让我先谈谈如何添加JS。有两种常见的添加JS的方法:引用JS文件和插入HTML文本。例如,如果您在整个网站上都引用某个JS,则可以选择将以下代码插入该JS文件。如果方便修改HTML或PHP,则可以直接在HTML中编写JS脚本。

  

//禁用右键

document.oncontextmenu=function(){

return false;

}

//禁用选择

document.onselectstart=function(){

return false;

}

//禁用ctrl+c

document.onkeydown=function(){

if((event.ctrlKey) && (window.event.keycode==67)){

event.returnValue=false;

}

};

//禁用右键方法2(直接禁止在改页面上输入右键)

document.onmousedown=function(){

if(event.button==2){

event.returnValue=false;

}

}

  您还可以使用JS来实现复制时添加文本的效果。例如,如果您复制一段文本,则网站的版权声明将出现在文本之后,提醒用户不要误用此文本。

  

function addLink() {

var body_element = document.body;

var selection;

selection = window.getSelection();

if (window.clipboardData) {

// Internet Explorer

var pagelink ="\r\n\r\n 原文出自[卡米雷特的小站(kamilet.cn)],转载请附带原文链接: "+document.location.href+"";

var copytext = selection + pagelink;

window.clipboardData.setData ("Text", copytext);

return false;

} else {

var pagelink = " \r\n 原文出自[卡米雷特的小站(kamilet.cn)],转载请附带原文链接: "+document.location.href+"";

var copytext = selection + pagelink;

var newdiv = document.createElement('div');

newdiv.style.position='absolute';

newdiv.style.left='-99999px';

body_element.appendChild(newdiv);

newdiv.innerHTML = copytext;

selection.selectAllChildren(newdiv);

window.setTimeout(function() {

body_element.removeChild(newdiv);

},0);

}

}

document.oncopy = addLink;

  05使用iframe调用

  此方法的原理非常简单:使用禁止任何脚本的页面作为iframe来调用内容页面,因此无法在首页上使用脚本功能。这包括右键单击,复制,选择等。但是问题是网站的结构会有很大问题,因为所有页面都必须由另一个页面封装,并且外部显示的页面没有太多内容内容,这对于SEO也非常重要。非常不利。但毕竟,这种方法并非无法使用。

0 个评论

要回复文章请先登录注册


官方客服QQ群

微信人工客服

QQ人工客服


线