History

  • 2023.10.20 初版草稿

0x00 簡介

  • 一種用 web 技術開發，用來增強瀏覽器功能的軟體。本質上是由 HTML、CSS、JS 及圖片等資源組成的壓縮包（.crx）
  • 可以配合 C++撰寫動態連接庫實作底層功能（PPAPI）

0x01 運作原理

  • 獨立沙盒執行環境
  • 擴展進程（Extension Process）
  • 頁面渲染進程（Render Process）
  • 瀏覽器進程（Browser Process）
  1. 擴展進程中運行 Extension Page，其由 background.html 與 popup.html 組成
    • background.html: 無任何內容，透過 background.js 產生。當打開瀏覽器時，會自動載入擴充功能的 background.js 文件。其獨立於後台執行，並通過瀏覽器提供的 API 和瀏覽器進行交互。
    • popup.html: 和一般的 web 頁面相同，由 HTML、CSS 及 JavaScript 組成。因其按需加載的特性，需要透過使用者點擊圖示觸發才能彈出頁面。
  2. 渲染進程主要運行 Web Page，當頁面打開時，將 content_script.js 加載後注入到該頁面環境中，js 可以操作該頁面 DOM Tree。
  3. 瀏覽器進程扮演中間橋樑的角色，負責 Extension Page 與 content_script.js 之間的消息傳遞。

0x02 能實現的功能

分類 功能描述 對應 API
自定義使用者介面 控制擴充顯示圖示 Action
增加鍵盤快捷鍵 Command
增加頁面右鍵選單 Context Menus
向網址欄增加關鍵字功能 Omnibox
建立新標籤頁、書籤頁及歷史紀錄頁 Override Pages
在工具欄中動態顯示圖示 Page Actions
建立擴充工具 無障礙服務 Accessibility(a11y)
檢測及對應 Service Workers
使用語言和環境 Internationalization
獲得 OAuth2 訪問令牌 Identity
管理已安裝和正在運作中的擴充功能 Management
通過 Content Script 與父擴展通信 Message Passing
讓使用者自定義擴充 Options Pages
修改擴充功能的權限 Permissions
儲存和檢索資料 Storage
修改及監聽瀏覽器 建立、組織及操作書籤行為 Bookmarks
從使用者的本地設定文件中刪除瀏覽資料 Browsing Data
以程式啟動、監視、操作及搜尋下載 Downloads
管理瀏覽器的字體設定 Font Settings
與瀏覽器瀏覽紀錄交互 History
控制瀏覽器的隱私設定 Privacy
管理瀏覽器的代理設定 Proxy
從瀏覽會話查詢和還原頁面及視窗 Sessions
在瀏覽器中建立、修改及重新排列頁籤 Tabs
訪問使用者訪問次數最多的 URL Top Sites
更改瀏覽器外觀 Themes
在瀏覽器中建立、修改及重新排列視窗 Windows
修改和監聽網頁 訪問當前頁籤的權限 Active Tab
自定義網站特性，如 Cookies、JavaScript 及插件 Content Settings
在網頁上下文中執行 JavaScript 腳本 Content Scripts
瀏覽及修改瀏覽器的 Cookie Cookies
使用 XMLHttpRequest 從遠程伺服器發送/接收資料 Cross-Origin XHR
在不需要許可情況下操作頁面內容 Declarative Content
捕捉螢幕、視窗或頁籤的內容 Desktop Capture
將頁面的原始資訊保存成 MHTML Page Capture
與頁籤媒體流交互 Tab Capture
接收 in-flight 導航請求狀態的通知 Web Navigation
提供規則告訴 Chrome 如何攔截、阻止及修改 in-flight 的請求 Declarative Net Request
打包、部署及更新 使用 Chrome Web Store 託管及更新擴充功能 Chrome Web Store
在指定的網路或其他軟體上分發擴充程式 Other Deployment Options
擴充 DevTools 測試網路交互、調試 JavaScript 及修改 DOM 與 CSS Debugger
為開發工具增加功能 Devtools

0x03 規格描述檔案(manifest.json)

  • 每個擴充程式都一定會有的檔案，裡面記載了程式名稱、版本號、圖示、權限及腳本路徑等資訊(metadata)
  • 現在所使用的標準為 V3(V2 已於 2023 6 月棄用)
  • V3版本只允許執行crx中的腳本，不得引用來自遠端的js
  • V3版本支援 Service Worker(替代background pages) 和 Promise 等特性

0x04 Manifest V3 的新特性與改變

I. Service Workers

  • 自V3後替代background pages
  • 管理cache、預加載資源、啟用離線頁面
  • 無法存取DOM
  • 可以設定presist

II. Promise

  • V2所使用的Callback仍可繼續使用
  • 不能在同一函數同時使用callback和promise

III. 修改網路請求(declarativeNetRequest)

  • declarativeNetRequest - 待研究

IV. 遠程託管

  • 因V3無法加載遠端的wasm或js，提交到應用商店時的crx包更安全可靠(程式碼審核)

0x05 彈出窗口(popup.html)

  • 點擊擴充程式時打開的頁面

  • 範例：

    • manifest.json

      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      {
        "manifest_version": 3,
        "name": "Hello extension",
        "description": "popup example",
        "version": "1.0",
        "action": {
          "default_popup": "popup.html", // popup.html
          "default_icon": "icon.png" // extension icon
        }
      }

    • popup.html

      1
      2
      3
      4
      5
      6
      <!DOCTYPE html>
      <html>
        <body>
          <h1>Hello World</h1>
        </body>
      </html>

0x06 content_script.js

TBD

0x07 Options

TBD

0x08 Devtools

TBD

0x09 Override

TBD

0x0a homepage_url

TBD

0x0b Omnibox

TBD

Referrences

[1]: How to Create Your Own Google Chrome Extension

[2]: chrome 插件开发指南（Manifest V3）

[3]: Chrome浏览器插件（扩展）- Manifest V3 插件开发规范简介

[4]: Chrome Extension development overview - Chrome for Developers

[5]: Manifest file format - Chrome for Developers