Nội dung mô tả
Dùng API chrome.declarativeContent
để thao tác tuỳ thuộc vào nội dung trên trang mà không yêu cầu quyền đọc nội dung trên trang.
Quyền
declarativeContent
Cách sử dụng
Khai báo Content API cho phép bạn bật hành động của tiện ích tuỳ thuộc vào URL của trang web hoặc nếu bộ chọn CSS khớp với một phần tử trên trang mà không cần thêm quyền của máy chủ hoặc chèn tập lệnh nội dung.
Sử dụng quyền activeTab để tương tác với một trang sau khi người dùng nhấp vào thao tác của tiện ích.
Quy tắc
Quy tắc bao gồm các điều kiện và hành động. Nếu đáp ứng bất kỳ điều kiện nào, thì tất cả các hành động sẽ được thực thi. Các thao tác đó là setIcon
và showAction
.
PageStateMatcher
khớp với các trang web khi và chỉ khi đáp ứng tất cả tiêu chí đã nêu. URL này có thể khớp với URL trang, bộ chọn kết hợp css hoặc trạng thái đã đánh dấu của một trang. Quy tắc sau cho phép tiện ích thực hiện thao tác trên các trang của Google khi có trường mật khẩu:
let rule1 = {
conditions: [
new chrome.declarativeContent.PageStateMatcher({
pageUrl: { hostSuffix: '.google.com', schemes: ['https'] },
css: ["input[type='password']"]
})
],
actions: [ new chrome.declarativeContent.ShowAction() ]
};
Để bật hành động của tiện ích cho các trang web của Google có video, bạn có thể thêm điều kiện thứ hai, vì mỗi điều kiện là đủ để kích hoạt tất cả các hành động đã chỉ định:
let rule2 = {
conditions: [
new chrome.declarativeContent.PageStateMatcher({
pageUrl: { hostSuffix: '.google.com', schemes: ['https'] },
css: ["input[type='password']"]
}),
new chrome.declarativeContent.PageStateMatcher({
css: ["video"]
})
],
actions: [ new chrome.declarativeContent.ShowAction() ]
};
Sự kiện onPageChanged
kiểm tra xem có quy tắc nào có ít nhất một điều kiện được đáp ứng hay không và thực thi các hành động. Các quy tắc vẫn tồn tại qua các phiên duyệt web; do đó, trong thời gian cài đặt tiện ích, trước tiên, bạn nên sử dụng removeRules
để xoá các quy tắc đã cài đặt trước đó, sau đó sử dụng addRules
để đăng ký các quy tắc mới.
chrome.runtime.onInstalled.addListener(function(details) {
chrome.declarativeContent.onPageChanged.removeRules(undefined, function() {
chrome.declarativeContent.onPageChanged.addRules([rule2]);
});
});
Với quyền activeTab, tiện ích của bạn sẽ không hiển thị bất kỳ cảnh báo về quyền nào và khi người dùng nhấp vào thao tác với tiện ích, thao tác đó sẽ chỉ chạy trên các trang có liên quan.
So khớp URL trang
PageStateMatcher.pageurl
sẽ khớp khi các tiêu chí URL được đáp ứng. Tiêu chí phổ biến nhất là một phép nối của máy chủ lưu trữ, đường dẫn hoặc URL, theo sau là Chứa, Bằng, Tiền tố hoặc Hậu tố. Bảng sau đây bao gồm một vài ví dụ:
Tiêu chí | Khớp với |
---|---|
{ hostSuffix: 'google.com' } |
Tất cả URL của Google |
{ pathPrefix: '/docs/extensions' } |
URL tài liệu của tiện ích |
{ urlContains: 'developer.chrome.com' } |
Tất cả URL tài liệu dành cho nhà phát triển Chrome |
Tất cả tiêu chí đều phân biệt chữ hoa chữ thường. Để biết danh sách đầy đủ các tiêu chí, hãy xem UrlFilter.
So khớp CSS
Điều kiện PageStateMatcher.css
phải là bộ chọn phức hợp, nghĩa là bạn không được thêm bộ chọn tổ hợp như khoảng trắng hoặc ">
" vào bộ chọn. Điều này giúp Chrome khớp các bộ chọn hiệu quả hơn.
Bộ chọn kết hợp (OK) | Bộ chọn phức tạp (Không OK) |
---|---|
a |
div p |
iframe.special[src^='http'] |
p>span.highlight |
ns|* |
p + ol |
#abcd:checked |
p::first-line |
Các điều kiện CSS chỉ khớp với các phần tử hiển thị: nếu một phần tử khớp với bộ chọn của bạn là display:none
hoặc một trong các phần tử mẹ của nó là display:none
, thì điều kiện đó sẽ không làm cho điều kiện đó khớp. Các phần tử được tạo kiểu bằng visibility:hidden
, được đặt ngoài màn hình hoặc bị ẩn bởi các phần tử khác vẫn có thể giúp điều kiện của bạn khớp.
So khớp trạng thái đã đánh dấu
Điều kiện PageStateMatcher.isBookmarked
cho phép so khớp trạng thái đã đánh dấu của URL hiện tại trong hồ sơ của người dùng. Để sử dụng điều kiện này, bạn phải khai báo quyền "dấu trang" trong tệp kê khai của tiện ích.
Loại
ImageDataType
Xem https://developer.mozilla.org/en-US/docs/Web/API/ImageData.
Loại
ImageData
PageStateMatcher
Khớp với trạng thái của trang web dựa trên nhiều tiêu chí khác nhau.
Thuộc tính
-
hàm khởi tạo
void
Hàm
constructor
sẽ có dạng như sau:(arg: PageStateMatcher) => {...}
-
đối số
-
giá trị trả về
-
-
css
string[] không bắt buộc
So khớp xem tất cả bộ chọn CSS trong mảng có khớp với các phần tử hiển thị trong một khung có cùng nguồn gốc với khung chính của trang hay không. Tất cả bộ chọn trong mảng này phải là bộ chọn phức hợp để tăng tốc độ so khớp. Lưu ý: Việc liệt kê hàng trăm bộ chọn CSS hoặc liệt kê hàng trăm bộ chọn CSS khớp với hàng trăm lần trên mỗi trang có thể làm chậm trang web.
-
isBookmarked
boolean không bắt buộc
Chrome 45 trở lênSo khớp xem trạng thái được đánh dấu trang của trang có bằng với giá trị được chỉ định hay không. Cần có quyền về dấu trang.
-
pageUrl
UrlFilter không bắt buộc
So khớp xem các điều kiện của
UrlFilter
có được đáp ứng cho URL cấp cao nhất của trang hay không.
RequestContentScript
Hành động sự kiện khai báo chèn một tập lệnh nội dung.
CẢNH BÁO: Thao tác này vẫn đang trong giai đoạn thử nghiệm và không được hỗ trợ trên các bản dựng ổn định của Chrome.
Thuộc tính
-
hàm khởi tạo
void
Hàm
constructor
sẽ có dạng như sau:(arg: RequestContentScript) => {...}
-
đối số
-
giá trị trả về
-
-
allFrames
boolean không bắt buộc
Tập lệnh nội dung có chạy trong tất cả các khung của trang phù hợp hay chỉ trong khung trên cùng. Mặc định là
false
. -
css
string[] không bắt buộc
Tên của các tệp CSS sẽ được chèn vào dưới dạng một phần của tập lệnh nội dung.
-
js
string[] không bắt buộc
Tên của tệp JavaScript sẽ được chèn như một phần của tập lệnh nội dung.
-
matchAboutBlank
boolean không bắt buộc
Liệu có chèn tập lệnh nội dung vào
about:blank
vàabout:srcdoc
hay không. Mặc định làfalse
.
SetIcon
Hành động sự kiện khai báo đặt biểu tượng hình vuông n-dip cho hành động trên trang hoặc hành động trên trình duyệt của tiện ích trong khi các điều kiện tương ứng được đáp ứng. Có thể sử dụng thao tác này mà không cần quyền của máy chủ, nhưng tiện ích phải có thao tác trên trang hoặc trình duyệt.
Phải chỉ định chính xác một trong số imageData
hoặc path
. Cả hai đều là từ điển ánh xạ một số pixel đến một cách biểu diễn hình ảnh. Hình ảnh biểu diễn trong imageData
là một đối tượng ImageData; ví dụ: từ phần tử canvas
, trong khi hình ảnh biểu diễn trong path
là đường dẫn đến tệp hình ảnh tương ứng với tệp kê khai của tiện ích. Nếu pixel màn hình scale
vừa với một pixel độc lập với thiết bị, thì biểu tượng scale * n
sẽ được sử dụng. Nếu thiếu tỷ lệ đó, một hình ảnh khác sẽ được đổi kích thước thành kích thước bắt buộc.
Thuộc tính
-
hàm khởi tạo
void
Hàm
constructor
sẽ có dạng như sau:(arg: SetIcon) => {...}
-
đối số
-
giá trị trả về
-
-
imageData
ImageData | đối tượng không bắt buộc
Đối tượng
ImageData
hoặc từ điển {size -> ImageData} biểu thị một biểu tượng cần đặt. Nếu biểu tượng được chỉ định làm từ điển, thì hình ảnh sử dụng sẽ được chọn tuỳ thuộc vào mật độ pixel của màn hình. Nếu số pixel hình ảnh vừa với một đơn vị không gian màn hình bằngscale
, thì hệ thống sẽ chọn hình ảnh có kích thướcscale * n
, trong đó n là kích thước của biểu tượng trong giao diện người dùng. Bạn phải chỉ định ít nhất một hình ảnh. Hãy lưu ý rằngdetails.imageData = foo
tương đương vớidetails.imageData = {'16': foo}
.
ShowAction
Một hành động của sự kiện khai báo đặt thao tác trên thanh công cụ của tiện ích thành trạng thái bật trong khi đáp ứng các điều kiện tương ứng. Có thể sử dụng thao tác này mà không cần quyền của máy chủ. Nếu tiện ích có quyền activeTab, thì thao tác nhấp vào thao tác trên trang sẽ cấp quyền truy cập vào thẻ đang hoạt động.
Trên những trang không đáp ứng điều kiện, thao tác trên thanh công cụ của tiện ích sẽ có thang màu xám và thao tác này sẽ mở ra trình đơn theo bối cảnh, thay vì kích hoạt thao tác đó.
Thuộc tính
-
hàm khởi tạo
void
Hàm
constructor
sẽ có dạng như sau:(arg: ShowAction) => {...}
-
đối số
-
giá trị trả về
-
ShowPageAction
Vui lòng sử dụng declarativeContent.ShowAction
.
Một hành động sự kiện khai báo đặt hành động trên trang của tiện ích thành trạng thái đang bật trong khi đáp ứng các điều kiện tương ứng. Bạn có thể sử dụng thao tác này mà không cần quyền của máy chủ, nhưng tiện ích phải có thao tác trên trang. Nếu tiện ích có quyền activeTab, thì thao tác nhấp vào thao tác trên trang sẽ cấp quyền truy cập vào thẻ đang hoạt động.
Trên những trang không đáp ứng điều kiện, thao tác trên thanh công cụ của tiện ích sẽ có thang màu xám và thao tác này sẽ mở ra trình đơn theo bối cảnh, thay vì kích hoạt thao tác đó.
Thuộc tính
-
hàm khởi tạo
void
Hàm
constructor
sẽ có dạng như sau:(arg: ShowPageAction) => {...}
-
đối số
-
giá trị trả về
-
Sự kiện
onPageChanged
Cung cấp Declarative Event API (API Sự kiện khai báo) bao gồm addRules
, removeRules
và getRules
.