Como forçar uma recarga forçada no Chrome para Android

207

No Chrome para desktop, tenho opções nas ferramentas de desenvolvimento para desativar o cache completamente quando as ferramentas de desenvolvimento são abertas e tenho as opções para fazer uma recarga manual forte ao clicar muito tempo no botão recarregar (com as ferramentas de desenvolvimento abertas).

Existe alguma técnica para o Chrome para Android? Não encontrei nenhuma configuração. O que posso fazer quando quero forçar o navegador a baixar algum arquivo javascript ou css em vez de usar um em cache durante o desenvolvimento?

Riesling
fonte
Acabei de retornar para estender (o que havia sido) um aplicativo da web estável e descobri que isso estava acontecendo. Os dados mais recentes do estado são armazenados em um arquivo .js com um sufixo de URL do cache-buster. Isso não funciona mais no Chrome no Windows, ChromeOS ou Android.
Euan M
parece que uma atualização simples (clicando na seta w do círculo) detecta as alterações nos dias de hoje. sem truques. ... deixe-me saber se estou errado.
Ronnie Royston

Respostas:

168

Estou usando de window.location.reload(true)acordo com o MDN (e essa pergunta semelhante) força a página a ser recarregada do servidor.

Você pode executar esse código no navegador digitando javascript:location.reload(true)na barra de endereço.

Konrad Dzwinel
fonte
7
Basta digitá-lo na barra de endereços que antecede o código javascript:.
Konrad Dzwinel
4
Na verdade, você deve evitar window.parte. javascript:location.reload(true)deve fazer o truque.
Konrad Dzwinel
5
não funcionou para mim no cromo v55.0.2883.91 / android5.1.1
Kev
20
Ele não funciona no meu, v56.0.2924.87 no Android 7.1.1. Por que você pode simplesmente clicar em Atualizar e fazer o download do navegador como costumava funcionar? Tal aborrecimento ao tentar se desenvolver.
Scott Wilson
33
Eu abro uma janela em modo anônimo
Deepak Kamat 21/10
133

Visualizar a página no modo de navegação anônima desativará o cache. Era a única maneira de forçar uma atualização em uma folha de estilo sem limpar manualmente o cache pelas configurações.

Michael
fonte
2
@ Kev Nem para mim.
21717 Ricky Boyce
1
Sim, este é um trabalho para mim no Android 6.0.1 com o Chrome 59.
Avio
4
Isso funciona melhor do que a resposta aceita, pelo menos no Android 7.1.2 e Chrome 61. O cache é realmente agressivo de alguma forma. Mesmo o esvaziamento de arquivos em cache desse domínio não funcionou para mim.
Ogier Schelvis
Eu o uso com mais frequência, se não estiver funcionando para você, provavelmente o cache está no servidor e não no navegador.
Deepak Kamat
2
Ele limpará o cache no modo de navegação anônima somente na primeira vez. Depois disso, o mesmo problema aparece
Mara
75

Também uma opção:

  1. Cardápio
  2. Configurações
  3. Privacidade
  4. Limpar dados de navegação
  5. Marque "Cache" e pressione "CLEAR"

e recarregue a página.

checkmate711
fonte
1
Agora mudou para Clear Browsing Data, onde você pode marcar clear cacheusando a caixa de seleção.
shaijut 03/12/2015
1
Não, e então, MATE o Chrome, reinicie o Chrome e recarregue a página. Sim, ficou pior.
ADTC
4
Atualização: até matar o Chrome não funciona mais. Não faço idéia do que diabos está desmarcando a opção "Imagens e arquivos em cache". Ela ainda permanece no arquivo CSS em cache. Isso está ficando mais ridículo!
ADTC
1
Atualização: Veja a resposta de heidgert. A limpeza do cache ainda pode carregar o resultado "em cache" dos servidores do Google se o "Data Saver" estiver ativado nas configurações do Chrome.
ADTC
1
Isso limpará o cache de TODOS os sites, não apenas o inspecionado.
Obmerk Kronen
46

Você pode usar a opção Solicitar site da área de trabalho no menu do aplicativo (à direita da barra de endereço), que forçará o recarregamento da página.

Basta tocar nele, aguardar a atualização e desmarcar.

