núcleo da caixa de trabalho

O Workbox foi criado para ser modular, permitindo que os desenvolvedores selecionem as partes que querem usar sem precisar fazer o download de tudo em um único arquivo.

No entanto, há sobreposição entre os módulos. Por exemplo, cada módulo precisa interagir com o console, gerar erros significativos e usar a rede ou o cache. Para evitar que cada módulo implemente a mesma lógica, workbox-core contém esse código comum em que cada módulo depende.

Esse módulo oferece algumas funcionalidades aos desenvolvedores, mas, além dos níveis de registro e do armazenamento em cache, workbox-core oferece lógica interna para cada módulo, em vez do desenvolvedor final.

Conferir e alterar os nomes de cache padrão

O Workbox define os caches usando cacheNames:

import {cacheNames} from 'workbox-core';

console.log(cacheNames.precache);
console.log(cacheNames.runtime);
console.log(cacheNames.googleAnalytics);

Esses nomes de cache são criados no formato de um prefixo, um nome e um sufixo, em que o nome muda com base no uso do cache.

<prefix>-<cache-id>-<suffix>

É possível mudar esses nomes padrão alterando todos ou alguns dos valores transmitidos para setCacheNameDetails().

import {cacheNames, setCacheNameDetails} from 'workbox-core';

setCacheNameDetails({
  prefix: 'my-app',
  suffix: 'v1',
  precache: 'install-time',
  runtime: 'run-time',
  googleAnalytics: 'ga',
});

// Will print 'my-app-install-time-v1'
console.log(cacheNames.precache);

// Will print 'my-app-run-time-v1'
console.log(cacheNames.runtime);

// Will print 'my-app-ga-v1'
console.log(cacheNames.googleAnalytics);

O caso de uso principal para o prefixo e o sufixo é que, se você usar o Workbox para vários projetos e usar a mesma porta localhost para cada projeto, definir um prefixo personalizado para cada módulo vai impedir que os caches entrem em conflito uns com os outros.

Declaração de clientes

Alguns desenvolvedores querem publicar um novo service worker e fazer com que ele controle páginas da Web já abertas assim que for ativado, o que não acontece por padrão.

Se você quiser esse comportamento, workbox-core oferece um método auxiliar:

import {clientsClaim} from 'workbox-core';

// This clientsClaim() should be at the top level
// of your service worker, not inside of, e.g.,
// an event handler.
clientsClaim();

O método clientsClaim() em workbox-core adiciona automaticamente um listener de evento activate ao service worker e, dentro dele, chama self.clients.claim(). Chamar self.clients.claim() antes que o worker de serviço atual seja ativado vai levar a uma exceção de tempo de execução. O wrapper de workbox-core ajuda a garantir que você o chame no momento certo.

O wrapper skipWaiting foi descontinuado

Antes da Workbox v6, os desenvolvedores também eram incentivados a usar o método skipWaiting() do workbox-core. No entanto, esse método oferecia pouco valor além do que os desenvolvedores teriam se chamassem self.skipWaiting() explicitamente.

Como o wrapper workbox-core legado também registrava um manipulador de eventos install em que self.skipWaiting() era chamado, o wrapper não se comportava como esperado se fosse chamado dentro de outro manipulador de eventos, como message, depois que a instalação já tivesse sido concluída.

Por esses motivos, o skipWaiting() do workbox-core foi descontinuado, e os desenvolvedores precisam chamar o self.skipWaiting() diretamente. Ao contrário de self.clients.claim(), self.skipWaiting() não gera uma exceção se for chamado no momento "errado". Portanto, não é necessário envolvê-lo em um manipulador de eventos.

Tipos

CacheDidUpdateCallback()

workbox-core.CacheDidUpdateCallback(
  param: CacheDidUpdateCallbackParam,
)

Parâmetros

Retorna

  • Promise<void>

CacheDidUpdateCallbackParam

Propriedades

  • cacheName

    string

  • evento

    ExtendableEvent

  • newResponse

    Resposta

  • oldResponse

    Resposta opcional

  • solicitação

    Solicitação

  • estado

    MapLikeObject opcional

CachedResponseWillBeUsedCallback()

workbox-core.CachedResponseWillBeUsedCallback(
  param: CachedResponseWillBeUsedCallbackParam,
)

Parâmetros

Retorna

  • Promise<void | Response>

CachedResponseWillBeUsedCallbackParam

Propriedades

  • cacheName

    string

  • cachedResponse

    Resposta opcional

  • evento

    ExtendableEvent

  • matchOptions

    CacheQueryOptions opcional

  • solicitação

    Solicitação

  • estado

    MapLikeObject opcional

CacheKeyWillBeUsedCallback()

workbox-core.CacheKeyWillBeUsedCallback(
  param: CacheKeyWillBeUsedCallbackParam,
)

Parâmetros

Retorna

  • Promise<string | Request>

CacheKeyWillBeUsedCallbackParam

