nginx cached index.html forçar recarregamento

Dec 12 2020

Durante a migração de um servidor, uma nova configuração nginx não tinha diretivas de controle de cache. Portanto, acabamos com um cache index.htmlque é muito ruim para o nosso SPA, que não é mais atualizado se implantarmos um novo código. Precisamos que o index.html não seja armazenado em cache.

Esta era a nossa configuração nginx (ruim) que estava online alguns dias:

server {
  listen 80;

  location / {
    root   /usr/share/nginx/html;
    index  index.html index.htm;
    try_files $uri $uri/ /index.html;
  }

  error_page   500 502 503 504  /50x.html;

  location = /50x.html {
    root   /usr/share/nginx/html;
  }

}

Corrigimos nossa configuração:

server {
  listen 80;

  root /usr/share/nginx/html;

  location / {
    index  index.html index.htm;
    try_files $uri $uri/ /index.html;
    add_header Cache-Control "no-store, no-cache, must-revalidate";
  }

  location ~* \.(js|jpg|jpeg|gif|png|svg|css)$ {
    add_header Cache-Control "max-age=31536000, public";
  }

  error_page   500 502 503 504  /50x.html;

  location = /50x.html {
    root   /usr/share/nginx/html;
  }

}

PERGUNTA

Os clientes que estiveram em nossa página da web nos últimos dias armazenaram em cache um index.html antigo. Como podemos forçar seus navegadores a descartar o cache index.html?

Respostas

1 Talkerbox Dec 17 2020 at 16:38

Não há como redefinir manualmente o cache do navegador no lado do usuário (navegador) enquanto o cliente não solicita ao servidor um novo conteúdo. Neste caso pode ser útil o acesso a quaisquer scripts, que o seu SPA seja baixado sem cache. Neste caso, você pode alterar este script e executar a página de recarregamento forçado (mas tome cuidado - você precisa de qualquer sinalização para evitar o recarregamento forçado permanente após cada carregamento de página). Por exemplo, se você tiver GTM no local - isso pode ajudar.

UPD: não sou especialista em js, mas você precisava adicionar a tag GTM em todas as páginas como este js-script:

function getCookie(name) {
  let matches = document.cookie.match(new RegExp(
    "(?:^|; )" + name.replace(/([\.$?*|{}\(\)\[\]\\\/\+^])/g, '\\$1') + "=([^;]*)"
  ));
  return matches ? decodeURIComponent(matches[1]) : undefined;
}

was_reloaded = getCookie('was_reloaded')
alert(was_reloaded)
if (was_reloaded != 'yes') {
        document.cookie = "was_reloaded=yes; path=/; max-age=3600;"
    location.reload();
} }