lucoweb
fonte
Trabalho confirmado no Chrome. Eu quase perdi essa resposta enquanto deslizava. Foram removidos os comentários sobre o Firefox para ajudar a próxima pessoa. Espero que isso não pareça conflitante com a intenção do autor .
Ishmaeel
1
Essa é de longe a melhor resposta para o desenvolvimento quando você obtém um arquivo css ou js bloqueado. Acho que geralmente a atualização funciona bem, mas às vezes, por algum motivo inexplicável, um arquivo js ou css fica preso, e essa é a única maneira de removê-lo que encontrei. Gostaria de poder dar mais de 1 voto positivo, lol, porque é uma solução tão fácil.
Lizardx
8
Este costumava trabalhar um back tempo, mas não mais em qualquer versão recente do Chrome a partir de dezembro de 2017.
Capagris
1
Isso funcionou para mim com o Chrome 2018 65.0.3325.109 no Samsung Android 5.1.1; Compilação SM-T900 / LMy47X. Ele tinha o benefício adicional de não destruir dados em cache (como localStoragevalores).
COD-REaD
1
Não funciona em abril de 2019. O Chrome 73+ não funciona.
SE ataca novamente Infelizmente,
31

Mencionando isso porque você mencionou "ao desenvolver".

Você pode controlar o dispositivo móvel através do navegador Chrome Desktop.

Visite chrome://inspect/#devicesna sua área de trabalho. E Inspecto dispositivo conectado à sua área de trabalho. Concorde quando solicitado.

Agora você deve ver uma janela de Devtool completa para a página atual no dispositivo móvel.

Agora, use o atalho de recarga forçada (Cmd + Shift + R) na área de trabalho para fazer a recarga forçada no dispositivo móvel!

Aakash Goel
fonte
3
esse comentário está desatualizado, mas me colocou no caminho certo. Você deve habilitar o telefone real para depuração via Chrome primeiro.
Deborah
Para obter instruções detalhadas sobre como habilitar a depuração USB em um telefone Android, consulte: stackoverflow.com/a/16707217/1024735 . E esse recurso é incrível para mais do que apenas a capacidade de recarga dura. Obrigado!
precisa saber é o seguinte
Para testar nos emuladores Android, Ctrl + Shift + R no devtools é muito bom e rápido. Não é possível ativar e desativar as configurações, etc. Obrigado.
Rainer Schwarze
21

Não se esqueça de verificar se a configuração "Reduzir o uso de dados" está desativada, pois parece fazer o download de dados em cache (dos servidores do Google?), Mesmo que o cache local esteja liberado.

Heidgert
fonte
1
Eu acho que essa configuração agora é chamada simplesmente de "Data Saver".
Bletch
19

Como redefinir todos os dados de um determinado URL / site no Chrome Mobile para Android:

1 - Abra o menu do Chrome e toque no ícone "i (informações)"

1

2 - toque em "Configurações do site"

dois

3 - Toque no ícone da lixeira

três

É isso mesmo, mesmo o trabalhador de serviço mais profundamente ensinado para esse URL agora morrerá.

yPhil
fonte
7
Isso não funciona no Chrome 73.0.3683.90 em um Samsung S9 +. Eu tentei isso mais de 15 vezes, bem como javascript: location.reload (true), e ele não funciona. Parece que os usuários do Android também não podem ser desenvolvedores, de acordo com Guug-Ul, senhor das trevas.
SE ataca novamente Infelizmente,
Funciona na minha nota 8 .. Mas eu tenho que atualizar a página depois.
Chris Cudmore
Você também pode obter esse menu clicando no ícone de cadeado (ou o que for exibido para conexões inseguras) à esquerda da URL.
Chris Cudmore
De longe a melhor solução! <3
bArraxas 16/06
12

Sei que essa é uma pergunta antiga, mas achei que a resposta aceita não funcionou para mim.

Uma solução alternativa seria para anexar o URL com um novo parâmetro URL, tal como website.com?a=1, website.com?a=2etc.

Se você já possui parâmetros, é claro, usaria um e comercial, ou seja, website.com?q=test&a=1

Banana Phobia
fonte
Isso funciona. Apenas ?aé suficiente se você quiser recarregar apenas uma vez.
Dan Dascalescu
11
Isso não é muito viável para recarregar arquivos de referência em cache (como CSS ou JS), pois você não pode editar o HTML principal para adicionar o ?a- é claro, a menos que você seja o host do site.
ADTC
7

A partir de 2018, na Central de Ajuda do Google (testada no Chrome 63):

  1. toque no menu de três pontos ;
  2. escolha Histórico> Limpar dados de navegação ;
  3. se necessário, escolha o período (acima da lista de verificação);
  4. desmarque todos os itens, exceto imagens e arquivos em cache ;
  5. prossiga com Limpar dados e confirme.

