Por que o servidor está ignorando as alterações nos arquivos de código, embora o cache esteja desativado?


14

Testo um código html / js no meu host local (Windows 7, Chrome v79.0.3945.130 (64 bits)) e cerca de 50% das alterações no código de tempo não são refletidas no navegador (eu o vejo em Ferramentas / Fontes de Desenvolvimento )
Há muitos conselhos na internet, mas nenhum deles parece funcionar:

  • Clique com o botão direito do mouse no recarregamento e escolha "Cache vazio e recarregamento físico" - não ajuda em 30% dos casos.
  • Desabilitar o cache na guia Rede das Ferramentas de Desenvolvimento do Chrome - não ajuda.
  • Adicione <meta http-equiv="Cache-control" content="no-cache">no cabeçalho - não ajuda.
  • Substituir <script src="common.js"></script>por <script src="common.js?blabla"></script>- ajuda em 60% dos casos, mas você precisa fazer isso depois que cada mudança é uma tarefa árdua. Além disso, ele não funciona com alterações de html.
  • Copie um arquivo para um novo arquivo (como index.html para index2.html) e substitua o nome do arquivo no código - sempre funciona, mas é uma tarefa ainda maior.

Exatamente o mesmo problema presente quando eu comprometo o código no github.io

Ajude-me a fazer com que o site reflita as alterações de código imediatamente.


Edit: Eu criei um arquivo index3.html e coloquei apenas "olá mundo" lá. Abriu o arquivo no navegador. Alterado para "olá mundo2" - o navegador atualizou o conteúdo. Alterado para "olá mundo3" - o navegador ainda estava exibindo "olá mundo2", mesmo após várias recargas e "cache vazio e recarga forçada". Mudei para "olá mundo4" - o navegador ainda mostrava "olá mundo2". Em 4 horas, mudei para "olá mundo5" - o navegador ainda mostra "olá mundo2". Este arquivo editei com o bloco de notas básico.


Edit2: As pessoas continuam perguntando qual servidor eu estou usando. Isso parece parte do problema. Infelizmente, não sei e também não sei exatamente o que preciso fazer para verificá-lo. Aqui está tudo o que descobri até agora:

  • Eu tenho o inetpub/wwwrootdiretório em que coloco os arquivos html & js e, em seguida, abro o index.html em um navegador em http://localhost/.
  • Meu painel Rede no Devs Tools é assim: link da imagem .
  • A configuração do servidor foi muito rápida e não exigiu nenhum software adicional para instalar. Ou seja, eu não estou usando o node.js.
  • Há iisstart.htm em inetpub/wwwroote quando eu abro http://localhost/iisstart.htm, diz IIS7.

Às vezes, acho que desabilitar o cache nas ferramentas de desenvolvimento do chrome + atualizar + habilitar o cache novamente + atualizar às vezes corrige o problema? Pode valer a pena um tiro ...
Nick Parsons

2
que tipo de servidor você está usando?
Jhecht 19/01

@ Jhecht como verificá-lo?
klm123 19/01

11
Pelo que vejo nas respostas, você provavelmente contornará isso com um parâmetro. E isso provavelmente vai funcionar. No entanto, normalmente isso não deve ser necessário quando você desabilita o cache nas ferramentas de desenvolvimento do chrome. Portanto, meu palpite seria que há outro cache envolvido. Entre você e o servidor, pode haver qualquer número de tecnologia de cache adicional. Alguns exemplos: cache do servidor (por exemplo, Varnish), CDN (por exemplo, Cloudflare), proxies locais de roteadores / firewalls (por exemplo, squid-cache) e coisas semelhantes. Eu verificaria isso também.
Jey DWork 23/01

11
@ klm123 sem saber qual é o servidor da web, é impossível informar sobre como alterar ou verificar a configuração do cache. Se você não tem idéia sobre o seu servidor da Web, uma maneira possível de verificar isso é na guia de rede do devTools: verifique os cabeçalhos de resposta dos carregados index.htmlpara algo como um cabeçalho X-Powered-Byou Serverque possa dar uma dica sobre o servidor da Web. A pesquisa no seu caminho de arquivo inetpub/wwwrootaponta fortemente para um servidor IIS.
acran 24/01

