angular - Workbox Background Sync envia 2 solicitações para o servidor quando online em vez de uma
Estou construindo um projeto PWA muito simples com Workbox e Angular. O projeto é sobre criar um aplicativo que funcione offline e online, usando a biblioteca Workbox. De acordo com a documentação do Workbox aqui, o código a seguir deveria ter funcionado:
const queue = new Queue('myQueue');
self.addEventListener('fetch', (event) => {
// Clone the request to ensure it's safe to read when
// adding to the Queue.
const promiseChain = fetch(event.request.clone())
.catch((err) => {
return queue.pushRequest({request: event.request});
});
event.waitUntil(promiseChain);
return promiseChain;
});
mas não aconteceu, em vez disso, se eu desconectar o servidor (rodando no localhost), como sugerido na documentação oficial, a requisição é armazenada corretamente no IndexedDb, então quando o servidor está ativo e a fila é sincronizada, ela faz a requisição corretamente para o servidor. O problema é quando faço uma requisição enquanto estou online, ela envia 2 requisições para o servidor.
Eu também tentei isto:
const bgSyncPlugin = new BackgroundSyncPlugin('myQueueName', {
maxRetentionTime: 24 * 60 // Retry for max of 24 Hours (specified in minutes)
});
registerRoute(
/\/api\/reports/,
new NetworkOnly({
plugins: [bgSyncPlugin]
}),
'POST'
);
mas por algum motivo, dessa forma, a solicitação nem chega a ser adicionada à fila.
Apesar disso, ambos os modos ainda mostram um erro no console:
POST http://localhost:3000/api/reports net::ERR_CONNECTION_REFUSED
Se ajudar, o projeto está no GitHub.