Como mencionado em outra resposta, as guias anônimas também são de grande utilidade para o desenvolvimento.

Skippy le Grand Gourou
fonte
Observe a etapa 3: escolha o período. Isso fez o truque para mim desde que eu estava tentando limpar as páginas em cache de três semanas atrás.
Dror 27/07
Não é sua culpa, mas esta é uma solução bastante terrível, pois limpa os dados de navegação de todos os outros sites também, o que é doloroso se você usar o navegador para algo diferente de trabalho de desenvolvimento!
GameKyuubi 28/01/19
@GameKyuubi Na verdade, se você selecionar dados da última hora, a dor será limitada. Mas é claro que esta solução é bastante pobre, eu só referenciado-lo porque é a oficial e faz trabalho (ao contrário de alguns outros).
Skippy le Grand Gourou
É isso que eu quero dizer, o fato de que esta é a solução oficial é absolutamente embaraçoso.
GameKyuubi
7

Encontrei uma solução que funciona, mas é feia.

  • Conecte o dispositivo Android ao seu PC com um cabo USB e abra o Chrome na área de trabalho .
  • Clique com o botão direito do mouse em qualquer lugar da página e selecione "Inspecionar".
  • Clique no menu de três pontos e selecione "Dispositivos remotos" no menu "Mais ferramentas":

    insira a descrição da imagem aqui

  • No painel que se abre, selecione seu dispositivo e, em seguida, o botão "Inspecionar" ao lado do nome da guia do seu telefone que precisa ser atualizada:

    insira a descrição da imagem aqui

  • Na janela que se abre, clique na guia "Rede" e marque a caixa de seleção "Desativar cache":

    insira a descrição da imagem aqui

  • Recarregue a página no seu telefone ou use o botão recarregar na janela do DevTools.

Nota: se o seu telefone não aparecer na lista de dispositivos:

  • verifique se a conexão USB está usando o modo Transferência de arquivos e não está simplesmente carregando
  • tente reiniciar o ADB ou execute adb devicespara verificar se o dispositivo está sendo detectado
Nathan Osman
fonte
1
solução incrível, isso funciona principalmente para "inspecionar" a página da Web do dispositivo diretamente na área de trabalho, e você também pode limpar o cache. Obrigado.
juanram0n
Esta é realmente a resposta mais bonita.
João
6

A Depuração Remota permite usar as ferramentas de desenvolvimento da área de trabalho:

https://developers.google.com/chrome-developer-tools/docs/remote-debugging

Swonkie
fonte
sim graças Eu sei que já - deveria ter mencionado isso, mas às vezes eu não quero ligá-lo, mas ainda tem essa opção
Riesling
2
Você pode limpar o cache desta forma: support.google.com/chrome/answer/2392709
Swonkie
5
Graças, uma opção sem limpar todo o cache para todos os sites seria bom embora
Riesling
Esta é a opção mais confiável quando você ativa Rede> Desativar cache
Rupert Rawnsley
6

Versões recentes do cache do Chrome de forma muito agressiva. Até técnicas de bloqueio de cache, como " http: // url? Updated = datecode ", pararam de funcionar. Você deve limpar o cache ou iniciar uma janela anônima todas as vezes (e garantir que a proteção de dados esteja desativada).

Greg Searle
fonte
Interessante, eu não estava ciente disso. Você tem alguma fonte que suporte essa reivindicação?
Antoine
2
Esse comportamento é apenas observado à medida que desenvolvo meus próprios aplicativos Javascript. Eu tive que especificar a diretiva CACHE-CONTROL: NO-CACHE no cabeçalho HTTP do meu servidor da web de desenvolvimento para não enlouquecer com bugs que simplesmente não desapareciam (porque o Chrome estava insistindo em armazenar em cache códigos antigos). O Firefox não exibe esse comportamento.
Greg Searle
4

A única maneira confiável que eu descobri que não requer a conexão do telefone a um PC é a seguinte:

1. Force parar o aplicativo Chrome.

Isso deve ser feito primeiro e você não poderá reabrir o Chrome até concluir essas etapas. Existem várias maneiras de forçar a parada. A maioria dos lançadores domésticos permite acessar "Informações do aplicativo" mantendo o dedo no ícone do Chrome e selecionando um ícone "i". Como alternativa, você pode acessar as configurações do Android e simplesmente procurar "Chrome".