Respostas:


6

Usar um parâmetro é o caminho certo! Aqui você pode adicionar um número de versão que você altera somente em grandes alterações manualmente e, para depuração, pode defini-lo como Date.time () para que, na tag <head>, isso force todas as versões em cache a serem substituídas, pois o parâmetro é sempre um novo 1:

< script type="text/javascript"> 
    var script = document.createElement('script'); 
    var version = Date.time();
    script.src = "common.js?v="+version; 
    document.head.appendChild(script) 
< /script>

Espero que isto ajude!


Eu acho que posso fazer isso. Mas não é efetivamente o mesmo que minha quarta opção? para adicionar "? blabla" após o nome do arquivo. Ele não funciona com frequência - é o mesmo nome de arquivo na guia Fontes ou blabla é adicionado, mas o conteúdo do arquivo ainda é o mesmo.
klm123 19/01

Não é o mesmo. Uma vez que um parâmetro é usado duas vezes (que nunca vai acontecer com date.time () que pode tornar uma versão em cache blabla é o mesmo após usá-lo duas vezes como não usá-lo em tudo.?.
lehm.ro

parâmetro não é usado duas vezes. Eu edito o código, altero o parâmetro, depois verifico o código-fonte no navegador e ele é o antigo.
klm123 19/01

Você já tentou minha abordagem?
lehm.ro 20/01

Sua abordagem ajuda, obrigado. Mas isso não resolve o meu problema. O que você escreveu não é verdade na minha situação. "força todas as versões em cache a serem substituídas, pois o parâmetro é sempre novo", alterar o parâmetro para um novo não força o meu cache a ser recarregado de forma confiável. Também não pode ajudar com alterações no index.html.
klm123 20/01

3

No servidor Windows IIS7 em execução no Windows 7, para impedir o armazenamento em cache do seu conteúdo, é necessário fazer algumas alterações em um dos arquivos de configuração chamado web.config. Os arquivos de configuração do IIS 7 e posterior estão localizados em %WinDir%\System32\Inetsrv\Config folderonde %WinDir%está a pasta em que você instalou o Windows (normalmente C:/Windows).

Crie uma cópia de backup do seu web.configarquivo antes de editá-lo, para que você possa reverter se as alterações feitas no arquivo o quebrarem.

No seu web.configarquivo, basta adicionar o seguinte para impedir o armazenamento em cache do seu index.html:

<?xml version="1.0" encoding="UTF-8"?>
<configuration>

  <location path="index.html">
    <system.webServer>
      <httpProtocol>
        <customHeaders>
          <add name="Cache-Control" value="no-cache" />
        </customHeaders>
      </httpProtocol>
    </system.webServer>
  </location>

</configuration>

Obtenha o caminho do web.configarquivo a partir daqui: Windows Doc: Referência de Configuração

A configuração do cache acima foi obtida aqui: Como desativar o cache do arquivo HTML do aplicativo de página única veiculado pelo IIS?


Não há web.config no caminho mencionado. Eu criei e coloquei seu código lá. Mas tive que substituir index.html pelo caminho completo projectName/index.html, como copio da url no meu navegador http:/localhost/projectName/index.html. Resultado - nenhum efeito no problema de armazenamento em cache.
klm123 26/01

@ kim123 Você pode tentar adicionar o web.configarquivo na pasta raiz do seu site (pasta em que o site está) e alterar o caminho de volta para apenas para index.htmlver se isso funciona.
AndrewL64 26/01

eu fiz. isso não ajuda.
klm123 26/01

1

Eu tive o mesmo problema e esta é minha lista de verificação:

  1. Verifique web.config (cache e clientcache, política de cache do kernel etc.) ou .htaccess (Header set Cache-Control).
  2. Se você usou linguagens dinâmicas como ASP, PHP, pode haver uma configuração interna de cache. Em um caso, encontrei <%Response.Expires=1440%>muitas linhas de código ASP e estava superando todas as outras configurações! Em php session_cache_expiremaio faz o mesmo.
  3. Se você estiver usando o IIS, verifique o servidor > Cabeçalhos de resposta HTTP para garantir que não haja nada sobre o cache também para sites individuais listados sob o nome do servidor.
  4. verifique http-equiv="Cache-control"nos cabeçalhos html (você passou neste teste!).

Finalmente, devo dizer que, em todas as situações acima, a seleção de Desativar cache na guia newtwork no console do Chrome sempre funcionou para exibir uma versão nova das páginas; no entanto, isso é bom apenas para fins de depuração e os visitantes não fazem isso!


1. Onde encontro web.config e .htaccess? 2. Uso apenas html e js. 3. Os cabeçalhos de resposta HTTP são assim: imgur.com/leYpdej
klm123 25/01

Se você estiver usando o IIS, o web.congfig está na raiz do wwwroot. Também existe o arquivo Machine.config no nível do servidor, que você pode modificá-lo diretamente no console do IIS a partir daqui: stackoverflow.com/questions/2325473/where-is-machine-config . Se você estiver usando o servidor apache no Windows, procure o windows para encontrar .htaccess @ klm123
Ali Sheikhpour

0

No caso específico do uso do Google Chrome, tente o seguinte: Abra Ferramentas de Desenvolvimento -> Vá para a guia 'Rede'. Marque a caixa de seleção 'Desativar cache', depois atualize a página.

NOTA: Para que isso funcione sempre que a janela Dev Tools DEVE permanecer aberta o tempo todo.

insira a descrição da imagem aqui

No entanto, para propagar alterações para seus usuários, sem que eles atualizem a página com força, etc, você deve anexar versões de arquivo no final de cada arquivo referenciado para arquivos que mudam com frequência (como você apontou). Por exemplo:

<link rel="stylesheet" type="text/css" href="https://cdn.sstatic.net/Sites/stackoverflow/primary.css?v=20b379f72a37" >

O v=20b379f72a37anexo ao final é um hash de arquivo gerado automaticamente do conteúdo do arquivo.


Esse é o item 2 da minha lista.
klm123 19/01

Você está certificando-se de que a janela Dev Tools permaneça aberta?
Martin Shishkov 19/01

a janela de ferramentas de desenvolvimento está aberta, a caixa de seleção está marcada [mas eu olho para a guia de fontes normalmente] e até faço atualizações duras.
klm123 19/01

0

Este é um tiro no escuro - mas que tipo de editor / IDE você está usando? Além disso, que tipo de edição você está fazendo no seu index.html?

Você poderia fornecer alguns exemplos dessas edições que não estão sendo refletidas quando você salva e tenta carregar o arquivo?

Gostaria de tentar reproduzir seu problema. Pelo que as pessoas estão sugerindo, não parece que o problema esteja dentro do próprio código. Suspeito que seja uma questão ambiental, mas preciso de mais informações suas para confirmar minhas suspeitas.


Eu uso o código do Microsoft Visual Studio. Exemplo: substitua <script src = "common.js"> </script> por <script src = "common.js? Blabla">. Exemplo2: adicione um novo botão, adicione uma nova div, adicione a chamada de função onload. Parece que qualquer tipo de edição.
klm123 23/01

Veja as edições no final da minha pergunta.
klm123 23/01

0

O que você escreve na meta HTML é uma recomendação para os navegadores, não uma instrução estrita. Se o armazenamento em cache estrito estiver ativado no navegador, isso não ajudará.

As soluções estão bem descritas: https://curtistimson.co.uk/post/front-end-dev/what-is-cache-busting/

Prefiro do lado do servidor adicionar aos scripts a versão com a data da última atualização do arquivo.

<script src="/myScript.js?v=1579780745150"></script>

Onde 1579780745150 é Unix O registro de data e hora atualiza o próprio arquivo myScript.js . Funciona apenas com seus próprios arquivos, mas não são necessários arquivos externos. Geralmente, o nome do arquivo é a versão.


Se você precisar do código de back-end. Diga-me qual plataforma você usou.
Aleksandr Smityukh 23/01

0

Isso provavelmente é realmente frustrante e não parece que você esteja fazendo algo errado.

O problema é provável que algo entre o navegador e o arquivo de script que você está chamando faça algum cache.

Para determinar o que é, deixe-me perguntar como você está navegando no URL do host local?

Exemplos:

file://path/to/file.html
http://localhost/file.html
http://127.0.0.1/file.html
http://[machine's-hostname]/file.html
http://[custom-domain-defined-in-hosts-file]/file.html

Se você estiver executando file://path/to/file.htmlisso significa que não está navegando em um servidor / proxy da web. Se for http://[something]/file.html, você está executando algum tipo de servidor da web e esse é provavelmente o culpado. Procure por algum tipo de configuração em que você possa desativar o cache.

Se você não estiver usando um servidor Web e estiver literalmente navegando diretamente para um arquivo html local sem um servidor Web, sugiro que o navegador seja o culpado. Se for esse o caso, sugiro desativar o cache do navegador, como sugerido por Martin Shishkov .


É http://localhost/ProjectName/index.htmlonde está essa configuração em que você pode desativar o cache?
klm123 24/01

Parece que, na captura de tela que você postou em outro lugar, você está usando o IIS (também chamado de Serviços de Informações da Internet da Microsoft). Uma solução rápida é clicar duas vezes no seu arquivo .html para carregá-lo no navegador, que utilizará o file://path/to/projectName/index.html. Isso removerá o servidor web da equação. Para continuar usando o IIS e apenas corrigir o cache, consulte este artigo: support.microsoft.com/en-us/help/247404/…
Dean Householder

0

O Chrome faz isso onde, se o arquivo não mudou muito, não sabe o que significa, ele usará a versão do cache "compilado". Para html, significa analisado don tree. Para código pré-compilado JS etc.

Geralmente, existem maneiras de resolver isso, muitas estruturas usam hash dentro de nomes de arquivos, como: main.md5hash.jsporque a alteração do nome do arquivo invalida qualquer cache.

Então você ficará com o html possivelmente não atualizando. E para ser claro, não tenho certeza, você sempre pode adicionar comentários com blob aleatório ... como uma data.


0

Com base nas atualizações da sua resposta, eu diria que o problema é causado pelo IIS v7, que usa a memória do PC para armazenar em cache não o disco rígido local Hard reloade é por isso que todos os outros métodos parecem não funcionar corretamente.

Eu poderia pensar em 3 solução:

1. Corrigindo o problema de cache do IIS: (Não testado devido ao fato de eu não ter um PC com IIS)

  1. No menu Iniciar , clique em Ferramentas administrativas e clique em Gerenciador do Internet Information Services (IIS). (veja imagens )
  2. Na visualização em árvore no lado esquerdo , encontre seu aplicativo.
  3. Selecione o item de menu Cache de Saída .
  4. Clique em Adicionar regra de cache e digite os arquivos extensionque você deseja desativar no cache .aspx, como .css, .js etc ... (um de cada vez, eu acho?)
  5. Agora, você pode Desmarcar o cache do modo de usuário ou Verificar impedir todo o cache. Deve ser semelhante a este:

insira a descrição da imagem aqui

Origem da solução - Leia mais sobre o cache do IIS 7


2. Usando algumas alternativas ao IIS Existem algumas, mas eu recomendaria (com base em minhas experiências) WAMP ou XAMPP. Ambos oferecem um "ambiente" de desenvolvimento melhor e ambos oferecem suporte ao Windows 7. Além disso, se você estiver familiarizado com Código VS, você pode apenas usar a extensão do Live Server .


3. Use o modo de navegação anônima do Chrome durante o desenvolvimento. (Não tenho certeza se funciona para o IIS7)


Adicionar regra de cache / impedir todo o armazenamento em cache - não ajuda [tentei com html]. Modo de navegação anônima - não ajuda.
klm123 26/01

Você já tentou com .jsarquivos? depende de quais mudanças você faz.
awran5 26/01
Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.