nginx cached index.html wymuś ponowne załadowanie

Question

Podczas migracji serwera w nowej konfiguracji nginx brakowało dyrektyw cache conrol. W związku z tym otrzymaliśmy buforowany plik, index.htmlktóry jest bardzo zły dla naszego SPA, który nie jest już odświeżany, jeśli wdrożymy nowy kod. Potrzebujemy, aby plik index.html nie był zapisywany w pamięci podręcznej.

To była nasza (zła) konfiguracja nginx, która była online kilka dni:

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;
  }

}

Naprawiliśmy naszą konfigurację:

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;
  }

}

PYTANIE

Klienci, którzy odwiedzili naszą stronę internetową w ciągu ostatnich dni, zapisali w pamięci podręcznej stary plik index.html. Jak możemy zmusić ich przeglądarki do usunięcia pamięci podręcznej index.html?

Answer 1

Nie ma możliwości ręcznego zresetowania pamięci podręcznej przeglądarki po stronie użytkownika (przeglądarki), gdy klient nie wysyła żądań do serwera w celu uzyskania nowej zawartości. W tym przypadku przydatny może być dostęp do dowolnych skryptów, które SPA jest pobierane bez cache. W takim przypadku możesz zmienić ten skrypt i uruchomić wymuszenie ponownego załadowania strony (ale bądź ostrożny - potrzebujesz flagi, aby zapobiec trwałemu wymuszeniu ponownego załadowania strony po każdym załadowaniu strony). Na przykład, jeśli masz GTM na miejscu - to może pomóc.

UPD: Nie jestem specjalistą od js, ale musiałeś dodać tag GTM na wszystkich stronach, takich jak ten 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();
} }