Thay thế việc chặn trình nghe yêu cầu web

Sửa đổi yêu cầu mạng trong Manifest V3

Manifest V3 thay đổi cách các tiện ích xử lý việc sửa đổi yêu cầu mạng. Thay vì chặn các yêu cầu mạng và thay đổi các yêu cầu đó trong thời gian chạy bằng chrome.webRequest, tiện ích sẽ chỉ định các quy tắc mô tả các thao tác cần thực hiện khi đáp ứng một nhóm điều kiện nhất định. Bạn có thể thực hiện việc này bằng cách sử dụng Declarative Net Request API (API Yêu cầu mạng khai báo).

API yêu cầu web và API yêu cầu ròng khai báo có sự khác biệt đáng kể. Thay vì thay thế một lệnh gọi hàm bằng một lệnh gọi hàm khác, bạn cần viết lại mã theo trường hợp sử dụng. Phần này sẽ hướng dẫn bạn thực hiện quy trình đó.

Trong Manifest V2, việc chặn các yêu cầu web có thể làm giảm đáng kể hiệu suất của các tiện ích và hiệu suất của các trang tương tác. Không gian tên webRequest hỗ trợ 9 sự kiện có thể chặn, mỗi sự kiện sẽ nhận số lượng trình xử lý sự kiện không giới hạn. Để vấn đề nghiêm trọng hơn, mỗi trang web có thể bị chặn bởi nhiều tiện ích, và các quyền cần thiết cho việc này chiếm dụng phần dữ liệu. Manifest V3 ngăn chặn vấn đề này bằng cách thay thế các lệnh gọi lại bằng các quy tắc khai báo.

Đây là phần thứ hai trong ba phần mô tả những thay đổi cần thiết đối với mã không phải là một phần của trình chạy dịch vụ tiện ích. Hướng dẫn này mô tả việc chuyển đổi các yêu cầu web bị chặn (được Manifest V2 sử dụng) sang các yêu cầu mạng khai báo mà Manifest V3 sử dụng. Hai phần còn lại trình bày việc cập nhật mã cần thiết để di chuyển sang Manifest V3 và cải thiện khả năng bảo mật.

Cập nhật quyền

Thực hiện các thay đổi sau đây đối với trường "permissions" trong manifest.json.

  • Xoá quyền "webRequest" nếu bạn không cần quan sát các yêu cầu mạng nữa.
  • Di chuyển mẫu khớp từ "permissions" sang "host_permissions".

Bạn sẽ cần thêm các quyền khác, tuỳ thuộc vào trường hợp sử dụng của bạn. Những quyền đó được mô tả theo trường hợp sử dụng mà chúng hỗ trợ.

Tạo quy tắc yêu cầu ròng mang tính khai báo

Việc tạo quy tắc yêu cầu ròng mang tính khai báo yêu cầu thêm đối tượng "declarative_net_request" vào manifest.json của bạn. Khối "declarative_net_request" chứa một mảng các đối tượng "rule_resource" trỏ đến một tệp quy tắc. Tệp quy tắc chứa một mảng các đối tượng chỉ định một hành động và điều kiện để gọi các hành động đó.

Các trường hợp sử dụng phổ biến

Phần sau đây mô tả các trường hợp sử dụng phổ biến cho các yêu cầu ròng khai báo. Các hướng dẫn dưới đây chỉ cung cấp một tóm tắt ngắn gọn. Bạn có thể xem thêm thông tin về tất cả thông tin tại đây trong tài liệu tham khảo API của chrome.declarativeNetRequest

Chặn một URL

Một trường hợp sử dụng phổ biến trong Manifest V2 là chặn các yêu cầu web bằng cách sử dụng sự kiện onBeforeRequest trong tập lệnh nền.

Tập lệnh nền Manifest V2
chrome.webRequest.onBeforeRequest.addListener((e) => {
    return { cancel: true };
}, { urls: ["https://www.example.com/*"] }, ["blocking"]);

Đối với Manifest V3, hãy tạo quy tắc declarativeNetRequest mới bằng cách sử dụng loại thao tác "block". Hãy lưu ý đối tượng "condition" trong quy tắc ví dụ. "urlFilter" của biến thay thế cho tuỳ chọn urls được truyền đến trình nghe webRequest. Mảng "resourceTypes" chỉ định danh mục tài nguyên cần chặn. Ví dụ này chỉ chặn trang HTML chính, nhưng bạn có thể chỉ chặn phông chữ chẳng hạn.

Tệp quy tắc Manifest V3
[
  {
    "id" : 1,
    "priority": 1,
    "action" : { "type" : "block" },
    "condition" : {
      "urlFilter" : "||example.com",
      "resourceTypes" : ["main_frame"]
    }
  }
]

