问题:禁止文档复制,禁止图片另存为等相关操作
第一css禁止:复制(参考https://blog.csdn.net/qq_32007439/article/details/81145580)
body{//可以通过css选择元素
-webkit-touch-callout:none; /*系统默认菜单被禁用*/
-webkit-user-select:none; /*webkit浏览器*/
-khtml-user-select:none; /*早期浏览器*/
-moz-user-select:none; /*火狐*/
-ms-user-select:none; /*IE10*/
user-select:none;
}
第二:禁止右键js,以及原生方法
var $copycontrol = $(".body");
if ($copycontrol.length > 0 && $copycontrol[0].contentWindow && $copycontrol[0].contentWindow.document && $copycontrol[0].contentWindow.document.body) {
var ifbody = $copycontrol[0].contentWindow.document.body//这里可以优化,采用遍历放手
//原生方式
ifbody.setAttribute("onselectstart", "return false");
ifbody.setAttribute("unselectable", "on");
ifbody.style.cssText = "display: block;-moz-user-select: none;-webkit-user-select: none;-ms-user-select: none;-o-user-select:none;-khtml-user-select: none;user-select: none;";
兼容ios(css,js失效可以尝试)
document.documentElement.style.webkitTouchCallout='none';//禁止长按
document.documentElement.style.webkitUserSelect='none';//禁止选择
//jquer方法
jQuery(ifbody).attr({
leftmargin: 0,
topmargin: 0,
oncontextmenu: 'return false',
ondragstart: 'return false',
onselectstart: "return false",
onselect: "retuen false",
onbeforecopy: 'return false',
});
}
第三:涉及到ifram,禁用右键
parent.getParentWindow(window).document.oncontextmenu=new Function("event.returnValue=false");
parent.getParentWindow(window).document.onselectstart=new Function("event.returnValue=false");
第四:react问题涉及到生命周期,我们可以通过加载css的方式禁止复制,以及渲染中不存在真实dom可以提交加属性在对应节点上。