Propriedades

  • evento

    ExtendableEvent

  • modo

    string

  • params

    qualquer opcional

  • solicitação

    Solicitação

  • estado

    MapLikeObject opcional

CacheWillUpdateCallback()

workbox-core.CacheWillUpdateCallback(
  param: CacheWillUpdateCallbackParam,
)

Parâmetros

Retorna

  • Promise<void | Response>

CacheWillUpdateCallbackParam

Propriedades

  • evento

    ExtendableEvent

  • solicitação

    Solicitação

  • resposta

    Resposta

  • estado

    MapLikeObject opcional

FetchDidFailCallback()

workbox-core.FetchDidFailCallback(
  param: FetchDidFailCallbackParam,
)

Parâmetros

Retorna

  • Promise<void>

FetchDidFailCallbackParam

Propriedades

  • erro

    Erro

  • evento

    ExtendableEvent

  • originalRequest

    Solicitação

  • solicitação

    Solicitação

  • estado

    MapLikeObject opcional

FetchDidSucceedCallback()

workbox-core.FetchDidSucceedCallback(
  param: FetchDidSucceedCallbackParam,
)

Parâmetros

Retorna

  • Promise<Response>

FetchDidSucceedCallbackParam

Propriedades

  • evento

    ExtendableEvent

  • solicitação

    Solicitação

  • resposta

    Resposta

  • estado

    MapLikeObject opcional

HandlerCallbackOptions

Enumeração

RouteHandlerCallbackOptions

ManualHandlerCallbackOptions

HandlerDidCompleteCallback()

workbox-core.HandlerDidCompleteCallback(
  param: HandlerDidCompleteCallbackParam,
)

Parâmetros

Retorna

  • Promise<void>

HandlerDidCompleteCallbackParam

Propriedades

  • erro

    Erro opcional

  • evento

    ExtendableEvent

  • solicitação

    Solicitação

  • resposta

    Resposta opcional

  • estado

    MapLikeObject opcional

HandlerDidErrorCallback()

workbox-core.HandlerDidErrorCallback(
  param: HandlerDidErrorCallbackParam,
)

Parâmetros

Retorna

  • Promise<Response>

HandlerDidErrorCallbackParam

Propriedades

  • erro

    Erro

  • evento

    ExtendableEvent

  • solicitação

    Solicitação

  • estado

    MapLikeObject opcional

HandlerDidRespondCallback()

workbox-core.HandlerDidRespondCallback(
  param: HandlerDidRespondCallbackParam,
)

Parâmetros

Retorna

  • Promise<void>

HandlerDidRespondCallbackParam

Propriedades

  • evento

    ExtendableEvent

  • solicitação

    Solicitação

  • resposta

    Resposta opcional

  • estado

    MapLikeObject opcional

HandlerWillRespondCallback()

workbox-core.HandlerWillRespondCallback(
  param: HandlerWillRespondCallbackParam,
)

Parâmetros

Retorna

  • Promise<Response>

HandlerWillRespondCallbackParam

Propriedades

  • evento

    ExtendableEvent

  • solicitação

    Solicitação

  • resposta

    Resposta

  • estado

    MapLikeObject opcional

HandlerWillStartCallback()

workbox-core.HandlerWillStartCallback(
  param: HandlerWillStartCallbackParam,
)

Parâmetros

Retorna

  • Promise<void>

HandlerWillStartCallbackParam

Propriedades

  • evento

    ExtendableEvent

  • solicitação

    Solicitação

  • estado

    MapLikeObject opcional

ManualHandlerCallback()

workbox-core.ManualHandlerCallback(
  options: ManualHandlerCallbackOptions,
)

O callback "handler" é invocado sempre que um Router corresponde a um URL/solicitação a um Route pelo RouteMatchCallback. Esse callback do gerenciador precisa retornar um Promise que seja resolvido com um Response.

Se uma matriz ou um objeto não vazio for retornado pelo RouteMatchCallback, ele será transmitido como o argumento options.params desse gerenciador.

Parâmetros

Retorna

  • Promise<Response>

ManualHandlerCallbackOptions

Opções transmitidas para uma função ManualHandlerCallback.

Propriedades

  • evento

    ExtendableEvent

  • solicitação

    string | Request

MapLikeObject

PluginState

Por enquanto, estamos usando um MapLikeObject simples, mas podemos estender/restringir isso no futuro.

Tipo

MapLikeObject

RequestWillFetchCallback()

workbox-core.RequestWillFetchCallback(
  param: RequestWillFetchCallbackParam,
)

Parâmetros

Retorna

  • Promise<Request>

RequestWillFetchCallbackParam

Propriedades

  • evento

    ExtendableEvent

  • solicitação

    Solicitação

  • estado

    MapLikeObject opcional

RouteHandler

RouteHandlerCallback ou RouteHandlerObject. A maioria das APIs em workbox-routing que aceitam gerenciadores de rota aceitam qualquer uma das opções.

Enumeração

RouteHandlerCallback

RouteHandlerObject

RouteHandlerCallback()

