ServiceWorkerGlobalScope

Thuộc tính của instance

Giao diện này kế thừa các thuộc tính từ giao diện WorkerGlobalScope, và giao diện cha EventTarget của nó.

ServiceWorkerGlobalScope.clients Read only

Chứa đối tượng Clients được liên kết với service worker.

ServiceWorkerGlobalScope.cookieStore Read only

Trả về một tham chiếu đến đối tượng CookieStore được liên kết với service worker.

ServiceWorkerGlobalScope.registration Read only

Chứa đối tượng ServiceWorkerRegistration đại diện cho việc đăng ký của service worker.

ServiceWorkerGlobalScope.serviceWorker Read only

Chứa đối tượng ServiceWorker đại diện cho service worker.

Phương thức của instance

Giao diện này kế thừa các phương thức từ giao diện WorkerGlobalScope, và giao diện cha EventTarget của nó.

ServiceWorkerGlobalScope.skipWaiting()

Cho phép đăng ký service worker hiện tại tiến từ trạng thái waiting sang trạng thái active trong khi các client service worker đang sử dụng nó.

Sự kiện

Lắng nghe sự kiện này bằng cách sử dụng addEventListener() hoặc bằng cách gán một trình xử lý sự kiện cho thuộc tính oneventname của giao diện này.

activate

Xảy ra khi một ServiceWorkerRegistration có một worker ServiceWorkerRegistration.active mới.

backgroundfetchabort Experimental

Được kích hoạt khi một thao tác background fetch đã bị hủy bởi người dùng hoặc ứng dụng.

backgroundfetchclick Experimental

Được kích hoạt khi người dùng nhấp vào UI cho một thao tác background fetch.

backgroundfetchfail Experimental

Được kích hoạt khi ít nhất một yêu cầu trong một thao tác background fetch đã thất bại.

backgroundfetchsuccess Experimental

Được kích hoạt khi tất cả các yêu cầu trong một thao tác background fetch đã thành công.

canmakepayment Experimental

Được kích hoạt trên service worker của ứng dụng thanh toán để kiểm tra xem nó đã sẵn sàng xử lý thanh toán chưa. Cụ thể, nó được kích hoạt khi trang web merchant gọi phương thức khởi tạo PaymentRequest().

contentdelete Experimental

Xảy ra khi một mục bị xóa khỏi ContentIndex.

cookiechange

Được kích hoạt khi một thay đổi cookie xảy ra khớp với danh sách đăng ký thay đổi cookie của service worker.

fetch

Xảy ra khi một fetch() được gọi.

install

Xảy ra khi một ServiceWorkerRegistration có một worker ServiceWorkerRegistration.installing mới.

message

Xảy ra khi các thông điệp đến được nhận. Các trang được điều khiển có thể sử dụng phương thức MessagePort.postMessage() để gửi thông điệp đến service workers.

messageerror

Xảy ra khi các thông điệp đến không thể được giải tuần tự hóa.

notificationclick

Xảy ra khi người dùng nhấp vào một thông báo đã hiển thị.

notificationclose

Xảy ra khi người dùng đóng một thông báo đã hiển thị.

paymentrequest Experimental

Được kích hoạt trên một ứng dụng thanh toán khi một luồng thanh toán đã được khởi tạo trên trang web merchant thông qua phương thức PaymentRequest.show().

sync

Được kích hoạt khi một lệnh gọi đến SyncManager.register được thực hiện từ một trang client service worker. Lần thử đồng bộ được thực hiện ngay lập tức nếu mạng khả dụng hoặc ngay khi mạng trở nên khả dụng.

periodicsync Experimental

Xảy ra ở các khoảng thời gian định kỳ, được chỉ định khi đăng ký một PeriodicSyncManager.

push

Xảy ra khi một thông báo đẩy từ máy chủ được nhận.

pushsubscriptionchange

Xảy ra khi một đăng ký đẩy đã bị vô hiệu hóa, hoặc sắp bị vô hiệu hóa (ví dụ: khi dịch vụ đẩy đặt thời gian hết hạn).

Ví dụ

Đoạn mã này trích từ mẫu prefetch service worker (xem ví dụ prefetch trực tiếp.) Trình xử lý sự kiện onfetch lắng nghe sự kiện fetch. Khi được kích hoạt, mã trả về một promise giải quyết thành yêu cầu khớp đầu tiên trong đối tượng Cache. Nếu không tìm thấy khớp, mã sẽ lấy phản hồi từ mạng.

Mã cũng xử lý các ngoại lệ được ném ra từ thao tác fetch(). Lưu ý rằng một phản hồi lỗi HTTP (ví dụ: 404) sẽ không kích hoạt ngoại lệ. Nó sẽ trả về một đối tượng phản hồi bình thường có mã lỗi thích hợp được thiết lập.

self.addEventListener("fetch", (event) => {
  console.log("Handling fetch event for", event.request.url);

  event.respondWith(
    caches.match(event.request).then((response) => {
      if (response) {
        console.log("Found response in cache:", response);

        return response;
      }
      console.log("No response found in cache. About to fetch from network…");

      return fetch(event.request).then(
        (response) => {
          console.log("Response from network is:", response);

          return response;
        },
        (error) => {
          console.error("Fetching failed:", error);

          throw error;
        },
      );
    }),
  );
});

Đặc tả kỹ thuật

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

Xem thêm

• Sử dụng Service Workers
• Mẫu mã service workers cơ bản