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ê trongpermissions. - 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ínhonclick="..."— 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 HTML —
innerHTMLvới dữ liệu trang là lỗ XSS; dùngtextContenthoặc sanitize. - Khoanh
web_accessible_resourcesvà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
activeTabvà 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> và 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.
activeTabcấ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ờ
innerHTMLdữ 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.