如何自己寫個腳本來解除網站復制限制

最近有個期末作業需要用到知網，作為一個有良好的復制粘貼素養的青年，那ctrl c是必不可少的

 

以知網在線閱讀為例，在這里復制會有很多限制

　　- 限制右鍵菜單

　　- 限制ctrl c快捷鍵

　　- 不能復制大量文本，會被截取並且還會彈窗。。。

 

消除恐懼的最好辦法就是面對恐懼，那當然是找個腳本解決它

可惜在網上沒有找到針對知網在線閱讀的腳本或插件，於是就有了這篇博客

該腳本已發布在油猴: https://greasyfork.org/zh-CN/scripts/393843-%E8%A7%A3%E9%99%A4%E7%9F%A5%E7%BD%91%E5%A4%8D%E5%88%B6%E9%99%90%E5%88%B6cnki-copy

---

首先解除ctrl c限制

先從簡單的開始，先突破ctrl c的限制

document.body.onkeydown=function(e){
   // 監聽鍵盤事件
　　if(e.ctrlKey && e.keyCode  == 67) { 
　　　　try{   
　　　　　　// 手動添加到剪貼板
　　　　　　if(document.execCommand("Copy","false",null)){
　　　　　　　　console.log("復制成功！");  
　　　　　　}else{
　　　　　　　　console.warn("復制失敗！");
　　　　　　}
　　　　}catch(err){
　　　　　　console.warn("復制錯誤！")
　　　　}
　　}
}

 

 

接着替換掉復制按鈕的邏輯

經過對網頁的分析，發現復制按鈕綁定了一個匿名事件處理函數，所以沒法直接移除點擊事件也沒法覆蓋它

於是我想着直接生成一個新按鈕來替換它

// 前面的可以根據網站實際情況調整
var copytext = document.getElementById("copytext");
var parent = document.getElementsByClassName("inner")[0];
if(copytext!= null) parent.removeChild(copytext);

// 生成新按鈕
var proxyBtn = document.createElement("A");
// 插入這個按鈕
parent.insertBefore(proxyBtn,parent.children[0]);
// 設置屬性與文本
proxyBtn.setAttribute("id","proxy");
proxyBtn.innerHTML="復制";

 

本來想着完工了，接着加點擊事件監聽然后和ctrl c一樣的處理邏輯就行了

但是發現當我點擊復制按鈕時，document.execCommand並沒有復制到東西，剪貼板沒有覆蓋上新內容

我估計是因為點擊按鈕導致文本域框選失去了焦點導致復制了空內容

那么只要我生成一個隱藏的DOM來存放框選的文本，然后在select它那么就可以成功execCommand了

 

var selectText = "";

// 當鼠標框選結束，松開點擊時就去獲取框選的文本
document.body.onmouseup = function(e){
    getSelectText();
}

function getSelectText() {
　　if(document.selection) {
　　　　if(document.selection.createRange().text && document.selection.createRange().text !== ''){
　　　　　　// 只有當真正框選到內容時才去修改全局selectText
　　　　　　selectText = document.selection.createRange().text;
　　　　}
　　} else {
　　　　if(document.getSelection()&& document.getSelection().toString() !== ''){
　　　　　　// 只有當真正框選到內容時才去修改全局selectText
　　　　　　selectText = document.getSelection().toString();
　　　　}
　　}
}

 

最后監聽點擊復制按鈕

// 這里的proxy是之前自己生成的按鈕, id自定義成了proxy
document.getElementById("proxy").onclick = function(e){
　　// 判斷是否存在自己生成的隱藏節點
　　if(document.getElementById("aukoToProxy")){
　　　　// 若存在則直接賦值
　　　　document.getElementById("aukoToProxy").value = selectText;
　　}else{
　　　　// 不存在則生成一個隱藏節點
　　　　var temp = document.createElement('input');
　　　　temp.value = selectText;
　　　　temp.setAttribute("id","aukoToProxy");
　　　　document.body.appendChild(temp);
　　　　// 這里select之后, 就可以順利通過document.execCommand來復制了
　　　　temp.select();
　　　　temp.style.displau='none';
　　}
　　// 這里去調用document.execCommand
　　copy();
}

終於可以舒服的復制粘貼了...