헷갈리는 service worker 관련 인터페이스들 정리 - jerrybabah/botw-recipe GitHub Wiki

1. ServiceWorkerContainer

navigator.serviceWorker // 얘가 ServiceWorkerContainer를 구현함

The ServiceWorkerContainer interface of the Service Worker API provides an object representing the service worker as an overall unit in the network ecosystem, including facilities to register, unregister and update service workers, and access the state of service workers and their registrations.

추가할 수 있는 이벤트 목록

• controllerchange
• error
• message

자세한 내용은 MDN 문서 참고

2. ServiceWorkerRegistration

navigator.serviceWorker.register('url...')
  .then((registration) => {
    // 여기서 registration이 ServiceWorkerRegistration을 구현	
  });

The ServiceWorkerRegistration interface of the Service Worker API represents the service worker registration. You register a service worker to control one or more pages that share the same origin.

추가할 수 있는 이벤트 목록

• ready
• registered
• cached
• updatefound
• updated
• offline
• error

자세한 내용은 MDN 문서 참고

3. ServiceWorker

navigator.serviceWorker.register('url...')
  .then((registration) => {
    const sw = registration.installing; // 여기서 sw가 ServiceWorker를 구현	
  });

The ServiceWorker interface of the ServiceWorker API provides a reference to a service worker. Multiple browsing contexts (e.g. pages, workers, etc.) can be associated with the same service worker, each through a unique ServiceWorker object.

추가할 수 있는 이벤트 목록

• statechange

자세한 내용은 MDN 문서 참고

4. ServiceWorkerGlobalScope

• service-worker.js에서 self가 이 인터페이스를 의미한다.

The ServiceWorkerGlobalScope interface of the ServiceWorker API represents the global execution context of a service worker.

추가할 수 있는 이벤트 목록

• install
• activate
• message
• fetch
• sync
• push

자세한 내용은 MDN 문서 참고