21

É possível limpar o cache dos navegadores Firefox e Chrome via JavaScript? Com o Internet Explorer já consigo, mas não os citados acima.

Cara, não deu certo, creio que o problema ocorre porque salvo o usuario logado no remember-me ... mas, o problema ocorre só quando eu fecho o browser, se clico em sair funciona normalmente.

Você já viu algo parecido?

Se o usuário marcar o check box lembra eu adiciono um cookie:

if (model.RememberMe)
 {
     Response.Cookies["SistemaLeilao"].Value = model.UserName;
     Response.Cookies["SistemaLeilao"].Expires = DateTime.Now.AddMinutes(5);
 }

Quando clica no sair e o logoff é feito, funciona filé, mas quando fecha a janela do browser sem fazer o logoff fica tudo gravado, e isso que ta me atrapalhando.

4
  • 3
    Eu só não estou surpreso que você consiga limpar o cache do IE via JS porque, afinal de contas, segurança nunca foi o ponto forte do IE. Commented 10/06/2014 às 12:42
  • window.onunload
    – pnet
    Commented 10/06/2014 às 12:59
  • 2
    A resposta é perfeita, fala a realidade, a pergunta e a afirmação estão completamente enganados.
    – user6026
    Commented 10/06/2014 às 13:14
  • Só quis ajudar a um amigo. A pergunta foi pra ele. Não é justificativa isso não, apenas me apoiei na dúvida dele que agora entendi que era minha também. Mas valeu a todos.
    – pnet
    Commented 10/06/2014 às 13:45

5 Respostas 5

36

Não é possível, e se fosse seria uma enorme falha de segurança, pensou conseguir limpar o cache de qualquer pessoa que acessasse sua página?

O que você pode fazer é indicar para o navegador não fazer cache da sua página, isso pode ser feito utilizando uma dessas meta tags:

<meta http-equiv="cache-control" content="max-age=0" />
<meta http-equiv="cache-control" content="no-cache" />
<meta http-equiv="expires" content="0" />
<meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
<meta http-equiv="pragma" content="no-cache" />
5
  • 4
    Parabéns pela resposta ...
    – user6026
    Commented 10/06/2014 às 13:15
  • Cara, não deu certo, creio que o problema ocorre porque salvo o usuario logado no remember-me ... mas, o problema ocorre só quando eu fecho o browser, se clico em sair funciona normalmente. Você já viu algo parecido?
    – pnet
    Commented 10/06/2014 às 17:45
  • Você está trabalhando com sessão? O que você quer fazer?
    – Laerte
    Commented 10/06/2014 às 17:47
  • Se o usuário marcar o check box lembra eu adiciono um cookie: if (model.RememberMe) { Response.Cookies["SistemaLeilao"].Value = model.UserName; Response.Cookies["SistemaLeilao"].Expires = DateTime.Now.AddMinutes(5); } Quando clica no sair e o logoff é feito, funciona filé, mas quando fecha a janela do browser sem fazer o logoff fica tudo gravado, e isso que ta me atrapalhando.
    – pnet
    Commented 10/06/2014 às 18:17
  • 1
    @pnet Talvez seja melhor usar SessionStorage em vez de um cookie então.
    – bfavaretto
    Commented 10/06/2014 às 18:20
5

Como dito nesta resposta do Stack-EN, você pode usar:

window.location.reload(true)

para forçar o navegador a recarregar os JS/CSS para a sua página apenas. Limpar o cache do navegador todo não é possível.

2

Impedir o browser de utilizar o cache não me pareceu uma boa, pelo menos no meu cenário, então procurando por uma solução para esta questão, vi muitas pessoas utilizando o formato a seguir:

<link rel="stylesheet" type="text/css" href="meu.css?v=<?=filemtime($file);?>">

Porém no cenário que trabalho, cada vez que o sistema é atualizado no servidor, os arquivos que não foram alterados também são sobrescritos, alterando assim sua data de modificação, forçando o browser a fazer o download do asset mesmo que ele não tenha sido modificado, o que acho bem ineficiente, visto que o uso do cache fica prejudicado.

A solução que encontrei para fazer isso somente se o arquivo foi alterado, é utilizar uma função de hash, o que só vai alterar o hash se o conteúdo do arquivo for de fato modificado.

<link rel="stylesheet" type="text/css" href="meu.css?v=<?=hash_file('md5', $file);?>">

Estou utilizando tanto para arquivos .js quanto para .css, foi o que achei melhor, pois se o arquivo não foi alterado, é melhor deixar o cache trabalhar, caso contrário, o navegador irá fazer novamente o download do asset.

1

Bom, o cache é um importante balanceador de carga e consumo de banda larga, não aconselho como membro do SOpt você utilizar a solução do @Laerte em todos os casos, cada caso deve ser estudado.

Imagine se sua página tivesse fotos de 500 Kb cada, e você quisesse exibir elas sempre em tamanho original, por exemplo, uma galeria de uma rede social. Sempre que o usuário logar na rede social e acessar a sua galeria, seria necessário o browser solicitar essa foto de 500 Kb ( bem como as demais ) já que você teria "feito o navegador não fazer cache da sua página". Se você tivesse deixado o cache armazenar essas imagens (localmente) seria muito mais rápido o carregamento do site e menor o consumo de banda.

Uma solução, quando você quer forçar algo ser constantemente atualizado e baixado (atualizado no cache), é criar um src de referências a .CSS, .JS, imagens, colocar uma variável via GET atualizada com um valor aleatório (rand). Essa também é uma solução do SOen como citou @user7261.