Để làm việc này, bạn cần phải cập nhật quyền của tiện ích. Trong manifest.json, hãy thay thế quyền "webRequestBlocking" bằng quyền "declarativeNetRequest". Xin lưu ý rằng URL này sẽ bị xoá khỏi trường "permissions" vì việc chặn nội dung không yêu cầu quyền của máy chủ. Như trình bày ở trên, tệp quy tắc chỉ định máy chủ lưu trữ hoặc các máy chủ lưu trữ được áp dụng yêu cầu net khai báo.

Nếu bạn muốn thử điều này, mã dưới đây có sẵn trong kho lưu trữ mẫu của chúng tôi.

Manifest V2
  "permissions": [
    "webRequestBlocking",
    "https://*.example.com/*"
  ]
Manifest V3
  "permissions": [
    "declarativeNetRequest",
  ]

Chuyển hướng nhiều URL

Một trường hợp sử dụng phổ biến khác trong Manifest V2 là dùng sự kiện BeforeRequest để chuyển hướng các yêu cầu web.

Tập lệnh nền Manifest V2
chrome.webRequest.onBeforeRequest.addListener((e) => {
    console.log(e);
    return { redirectUrl: "https://developer.chrome.com/docs/extensions/mv3/intro/" };
  }, { 
    urls: [
      "https://developer.chrome.com/docs/extensions/mv2/"
    ]
  }, 
  ["blocking"]
);

Đối với Manifest V3, hãy sử dụng loại thao tác "redirect". Như trước đó, "urlFilter" thay thế tuỳ chọn url được truyền đến trình nghe webRequest. Lưu ý rằng trong ví dụ này, đối tượng "action" của tệp quy tắc chứa trường "redirect" chứa URL cần trả về thay vì URL được lọc.

Tệp quy tắc Manifest V3
[
  {
    "id" : 1,
    "priority": 1,
    "action": {
      "type": "redirect",
      "redirect": { "url": "https://developer.chrome.com/docs/extensions/mv3/intro/" }
    },
    "condition": {
      "urlFilter": "https://developer.chrome.com/docs/extensions/mv2/",
      "resourceTypes": ["main_frame"]
    }
  }

Trường hợp này cũng yêu cầu thay đổi quyền của tiện ích. Như trước đó, hãy thay thế quyền "webRequestBlocking" bằng quyền "declarativeNetRequest". Các URL này lại được di chuyển từ manifest.json sang một tệp quy tắc. Xin lưu ý rằng việc chuyển hướng cũng yêu cầu quyền "declarativeNetRequestWithHostAccess" ngoài quyền của máy chủ.

Nếu bạn muốn thử điều này, mã dưới đây có sẵn trong kho lưu trữ mẫu của chúng tôi.

Manifest V2
  "permissions": [
    "webRequestBlocking",
    "https://developer.chrome.com/docs/extensions/*",
    "https://developer.chrome.com/docs/extensions/reference"
  ]
Manifest V3
  "permissions": [
    "declarativeNetRequestWithHostAccess"
  ],
  "host_permissions": [
    "https://developer.chrome.com/*"
  ]

Chặn cookie

Trong Manifest V2, việc chặn cookie yêu cầu chặn các tiêu đề của yêu cầu web trước khi các tiêu đề đó được gửi đi và xoá một tiêu đề cụ thể.

Tập lệnh nền Manifest V2
chrome.webRequest.onBeforeSendHeaders.addListener(
  function(details) {
    removeHeader(details.requestHeaders, 'cookie');
    return {requestHeaders: details.requestHeaders};
  },
  // filters
  {urls: ['https://*/*', 'http://*/*']},
  // extraInfoSpec
  ['blocking', 'requestHeaders', 'extraHeaders']);

Manifest V3 cũng thực hiện việc này bằng quy tắc trong tệp quy tắc. Lần này, loại thao tác là "modifyHeaders". Tệp này lấy một mảng các đối tượng "requestHeaders" chỉ định các tiêu đề cần sửa đổi và cách sửa đổi các tiêu đề đó. Xin lưu ý rằng đối tượng "condition" chỉ chứa một mảng "resourceTypes". Phương thức này hỗ trợ các giá trị giống như các ví dụ trước đó.

Nếu bạn muốn thử điều này, mã dưới đây có sẵn trong kho lưu trữ mẫu của chúng tôi.

Tệp kê khai V3 manifest.json
[
  {
    "id": 1,
    "priority": 1,
    "action": {
      "type": "modifyHeaders",
      "requestHeaders": [
        { "header": "cookie", "operation": "remove" }
      ]
    },
    "condition": {
      "urlFilter": "|*?no-cookies=1",
      "resourceTypes": ["main_frame"]
    }
  }
]

Trường hợp này cũng yêu cầu thay đổi quyền của tiện ích. Như trước đó, hãy thay thế quyền "webRequestBlocking" bằng quyền "declarativeNetRequest".

Manifest V2
  "permissions": [
    "webRequest",
    "webRequestBlocking",
    "https://*/*",
    "http://*/*"
  ],
Manifest V3
  "permissions": [
    "declarativeNetRequest",
  ],
  "host_permissions": [
    ""
  ]