• Version 12.2.4
  • Published
  • 558 kB
  • 1 dependency
  • MIT license


npm i @angular/service-worker
yarn add @angular/service-worker
pnpm add @angular/service-worker


Angular - service worker tooling!



variable ɵangular_packages_service_worker_service_worker_b

const ɵangular_packages_service_worker_service_worker_b: any;


    function ɵangular_packages_service_worker_service_worker_c

    ɵangular_packages_service_worker_service_worker_c: (
    injector: any,
    script: string,
    options: SwRegistrationOptions,
    platformId: string
    ) => Function;

      function ɵangular_packages_service_worker_service_worker_d

      ɵangular_packages_service_worker_service_worker_d: (
      opts: SwRegistrationOptions,
      platformId: string
      ) => ɵangular_packages_service_worker_service_worker_a;


        class ɵangular_packages_service_worker_service_worker_a

        class ɵangular_packages_service_worker_service_worker_a {}


        constructor(serviceWorker: ServiceWorkerContainer);

          property events

          readonly events: any;

            property isEnabled

            readonly isEnabled: boolean;

              property registration

              readonly registration: any;

                property worker

                readonly worker: any;

                  method eventsOfType

                  eventsOfType: <T extends TypedEvent>(type: T['type']) => any;

                    method generateNonce

                    generateNonce: () => number;

                      method nextEventOfType

                      nextEventOfType: <T extends TypedEvent>(type: T['type']) => any;

                        method postMessage

                        postMessage: (action: string, payload: Object) => Promise<void>;

                          method postMessageWithStatus

                          postMessageWithStatus: (
                          type: string,
                          payload: Object,
                          nonce: number
                          ) => Promise<void>;

                            method waitForStatus

                            waitForStatus: (nonce: number) => Promise<void>;

                              class ServiceWorkerModule

                              class ServiceWorkerModule {}

                              method register

                              static register: (script: string, opts?: SwRegistrationOptions) => any;
                              • Register the given Angular Service Worker script.

                                If enabled is set to false in the given options, the module will behave as if service workers are not supported by the browser, and the service worker will not be registered.

                              class SwPush

                              class SwPush {}
                              • Subscribe and listen to [Web Push Notifications](https://developer.mozilla.org/en-US/docs/Web/API/Push_API/Best_Practices) through Angular Service Worker.

                                You can inject a SwPush instance into any component or service as a dependency.

                                To subscribe, call SwPush.requestSubscription(), which asks the user for permission. The call returns a Promise with a new [PushSubscription](https://developer.mozilla.org/en-US/docs/Web/API/PushSubscription) instance.

                                A request is rejected if the user denies permission, or if the browser blocks or does not support the Push API or ServiceWorkers. Check SwPush.isEnabled to confirm status.

                                Invoke Push Notifications by pushing a message with the following payload.

                                "notification": {
                                "actions": NotificationAction[],
                                "badge": USVString,
                                "body": DOMString,
                                "data": any,
                                "dir": "auto"|"ltr"|"rtl",
                                "icon": USVString,
                                "image": USVString,
                                "lang": DOMString,
                                "renotify": boolean,
                                "requireInteraction": boolean,
                                "silent": boolean,
                                "tag": DOMString,
                                "timestamp": DOMTimeStamp,
                                "title": DOMString,
                                "vibrate": number[]

                                Only title is required. See Notification [instance properties](https://developer.mozilla.org/en-US/docs/Web/API/Notification#Instance_properties).

                                While the subscription is active, Service Worker listens for [PushEvent](https://developer.mozilla.org/en-US/docs/Web/API/PushEvent) occurrences and creates [Notification](https://developer.mozilla.org/en-US/docs/Web/API/Notification) instances in response.

                                Unsubscribe using SwPush.unsubscribe().

                                An application can subscribe to SwPush.notificationClicks observable to be notified when a user clicks on a notification. For example:

                                You can read more on handling notification clicks in the [Service worker notifications guide](guide/service-worker-notifications).

                                See Also

                                • [Push Notifications](https://developers.google.com/web/fundamentals/codelabs/push-notifications/)

                                • [Angular Push Notifications](https://blog.angular-university.io/angular-push-notifications/)

                                • [MDN: Push API](https://developer.mozilla.org/en-US/docs/Web/API/Push_API)

                                • [MDN: Notifications API](https://developer.mozilla.org/en-US/docs/Web/API/Notifications_API)

                                • [MDN: Web Push API Notifications best practices](https://developer.mozilla.org/en-US/docs/Web/API/Push_API/Best_Practices)


                              constructor(sw: ɵangular_packages_service_worker_service_worker_a);

                                property isEnabled

                                readonly isEnabled: boolean;
                                • True if the Service Worker is enabled (supported by the browser and enabled via ServiceWorkerModule).

                                property messages

                                readonly messages: any;
                                • Emits the payloads of the received push notification messages.

                                property notificationClicks

                                readonly notificationClicks: any;
                                • Emits the payloads of the received push notification messages as well as the action the user interacted with. If no action was used the action property contains an empty string ''.

                                  Note that the notification property does **not** contain a [Notification][Mozilla Notification] object but rather a [NotificationOptions](https://notifications.spec.whatwg.org/#dictdef-notificationoptions) object that also includes the title of the [Notification][Mozilla Notification] object.

                                  [Mozilla Notification]: https://developer.mozilla.org/en-US/docs/Web/API/Notification

                                property subscription

                                readonly subscription: any;
                                • Emits the currently active [PushSubscription](https://developer.mozilla.org/en-US/docs/Web/API/PushSubscription) associated to the Service Worker registration or null if there is no subscription.

                                method requestSubscription

                                requestSubscription: (options: {
                                serverPublicKey: string;
                                }) => Promise<PushSubscription>;
                                • Subscribes to Web Push Notifications, after requesting and receiving user permission.

                                  Parameter options

                                  An object containing the serverPublicKey string.


                                  A Promise that resolves to the new subscription object.

                                method unsubscribe

                                unsubscribe: () => Promise<void>;
                                • Unsubscribes from Service Worker push notifications.


                                  A Promise that is resolved when the operation succeeds, or is rejected if there is no active subscription or the unsubscribe operation fails.

                                class SwRegistrationOptions

                                abstract class SwRegistrationOptions {}
                                • Token that can be used to provide options for ServiceWorkerModule outside of ServiceWorkerModule.register().

                                  You can use this token to define a provider that generates the registration options at runtime, for example via a function call:

                                property enabled

                                enabled?: boolean;
                                • Whether the ServiceWorker will be registered and the related services (such as SwPush and SwUpdate) will attempt to communicate and interact with it.

                                  Default: true

                                property registrationStrategy

                                registrationStrategy?: string | (() => any);
                                • Defines the ServiceWorker registration strategy, which determines when it will be registered with the browser.

                                  The default behavior of registering once the application stabilizes (i.e. as soon as there are no pending micro- and macro-tasks) is designed to register the ServiceWorker as soon as possible but without affecting the application's first time load.

                                  Still, there might be cases where you want more control over when the ServiceWorker is registered (for example, there might be a long-running timeout or polling interval, preventing the app from stabilizing). The available option are:

                                  - registerWhenStable:<timeout>: Register as soon as the application stabilizes (no pending micro-/macro-tasks) but no later than <timeout> milliseconds. If the app hasn't stabilized after <timeout> milliseconds (for example, due to a recurrent asynchronous task), the ServiceWorker will be registered anyway. If <timeout> is omitted, the ServiceWorker will only be registered once the app stabilizes. - registerImmediately: Register immediately. - registerWithDelay:<timeout>: Register with a delay of <timeout> milliseconds. For example, use registerWithDelay:5000 to register the ServiceWorker after 5 seconds. If <timeout> is omitted, is defaults to 0, which will register the ServiceWorker as soon as possible but still asynchronously, once all pending micro-tasks are completed. - An [Observable](guide/observables) factory function: A function that returns an Observable. The function will be used at runtime to obtain and subscribe to the Observable and the ServiceWorker will be registered as soon as the first value is emitted.

                                  Default: 'registerWhenStable:30000'

                                property scope

                                scope?: string;
                                • A URL that defines the ServiceWorker's registration scope; that is, what range of URLs it can control. It will be used when calling [ServiceWorkerContainer#register()](https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerContainer/register).

                                class SwUpdate

                                class SwUpdate {}
                                • Subscribe to update notifications from the Service Worker, trigger update checks, and forcibly activate updates.

                                  See Also


                                constructor(sw: ɵangular_packages_service_worker_service_worker_a);

                                  property activated

                                  readonly activated: any;
                                  • Emits an UpdateActivatedEvent event whenever the app has been updated to a new version.

                                  property available

                                  readonly available: any;
                                  • Emits an UpdateAvailableEvent event whenever a new app version is available.

                                  property isEnabled

                                  readonly isEnabled: boolean;
                                  • True if the Service Worker is enabled (supported by the browser and enabled via ServiceWorkerModule).

                                  property unrecoverable

                                  readonly unrecoverable: any;
                                  • Emits an UnrecoverableStateEvent event whenever the version of the app used by the service worker to serve this client is in a broken state that cannot be recovered from without a full page reload.

                                  method activateUpdate

                                  activateUpdate: () => Promise<void>;

                                    method checkForUpdate

                                    checkForUpdate: () => Promise<void>;


                                      interface UnrecoverableStateEvent

                                      interface UnrecoverableStateEvent {}
                                      • An event emitted when the version of the app used by the service worker to serve this client is in a broken state that cannot be recovered from and a full page reload is required.

                                        For example, the service worker may not be able to retrieve a required resource, neither from the cache nor from the server. This could happen if a new version is deployed to the server and the service worker cache has been partially cleaned by the browser, removing some files of a previous app version but not all.

                                        See Also

                                      property reason

                                      reason: string;

                                        property type

                                        type: 'UNRECOVERABLE_STATE';

                                          interface UpdateActivatedEvent

                                          interface UpdateActivatedEvent {}
                                          • An event emitted when a new version of the app has been downloaded and activated.

                                            See Also

                                          property current

                                          current: {
                                          hash: string;
                                          appData?: Object;

                                            property previous

                                            previous?: {
                                            hash: string;
                                            appData?: Object;

                                              property type

                                              type: 'UPDATE_ACTIVATED';

                                                interface UpdateAvailableEvent

                                                interface UpdateAvailableEvent {}
                                                • An event emitted when a new version of the app is available.

                                                  See Also

                                                property available

                                                available: {
                                                hash: string;
                                                appData?: Object;

                                                  property current

                                                  current: {
                                                  hash: string;
                                                  appData?: Object;

                                                    property type

                                                    type: 'UPDATE_AVAILABLE';

                                                      Package Files (1)

                                                      Dependencies (1)

                                                      Dev Dependencies (0)

                                                      No dev dependencies.

                                                      Peer Dependencies (2)


                                                      To add a badge like this onejsDocs.io badgeto your package's README, use the codes available below.

                                                      You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/@angular/service-worker.

                                                      • Markdown
                                                      • HTML
                                                        <a href="https://www.jsdocs.io/package/@angular/service-worker"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>