Oi, Eduardo! Como vai?
No Service Worker, os caches podem continuar existindo no navegador, mesmo que você reinicie o servidor ou apague a pasta dist. Isso acontece porque o cache (e o próprio service worker) ficam armazenados no browser, e não no servidor.
Por que os caches antigos continuam?
- O navegador mantém várias versões de cache, até que um service worker novo seja ativado e rode uma rotina de limpeza.
- Reiniciar servidor / apagar
dist não remove caches do Chrome/Firefox. - A “pasta”/entrada
runtime-caching pode continuar aparecendo porque o service worker já foi registrado e ainda está controlando a página.
Siga esses passos para resolver
1) Remova o Service Worker e limpe os caches pelo DevTools
No Chrome:
- Abra
DevTools → Application - Vá em Service Workers → clique em Unregister
- Em Storage → marque Cache storage e clique em Clear site data
- Recarregue a página com Hard Reload (Ctrl+Shift+R)
Isso força o navegador a parar de usar o service worker antigo e apaga os caches salvos.
2) Garanta que seu SW limpa caches antigos (quando você versionar)
No seu service worker, você pode ter uma limpeza por “nome de cache”.
Veja este exemplo:
// codigo sem acentuacao
const CACHE_ATUAL = 'meu-cache-v2';
self.addEventListener('activate', (event) => {
event.waitUntil(
caches.keys().then((keys) => {
return Promise.all(
keys
.filter((key) => key !== CACHE_ATUAL)
.map((key) => caches.delete(key))
);
})
);
});
O que esse código faz:
- Quando o service worker ativa, ele lista todos os caches (
caches.keys()), - Apaga todos que não são o
CACHE_ATUAL, - Mantém só o cache da versão atual.
3) Teste corretamente (modo “novo”)
Depois de limpar:
- Abra novamente Application → Cache Storage
- Recarregue a página
- Veja se só o cache atual aparece (ex.:
meu-cache-v2)
Exemplo extra: criando o pre-cache simples
const CACHE_ATUAL = 'meu-cache-v2';
const ARQUIVOS = ['/', '/index.html'];
self.addEventListener('install', (event) => {
event.waitUntil(
caches.open(CACHE_ATUAL).then((cache) => cache.addAll(ARQUIVOS))
);
});
O que esse código faz:
- No
install, cria/abre o cache atual e salva os arquivos da lista (ARQUIVOS).
Se mesmo após Unregister + Clear site data o runtime-caching “persistir”, o ponto mais comum é: você ainda está abrindo a página em um domínio/porta onde o SW antigo ficou registrado (ex.: localhost:5173 vs localhost:4173). Limpar os dados do site certo resolve.
Espero ter ajudado. Conte com o apoio do Fórum na sua jornada. Fico à disposição.
Abraços e bons estudos!
Caso este post tenha lhe ajudado, por favor, marcar como solucionado
