在學習前端、自動化或擴展開發時，我們常常會想研究某個瀏覽器插件的實現邏輯。即使擴展沒有公開源碼，只要我們本地安裝了它，就可以查看它的完整源代碼進行學習。

---

? 方法一：從瀏覽器插件目錄提取源碼

第一步：打開擴展程序管理頁面

• 在地址欄輸入：
  edge://extensions/（Edge）
  或 chrome://extensions/（Chrome）
• 開啟右上角的 開發者模式。

第二步：找到目標插件

• 定位你想查看的插件，記錄其 擴展 ID（是一串看似隨機的字符串）。

第三步：訪問本地插件存儲路徑

不同操作系統存放插件的路徑略有不同：

• Windows：

  C:\Users\<用戶名>\AppData\Local\<瀏覽器名稱>\User Data\Default\Extensions\<擴展ID>\
  

• macOS：

  ~/Library/Application Support/<瀏覽器名稱>/Default/Extensions/<擴展ID>/
  

• Linux：

  ~/.config/<瀏覽器名稱>/Default/Extensions/<擴展ID>/
  

第四步：打開并查看源碼

進入該目錄后，你會看到如下文件：

• manifest.json：擴展的配置入口；
• .js 腳本文件：包括邏輯控制、網頁注入、網絡請求等；
• .html/.css：界面樣式文件；
• 可能還有資源圖片、字體等。

---

? 方法二：下載 .crx 擴展包手動解壓

1. 使用擴展下載工具（如 crxextractor.com）輸入插件擴展 ID；
2. 下載 .crx 文件并將其后綴改為 .zip；
3. 解壓縮后即可查看源碼文件。

---

🔍 可以學到什么？

• 擴展的初始化流程和權限聲明；
• 如何注入內容腳本；
• 與網頁或后臺通信的機制；
• 使用 fetch/XHR 進行 API 請求的方式；
• UI 控制與交互邏輯等。

---

?? 合法性說明

查看瀏覽器插件源碼僅供學習與研究，請勿復制、修改、再發布，尤其不得用于商業用途。尊重開發者版權是基本底線。

---