Chrome插件开发

今天在看http://www.yu1u.org/3419.html这里的网页的时候发现,这里的文字图片不能直接复制,鼠标右键没有反应,经简单查看,可以发现限制这些功能的代码大致如下:

document.body.οncοntextmenu=function(){return false;};
document.body.οndragstart=function(){return false;};
document.body.onselectstart=function(){return false;};
document.body.onbeforecopy=function(){return false;};
document.body.οnselect=function(){document.selection.empty();};
document.body.οncοpy=function(){document.selection.empty();};

事实上,很多网站防止拷贝的方法之一就是类似的方法,306doc图书馆的文章也是如此:


其关键性的代码为:

        document.body.oncopy = function() {
            var CurUserNameCookiescgcg = getCookie("LoginName");
            if (CurUserNameCookiescgcg == "" || CurUserNameCookiescgcg == null) {
                var docarttitle = document.getElementById("docarttitle");
                var docencodetitle = "";
                if (docarttitle == null) {
                    docencodetitle = ""
                } else {
                    docencodetitle = "&titleencode=" + docarttitle.value
                }
                $.ajax({
                    url: "http://www.360doc.com/ajax/GetLoginForm20130912.ashx?ArtID=" + ArticleID + "&type=2&arttype=" + CurArtType + docencodetitle,
                    cache: false,
                    success: function(result) {
                        $("#LayerLogin").html(result);
                        showBg("dialog", "dialog_content", "1")
                    },
                    error: onFailed
                });
                return false
            } else {
                var selhtml = "";
                var selection;
                if (window.getSelection) {
                    selection = window.getSelection();
                    if (selection != null) {
                        selhtml = selection.toString()
                    }
                } else if (document.selection) {
                    selection = document.selection.createRange();
                    if (selection != null) {
                        selhtml = selection.text
                    }
                }
                if (selhtml.length > 200) {
                    document.getElementById('fuzhitishidiv').style.display = 'none';
                    if (getCookie("360doc1") != null && UserID != 0) {
                        $.ajax({
                            url: "http://www.360doc.com/ajax/GetLoginForm20130912.ashx?ArtID=" + ArticleID + "&type=5&arttype=" + CurArtType + "",
                            cache: false,
                            success: function(result) {
                                if (result == "-1") {
                                    return true
                                } else {
                                    if (document.getElementById("fuzhitishidiv") != null) {
                                        document.getElementById("fuzhitishidiv").innerHTML = "<div style=\"position: absolute; z-index: 2001;\" ><img src=\"http://pubimage.360doc.com/wz/tuanceng.gif\" usemap=\"#Map2\" /><map name=\"Map2\" id=\"Map2\"><area shape=\"rect\" coords=\"288,23,307,42\" href=\"javascript:void(0);\" οnclick=\"document.getElementById('fuzhitishidiv').innerHTML='';document.getElementById('fuzhitishidiv').style.display='none';\" /></map></div>";
                                        window.scroll(0, 0);
                                        document.getElementById("fuzhitishidiv").style.display = ''
                                    } else {
                                        alert("提示:点击标题下方的“转藏到我的图书馆”,将文章保存到您的个人图书馆中,然后可以拷贝文章的内容!")
                                    }
                                    return false
                                }
                            },
                            error: onFailed
                        })
                    } else {
                        if (document.getElementById("fuzhitishidiv") != null) {
                            document.getElementById("fuzhitishidiv").innerHTML = "<div style=\"position: absolute; z-index: 2001;\" ><img src=\"http://pubimage.360doc.com/wz/tuanceng.gif\" usemap=\"#Map2\" /><map name=\"Map2\" id=\"Map2\"><area shape=\"rect\" coords=\"288,23,307,42\" href=\"javascript:void(0);\" οnclick=\"document.getElementById('fuzhitishidiv').innerHTML='';document.getElementById('fuzhitishidiv').style.display='none';\" /></map></div>";
                            window.scroll(0, 0);
                            document.getElementById("fuzhitishidiv").style.display = ''
                        } else {
                            alert("提示:点击标题下方的“转藏到我的图书馆”,将文章保存到您的个人图书馆中,然后可以拷贝文章的内容!")
                        }
                        return false
                    }
                } else {
                    return true
                }
            }
        }

为了解决以上的这些问题,首先想到的思路是:

一、把这些代码或者外部js链接给去掉,但是这样做根本不现实:

  1. 对于第一种情况,使用浏览器的脚本屏蔽插件如ScriptBlock也到不到效果;
  2. 屏蔽所有JS可能使得网页根本就无法正常显示
二、禁用浏览器的Javascript的执行

同样由于以上的原理2,同样不能奏效;

三、开发Chrome插件+API HOOK实现

此方法看来是最有效的了;

插件制作流程:

  1. Chrome地址栏输入:chrome://extensions/ 打开扩展程序窗口;勾选开发者选项;
  2. 选择之前制作好的插件的目录
  3. 在代码调试结束,确定发布之后,可以点击上图中的打包扩展程序进行打包;将生成的.crx文件拖进浏览器安装即可;


代码:

manifest.json

{
"name": "UBC",
"manifest_version": 2,
"version": "1.0.0",
"description": "UnBlock Copy",
"browser_action": 
{
	"default_icon": "icon.png",
	"default_title": "UnBlock Copy",
    "default_popup": "popup.html"
},
"content_scripts": [{  
         "matches": ["http://*/*","https://*/*"],   
         "js": ["js/hookapi.js"],   
         "run_at": "document_end",  
         "all_frames": true   
    }]
} 

注意:

"manifest_version": 2,

这一行固定,新的Chrome插件开发规范,网上的大多数教程没有此行。

popup.html

<div style="width:200px;">
	<center><img src="icon.png"/></center> 
	<ol>
		<li>Unblock Copy   Event</li>
		<li>Unblock Paste  Event</li>
		<li>Unblock Select Event</li>
	</ol>
</div>


hookapi.js

//UnHook Copy Related Events
var arr_hook_event = ["oncontextmenu","ondragstart","onselectstart","onselect","onbeforecopy","oncopy"];
function Array_indexOf(arr,item)
{
	for(var i = 0;i<arr.length;i++)
	{  
		if(arr[i] == item)
		{  
		   return i;  
		}  
	}  
	 return -1;  
}
   
function UnHookEvent(onevent) 
{
	var _event = onevent.substr(2);
	document.addEventListener(_event, function(e) {
		e.stopPropagation();
	}, true);
}
	
for (var k in document.body) 
{
	if (/^on/.test(k)) 
	{	
		var __index = Array_indexOf(arr_hook_event,k);
		if(__index!= -1)
		{
			UnHookEvent(k);
		}
	}
}


测试效果,两个网站已经可以选择内容,并且可以复制:



最后一个问题:

安装的插件由于不是Google WebStore下载安装的,关闭浏览器下次打开之后,插件被Chrome自动禁用,解决办法:

1.每次手动删除再拖进去安装(麻烦!不可取!)

2.申请Google开发者认证,上传自己的插件到Google WebStore(不想用!要付接近40大洋!付费还很麻烦!)

3.为何不每次启动Chrome让它自动加载一次?

C:\Users\XXX>"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --load-extension=E:\Chrome插件开发\UBC\SRC

试了一试,果然可以!其中E:\Chrome插件开发\UBC\SRC是插件源码目录

再进一步,创建一个Chrome的快捷方式到桌面,修改:属性->目标:C:\Users\XXX>"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --load-extension=E:\Chrome插件开发\UBC\SRC

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值