Uma vez em "Informações do aplicativo", selecione "Forçar parada", como mostrado abaixo:


2. Limpe o cache do Chrome

Selecione "Armazenamento" na mesma tela:


Por fim, selecione "Limpar cache".

Quando você retorna ao aplicativo Chrome, a página deve se recarregar e exibir uma versão não em cache.

Além disso, encontrei um site que facilita o teste se você limpou o cache: https://refreshyourcache.com/en/cache-test/
Não sou de forma alguma afiliado a ele. Observe que o método para limpar o cache mencionado nesse site está desatualizado e não é mais válido.

Bort
fonte
1
Perfeito, essa é a única solução que funcionou para mim sem a depuração USB.
Luis Lema
2

EDIT: este método foi descontinuado no Google Chrome e não funcionará mais.

RESPOSTA ORIGINAL:

Consegui limpar o cache (incluindo o xhr subsequente) usando chrome: // net-internals

internos da rede de cromo

Em seguida, clique na pequena seta no canto superior direito

cardápio

Selecione "limpar cache" nesse menu.

Tom Kay
fonte
No Chrome 75, chrome: // net-internals diz "O visualizador de eventos net-internals e a funcionalidade relacionada foram removidos ..."
Bort
@Bort obrigado pela atenção. Parece que esse método não funcionará mais.
Tom Kay
1

Aqui está outra solução simples que pode funcionar quando outros falham:

Hoje, uma solução do desenvolvedor bastante simples funcionou para mim quando o problema de armazenamento em cache era um arquivo CSS em cache. Em resumo: crie uma cópia temporária do arquivo html e navegue até ela para atualizar o cache CSS.

Esse truque pode atualizar o arquivo CSS, pelo menos no navegador padrão do Android com o ícone azul do globo (mas é provável que seja o gêmeo, o navegador oficial do Chrome também e quaisquer outros navegadores que encontramos nos telefones "inteligentes" com a tendência de cache agressivo )

Detalhes:

No começo, tentei algumas das soluções bastante simples compartilhadas aqui, mas sem sucesso (por exemplo, limpando o histórico recente do site específico, mas não meses e meses). No entanto, meu CSS mais recente não seria aplicado após a atualização. E mesmo que eu já tivesse empregado o truque do número da versão na chamada de arquivo CSS na seção head do html, o que me ajudou a evitar esses incômodos caches agressivos no passado. (exemplo: link rel = "stylesheet" href = "style.css? v = 001" em que você atualiza esse número de pseudo-versão toda vez que faz uma alteração em um arquivo CSS, por exemplo, 001, 002, 003, 004 ... (deve ser feito em todos os arquivos html do site))

Desta vez (agosto de 2019), a atualização do número da versão do arquivo CSS não é mais suficiente, nem algumas das medidas mais simples mencionadas aqui funcionam para mim, ou eu nem consegui encontrar acesso a algumas delas (em um telefone Android emprestado).

No final, tentei algo relativamente simples que finalmente resolveu o problema:

Fiz uma cópia do arquivo index.html do site com um nome diferente (indexcopy.html), enviei-o, naveguei no dispositivo Android, depois naveguei de volta para a página original e atualizei-o (com o botão Atualizar à esquerda de a barra de endereço) e voilà: dessa vez, a atualização do index.html finalmente funcionou.

Explicação: A versão mais recente do arquivo CSS foi finalmente aplicada no Android ao atualizar a página html em questão porque a cópia em cache do arquivo CSS havia sido atualizada quando o arquivo CSS foi chamado a partir de uma página html temporária com nome diferente e que não existia em nenhum lugar no histórico do navegador e que eu poderia excluir novamente depois. O cache agressivo aparentemente ignorou o URL do CSS e passou pelo URL do HTML, mesmo que fosse o arquivo CSS que precisava ser atualizado no cache.

DirkTheWebPhoenix
fonte
Infelizmente, este é o único que parece funcionar hoje em dia. Isso significa que, sempre que estiver trabalhando em css, você precisará atualizar o functions.php no wordpress para atualizar a versão. Sim, outra coisa estúpida sobre o google, que falha em pensar e está lá em cima com a microsoft agora. Mas sim, um velho truque :)
Gavin Simpson
1

Se for apenas a questão dos arquivos incluídos, basta adicionar a versão após o caminho ( ?v=12345678)

<link rel="stylesheet" type="text/css" href="style.css?v=12345678" />

Quem carregar a página novamente verá alterações.

Novasol
fonte
1
Ótima resposta subestimada!
lisandro