workbox-core.RouteHandlerCallback(
  options: RouteHandlerCallbackOptions,
)

O callback "handler" é invocado sempre que um Router corresponde a um URL/solicitação para um Route pelo RouteMatchCallback. Esse callback do gerenciador precisa retornar um Promise que seja resolvido com um Response.

Se uma matriz ou um objeto não vazio for retornado pelo RouteMatchCallback, ele será transmitido como o argumento options.params desse gerenciador.

Parâmetros

Retorna

  • Promise<Response>

RouteHandlerCallbackOptions

Opções transmitidas para uma função RouteHandlerCallback.

Propriedades

  • evento

    ExtendableEvent

  • params

    string[] | MapLikeObject opcional

  • solicitação

    Solicitação

  • url

    URL

RouteHandlerObject

Um objeto com um método handle do tipo RouteHandlerCallback.

Um objeto Route pode ser criado com uma função RouteHandlerCallback ou com este objeto RouteHandler. A vantagem do RouteHandler é que ele pode ser estendido (como é feito pelo pacote workbox-strategies).

Propriedades

RouteMatchCallback()

workbox-core.RouteMatchCallback(
  options: RouteMatchCallbackOptions,
)

O callback "match" é usado para determinar se um Route precisa ser aplicado a um URL e uma solicitação específicos. Quando a correspondência ocorre em resposta a um evento de busca do cliente, o objeto event também é fornecido. No entanto, como o callback de correspondência pode ser invocado fora de um evento de busca, a lógica de correspondência não pode presumir que o objeto event estará sempre disponível. Se o callback de correspondência retornar um valor verdadeiro, o RouteHandlerCallback da rota correspondente será invocado imediatamente. Se o valor retornado for uma matriz ou um objeto não vazio, esse valor será definido no argumento options.params do gerenciador.

Parâmetros

Retorna

  • qualquer um

RouteMatchCallbackOptions

Opções transmitidas para uma função RouteMatchCallback.

Propriedades

  • evento

    ExtendableEvent

  • solicitação

    Solicitação

  • sameOrigin

    booleano

  • url

    URL

WorkboxPlugin

Um objeto com propriedades de callback de ciclo de vida opcionais para as operações de busca e cache.

Propriedades

WorkboxPluginCallbackParam

Propriedades

Propriedades

cacheNames

Receba os nomes de cache atuais e o prefixo/sufixo usados pelo Workbox.

cacheNames.precache é usado para recursos pré-armazenados em cache, cacheNames.googleAnalytics é usado por workbox-google-analytics para armazenar analytics.js, e cacheNames.runtime é usado para tudo o mais.

cacheNames.prefix pode ser usado para extrair apenas o valor atual do prefixo. cacheNames.suffix pode ser usado para extrair apenas o valor do sufixo atual.

Tipo

objeto

Propriedades

  • googleAnalytics

    string

  • pré-cache

    string

  • prefixo

    string

  • runtime

    string

  • sufixo

    string

Métodos

clientsClaim()

workbox-core.clientsClaim()

Reivindicar todos os clientes disponíveis quando o service worker ficar ativo. Ele normalmente é usado em conjunto com skipWaiting().

copyResponse()

workbox-core.copyResponse(
  response: Response,
  modifier?: function,
)

Permite que os desenvolvedores copiem uma resposta e modifiquem os valores headers, status ou statusText (os valores configuráveis por um objeto [ResponseInit]https://developer.mozilla.org/en-US/docs/Web/API/Response/Response#Syntax no construtor). Para modificar esses valores, transmita uma função como o segundo argumento. Essa função será invocada com um único objeto com as propriedades de resposta {headers, status, statusText}. O valor de retorno dessa função será usado como o ResponseInit para o novo Response. Para mudar os valores, modifique e retorne os parâmetros transmitidos ou retorne um objeto totalmente novo.

Esse método é intencionalmente limitado a respostas de mesma origem, independentemente de se o CORS foi usado ou não.

Parâmetros

  • resposta

    Resposta

  • modificador

    função opcional

    O parâmetro modifier tem este formato: 

    (responseInit: ResponseInit) => ResponseInit

    • responseInit

      ResponseInit

    • retorna

      ResponseInit

Retorna

  • Promise<Response>

registerQuotaErrorCallback()

workbox-core.registerQuotaErrorCallback(
  callback: Function,
)

Adiciona uma função ao conjunto de quotaErrorCallbacks que será executada se houver um erro de cota.

Parâmetros

  • callback

    Função

setCacheNameDetails()

workbox-core.setCacheNameDetails(
  details: PartialCacheNameDetails,
)

Modifica os nomes de cache padrão usados pelos pacotes do Workbox. Os nomes do cache são gerados como <prefix>-<Cache Name>-<suffix>.

Parâmetros

  • detalhes

    PartialCacheNameDetails

skipWaiting()

workbox-core.skipWaiting()

Esse método foi descontinuado e será removido na v7 do Workbox.

Chamar self.skipWaiting() é equivalente e precisa ser usado.