Apresentei uma solução semelhante aqui: Tratar cache com AngularJS

1
  • Também acho uma boa usar assim ?...., mas não precisa de rand() o legal seria usar um versionamento.
    – Syzoth
    Commented 24/02/2016 às 14:39
-2

Aplicações Estáticas ou com cache imutável segundo a especificação RFC8246:

Acrescentar o código abaixo, no inicio da tag "<head>"

<meta name="Cache-Control" content="no-cache">

Alternativamente, usar:

<meta name="Cache-Control" content="max-age=0,must-revalidate">

Aplicações Dinamicas:

As respostas são mentirosas, eu poderia usar um termo mais bonitinho "equivocado", mas sem motivo aparente, são incorretas, principalmente no tocante a "ser impossível" e ainda o parabenizam por uma gambiarra, sim, é gambiarra, pelo que vi no console, versionar não faz absolutamente nada, inclusive, não precisa versionar, basta recarregar a pagina duas vezes seguidas que o próprio navegador verá se existem alterações, eu não achei o que procurava por aqui, mas vou deixar um simples código que eu criei, com base na própria documentação oficial que mostra como se faz: https://developer.mozilla.org/en-US/docs/Web/API/Cache/delete.

Passo 1: Primeiramente, acesse o seu site, abra o console (F12), na parte superior, localize o menu: "Aplicativo", "Application" ou "Applications", clique sobre ele, agora, no menu lateral, localize "Cache", clique em "Armazenamento em cache" ou "Cache storage". (o que vier primeiro)

[1]: https://i.sstatic.net/iRvdX.png

Anote o nome que você vê por lá, no meu caso: "devsite.pwa_RUNTIME_V3", se não aparecer nada, o seu problema é outro, deve ser com um proxy ou outro intermediador qualquer.

Passo 2: Agora crie um Cookie para todos os usuários que acessarem o seu site, use o nome de "version" e valor "2.0", nada de criptografar, deixe isso para depois, deve ser um cookie comum.

Passo 3: Recorte o seu script e coloque dentro do "else" abaixo, altere "devsite.pwa_RUNTINE_V3" para o nome que você anotou no passo 1, além disso, altere "/assets/css/style.css" para o caminho dos arquivos ou imagens que você deseja atualizar, incluindo o arquivo que você colocará esse código, salve o arquivo, limpe o cache do seu navegador e atualize a pagina.

console.info('script:', 'verificar versão...');
function verify(code){var cookiestring=RegExp(code+"=[^;]+").exec(document.cookie); return decodeURIComponent(!!cookiestring ? cookiestring.toString().replace(/^[^=]+./,"") : "");}

if(verify('version') !== '2.1'){
caches.open('devsite.pwa_RUNTINE_V3').then(function(cache) {
  cache.delete('/assets/css/style.css');
  cache.delete('/assets/js/script.js');
})
localStorage.clear();
console.info('script:', 'confirme a atualização.');
alert("Portuguese: Precisamos atualizar a página, esta é uma versão antiga.\n English: We need to update the page, you are on an old version.\n Español: Necesitamos actualizar la página, estás en una versión anterior.");
console.info('script:', 'recarregando...');
location.reload(true);
} else {
//cole o script aqui.
    }

Se tudo der certo e provavelmente dará, você verá um Alert, não clique em "ok", primeiro altere o valor do cookie que você criou no passo 2, para "2.1", agora sim você pode clicar em "ok", a pagina será recarregada automaticamente e seu cache será limpo.

De nada.


Exemplo de como limpar o cache no Logout

<button class="reset">Sair</button>
<script
  src="https://code.jquery.com/jquery-3.5.1.min.js"
  integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0="
  crossorigin="anonymous"></script>
<script>
$(".reset").click(function(){
    caches.open('devsite.pwa_RUNTINE_V3').then(function(cache) {
      cache.delete('/assets/css/style.css');
      cache.delete('/assets/js/script.js');
      cache.delete('/dashboard.html'); //nome e local correto do arquivo
    })
    localStorage.clear();
})
</script>
7
  • Poderia completar sua resposta mostrando qual é a relação entre a Web API Cache que utilizou na sua resposta com o cache interno do navegador, que é o foco da pergunta? Isso não ficou claro.
    – Woss
    Commented 12/02/2021 às 18:49
  • @Woss 10, não tem cache interno nenhum na forma que você se refere, a minha solução segue um caminho semelhante ao já apresentado pela Google em: developers.google.com/web/tools/chrome-devtools/manage-data/…, além disso, o problema dele pode ser resolvido com html: developer.mozilla.org/pt-BR/docs/Web/HTTP/Headers/Cache-Control, não há nada de complexo aqui. Commented 12/02/2021 às 19:07
  • Então não entendi. Se o problema da pergunta pode ser resolvido com o cabeçalho Cache-Control, qual é a relação com a API Cache? No próprio MDN é citado que a API Cache não segue os padrões dos cabeçalhos de cache.
    – Woss
    Commented 12/02/2021 às 19:12
  • São duas formas de resolver a questão, ali, além da api de cache, limpa também a storage, além disso, é usado a "location.reload(true);", o que faz com que o navegador ignore o cache e carregue novos arquivos, tudo que ele informou é que não deseja o seu painel de controle em cache, você fez complementos que não estão na pergunta, o "cache interno do navegador". Commented 12/02/2021 às 19:22
  • Inclusive é uma duplicata desta: pt.stackoverflow.com/questions/68382/…, porem, perguntada de outra forma, a solução buscada é a mesma. Commented 12/02/2021 às 19:27

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .