ServiceWorkerGlobalScope: sự kiện backgroundfetchabort

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

Note: This feature is only available in Service Workers.

Sự kiện backgroundfetchabort của giao diện ServiceWorkerGlobalScope được kích hoạt khi người dùng hoặc chính ứng dụng hủy một thao tác background fetch.

Sự kiện này không thể hủy và không nổi bọt.

Cú pháp

Sử dụng tên sự kiện trong các phương thức như addEventListener(), hoặc thiết lập một thuộc tính trình xử lý sự kiện.

js
addEventListener("backgroundfetchabort", (event) => { })

onbackgroundfetchabort = (event) => { }

Loại sự kiện

Một BackgroundFetchEvent.

Event ExtendableEvent BackgroundFetchEvent

Thuộc tính sự kiện

Kế thừa các thuộc tính từ giao diện cha, ExtendableEvent.

BackgroundFetchEvent.registration

Trả về BackgroundFetchRegistration cho fetch bị hủy.

Mô tả

Trong background fetch API, trình duyệt hiển thị một phần tử UI cho người dùng để cho biết tiến trình của thao tác. Phần tử này cũng cho phép người dùng hủy fetch. Bản thân ứng dụng cũng có thể hủy fetch bằng cách gọi BackgroundFetchRegistration.abort().

Nếu fetch bị hủy, trình duyệt sẽ abort fetch, khởi động service worker nếu cần thiết, và kích hoạt sự kiện backgroundfetchabort trong phạm vi toàn cục của service worker.

Trong trình xử lý cho sự kiện này, service worker có thể dọn dẹp bất kỳ dữ liệu liên quan nào cho thao tác. Nó cũng có thể lấy và lưu trữ bất kỳ phản hồi thành công nào (ví dụ: sử dụng API Cache). Để truy cập dữ liệu phản hồi, service worker sử dụng thuộc tính registration của sự kiện.

Ví dụ

Dọn dẹp

Trình xử lý sự kiện này có thể thực hiện bất kỳ việc dọn dẹp dữ liệu nào liên quan đến fetch bị hủy.

js
addEventListener("backgroundfetchabort", (event) => {
  // clean up any related data
});

Đặc tả kỹ thuật

Specification
Background Fetch
# dom-serviceworkerglobalscope-onbackgroundfetchabort

Tương thích trình duyệt

Xem thêm