jvinhit//lab

Search posts

Type to search across journal entries.

navigate open esc close

Build Chrome Extensions · Part 9 — Permissions & Security

The permission model: activeTab, optional permissions and runtime requests, host permissions, the content security policy, and how to write an extension that users install and reviewers trust. With an interactive permissions inspector.

Mỗi quyền bạn xin được hiện cho user lúc cài như một cảnh báo, và cho Google khi họ duyệt bạn. Xin quá đà là lý do số một khiến extension mất lượt cài và bị từ chối. Cả trò chơi là đặc quyền tối thiểu.

Bật/tắt quyền bên dưới và xem cảnh báo đồng ý và đồng hồ rủi ro phản ứng:


1. Hai loại quyền

  • Quyền API — truy cập API chrome.*, liệt kê trong permissions.
  • Host permissions — truy cập dữ liệu của site cụ thể, liệt kê trong host_permissions.
{
  "permissions": ["storage", "scripting"],
  "host_permissions": ["https://*.example.com/*"]
}

Host permissions là cái đáng sợ — <all_urls> kích “Đọc và thay đổi mọi dữ liệu của bạn trên mọi website”, làm user khiếp. Xem thanh rủi ro tăng vọt khi bạn thêm nó.


2. activeTab — quyền không xin gì

activeTab là vũ khí bí mật cho extension điều khiển bằng click. Nó cấp truy cập tạm thời tới tab hiện tại — nhưng chỉ sau khi user gọi extension (bấm icon, dùng phím tắt, hay context menu) — không cảnh báo cài đặt nào.

{ "permissions": ["activeTab", "scripting"] }
chrome.action.onClicked.addListener(async (tab) => {
  // activeTab now grants access to THIS tab, just-in-time
  await chrome.scripting.executeScript({
    target: { tabId: tab.id },
    func: () => document.body.style.filter = "grayscale(1)",
  });
});

Nếu extension chỉ hành động khi user bấm, ưu tiên activeTab hơn host permissions rộng — cùng sức mạnh, không cảnh báo đáng sợ.


3. Quyền tùy chọn — xin lúc chạy

Đừng xin quyền mạnh ngay từ đầu nếu chỉ vài user cần. Khai báo nó là tùy chọn và xin theo yêu cầu, đáp lại một thao tác của user:

{
  "optional_permissions": ["downloads"],
  "optional_host_permissions": ["https://*/*"]
}
// inside a click handler — must be user-initiated
const granted = await chrome.permissions.request({
  permissions: ["downloads"],
  origins: ["https://example.com/*"],
});
if (granted) startDownload();

Điều này giữ cảnh báo lúc cài tối thiểu và cho user quyền kiểm soát. Bạn có thể chrome.permissions.remove(...) sau, và kiểm tra với chrome.permissions.contains(...).


4. Chính sách bảo mật nội dung

MV3 áp CSP nghiêm ngặt lên các trang extension của bạn. Quy tắc phải thấm:

  • Không code từ xa. Bạn không thể tải <script src="https://cdn..."> — mọi JS phải đóng gói trong extension.
  • Không script inline. Không <script>code</script> và không thuộc tính onclick="..." — dùng file ngoài và addEventListener.
  • Không eval / new Function. Thực thi code động bị chặn.

Đây chính là vì sao bundler quan trọng (Phần 11) — bạn ship một bundle tự chứa, không bao giờ link CDN.


5. Trách nhiệm bảo mật khác

  • Xác thực mọi tin nhắn, nhất là từ content script và onMessageExternal — coi chúng là input không tin cậy.
  • Không bao giờ tiêm chuỗi không tin cậy làm HTMLinnerHTML với dữ liệu trang là lỗ XSS; dùng textContent hoặc sanitize.
  • Khoanh web_accessible_resources vào file và origin cụ thể, không <all_urls>.
  • Không rò bí mật. Mọi thứ ship trong extension đều đọc được bởi ai giải nén — không nhúng API secret.

6. Viết cho reviewer

Duyệt Chrome Web Store kiểm tra mọi quyền có lý do bởi chức năng nhìn thấy được. Quy tắc thực dụng:

  • Xin mẫu host hẹp nhất mà vẫn chạy.
  • Ưu tiên activeTab và quyền tùy chọn.
  • Bỏ quyền bạn đã ngừng dùng.
  • Có chính sách bảo mật rõ nếu chạm dữ liệu user.

Bộ quyền gọn gàng kiếm được niềm tin, lượt cài, và duyệt nhanh.


7. Bài tập

1. Extension làm xám trang khi user bấm icon. Bạn xin host_permissions: ["<all_urls>"]. Có lựa chọn ít đáng sợ hơn không?

Lời giải

Dùng activeTab + scripting — bạn chỉ hành động khi bấm, nên có truy cập tab hiện tại mà không cảnh báo cài đặt.

2. Bạn thử tải thư viện biểu đồ từ CDN bằng <script src="https://cdn.../chart.js"> và không gì chạy. Vì sao?

Lời giải

CSP của MV3 cấm code từ xa. Đóng gói thư viện vào extension và tham chiếu file cục bộ.

3. Chỉ 5% user dùng tính năng “xuất sang Google Drive”, cần một quyền rộng. Làm sao tránh dọa 95% còn lại?

Lời giải

Khai báo nó là quyền tùy chọn và xin lúc chạy, trong handler click của tính năng, chỉ cho user dùng nó.

Nâng cao:trong inspector, bật <all_urls>cookies cùng lúc và xem thanh rủi ro đỏ — rồi thay bằng activeTab và xem nó xuống xanh.


Điểm chính

  • Thực hành đặc quyền tối thiểu — mỗi quyền là một cảnh báo và rủi ro duyệt.
  • activeTab cấp truy cập tab hiện tại khi user hành động mà không cảnh báo.
  • Dùng quyền tùy chọn cho tính năng chỉ vài user cần.
  • CSP của MV3 cấm code từ xa và inline — đóng gói mọi thứ.
  • Xác thực input không tin cậy và không bao giờ innerHTML dữ liệu trang.

Tiếp theo

Phần 10 — Các API mạnh mẽ: tabs, scripting, contextMenus, commands (phím tắt), và notifications — bộ công cụ biến đồ chơi thành sản phẩm thật.