Chrome 插件開發實戰：通過 Hook API 破解網頁防複製限制

問題背景

許多網站（如 360doc、yu1u.org）通過 JS 禁用右鍵菜單、選擇、複製等操作：

document.body.oncontextmenu = () => false;
document.body.onselectstart = () => false;
document.body.oncopy = () => false;
// 甚至監聽鍵盤事件、覆蓋選區等

解決方案對比

插件架構：Manifest V2

{
  "name": "UnBlock Copy",
  "manifest_version": 2,
  "version": "1.0.0",
  "description": "解除網頁複製限制",
  "browser_action": {
    "default_icon": "icon.png",
    "default_popup": "popup.html"
  },
  "content_scripts": [{
    "matches": ["https://*/*", "https://*/*"],
    "js": ["js/hookapi.js"],
    "run_at": "document_end",
    "all_frames": true
  }]
}

核心 Hook 腳本：hookapi.js

// 需要解除綁定的事件列表
const events = [
  'oncontextmenu', 'ondragstart', 'onselectstart',
  'onselect', 'onbeforecopy', 'oncopy'
];

// 保存原始屬性描述符
const originalDescriptors = new Map();

function hookEvent(eventName) {
  const descriptor = Object.getOwnPropertyDescriptor(Document.prototype, eventName) ||
                     Object.getOwnPropertyDescriptor(HTMLElement.prototype, eventName) ||
                     Object.getOwnPropertyDescriptor(Element.prototype, eventName) ||
                     Object.getOwnPropertyDescriptor(Node.prototype, eventName);
  if (!descriptor) return;
  
  originalDescriptors.set(eventName, descriptor);
  
  // 重新定義屬性：setter 直接忽略賦值
  Object.defineProperty(document.body, eventName, {
    set: function(val) { /* 吞掉賦值，不綁定任何處理器 */ },
    get: function() { return null; },
    configurable: true
  });
}

// 執行 Hook
events.forEach(hookEvent);

// 額外：移除已綁定的屬性（針對內聯腳本已執行的情況）
events.forEach(e => document.body[e] = null);

關鍵技術點

1. 原型鏈查找：事件屬性可能定義在 Document/HTMLElement/Element/Node 上，需逐級查找
2. Object.defineProperty：攔截 setter，阻止賦值生效
3. run_at: document_end：確保在頁面腳本執行前/中注入，但內聯腳本可能已執行，故需額外清空 body[event]=null
4. all_frames: true：覆蓋 iframe 內頁面

安裝測試流程

1. Chrome 打開 chrome://extensions/
2. 開啟「開發者模式」
3. 點擊「加載已解壓的擴展程序」，選擇插件目錄
4. 測試目標網站：右鍵、選擇、複製應恢復正常

進階：Manifest V3 遷移

MV3 中 content_scripts 機制不變，但需注意 host_permissions 聲明。核心 Hook 邏輯不變。

道德與法律提示

此技術僅供學習瀏覽器擴展開發與 JS 原型鏈機制理解，請尊重網站版權與服務條款，勿用於非法內容獲取。

1. 上一篇文章： HDU 4966 最小樹形圖：課程等級依賴建模與朱劉算法
2. 下一篇文章： Cocos2d-x PhysicsBody 解析器：從 Physics Body Editor JSON 載入多邊形碰撞體

C++ 入門

C++ 重載 operator+ 正確姿勢：對稱性、回傳值與效能權衡

內建 operator+ 特性 二元、對稱、可交換：a

舊式 C 風格在新語言中的殘留：從 Ruby IO 操作看程式設計思維轉型

觸發反思的 Stack Overflow 經歷 一個月前用

C++ 空類自動生成的六大成員函數詳解：構造/析構/拷貝/移動/取址/賦值

C++ 空類編譯器自動生成的成員函數完全圖解 核心結論 一

HDU 5375 Gray Code：動態規劃求最大得分

問題描述 給定長度 n 的二進制串（含 0,1,?），? 可