Очистить кеш в JavaScript

Question

Как очистить кеш браузера с помощью JavaScript?

Мы развернули последний код JavaScript, но не можем получить последний код JavaScript.

От редакции. Этот вопрос частично дублируется в следующих местах, и ответ на первый из следующих вопросов, вероятно, является лучшим. Этот принятый ответ больше не является идеальным решением.

Как заставить браузер перезагружать кэшированные файлы CSS / JS?

Как заставить клиентов обновлять файлы JavaScript?

Динамическая перезагрузка локального источника данных Javascript / данных JSON

Answer 1

Может быть «очистить кеш» не так просто, как должно быть. Вместо очистки кеша в моих браузерах я понял, что «касание» файла фактически изменит дату кеширования исходного файла на сервере (протестировано на Edge, Chrome и Firefox), и большинство браузеров автоматически загрузят самая свежая свежая копия того, что есть на вашем сервере (код, графика и любые мультимедиа тоже). Я предлагаю вам просто скопировать самые последние сценарии на сервере и «сделай прикосновение» решение до того, как ваша программа запустится, поэтому она изменит дату всех ваших проблемных файлов на самую последнюю дату и время, затем он загружает свежую копию в ваш браузер:

<?php
    touch('/www/control/file1.js');
    touch('/www/control/file2.js');
    touch('/www/control/file2.js');
?>

... остальная часть вашей программы ...

Мне потребовалось некоторое время, чтобы решить эту проблему (поскольку многие браузеры по-разному работают с разными командами, но все они проверяют время файлов и сравнивают их с загруженной копией в вашем браузере, если обновление даты и времени выполнит обновление) , Если вы не можете пойти по правильному пути, всегда есть другое полезное и лучшее решение. С наилучшими пожеланиями и счастливого кемпинга.

Answer 2

У меня были некоторые проблемы с кодом, предложенным yboussard. Внутренняя J-петля не работает. Вот модифицированный код, который я использую с успехом.

function reloadScripts(toRefreshList/* list of js to be refresh */, key /* change this key every time you want force a refresh */) {
    var scripts = document.getElementsByTagName('script');
    for(var i = 0; i < scripts.length; i++) {
        var aScript = scripts[i];
        for(var j = 0; j < toRefreshList.length; j++) {
            var toRefresh = toRefreshList[j];
            if(aScript.src && (aScript.src.indexOf(toRefresh) > -1)) {
                new_src = aScript.src.replace(toRefresh, toRefresh + '?k=' + key);
                // console.log('Force refresh on cached script files. From: ' + aScript.src + ' to ' + new_src)
                aScript.src = new_src;
            }
        }
    }
}

Answer 3

Пожалуйста, не дайте неверную информацию. Cache api - это другой тип кэша от http cache

HTTP-кеш запускается, когда сервер отправляет правильные заголовки , вы не можете получить доступ с помощью javasvipt.

Cache api , с другой стороны, запускается, когда вы хотите, он полезен при работе с сервисным работником , поэтому вы можете пересекать запрос и отвечать на него из этого типа кэша. см .: иллюстрационная 1 иллюстрационная 2 курс

Вы можете использовать эти методы, чтобы всегда иметь свежий контент для ваших пользователей:

1. Используйте location.reload (true) это не работает для меня, поэтому я бы не рекомендовал его.
2. Используйте Cache api , чтобы сохранить в кеш и пересечь запрос с обслуживающим работником , будьте осторожны с этим, потому что если сервер отправил заголовки кэша для файлов, которые вы хотите чтобы обновить, браузер сначала ответит из HTTP-кэша, и если он не найдет его, он перейдет в сеть, так что вы можете получить старый файл
3. Измените URL из ваших файлов stactics, я рекомендую вам назвать его с изменением содержимого ваших файлов, я использую md5 , а затем преобразовать его в строку и URL-адрес, и md5 изменится с содержимым файла, там вы можете свободно отправлять заголовки кеша HTTP достаточно долго

Я бы рекомендовал третий см.

Answer 4

Cache.delete () может использоваться для новых Chrome, Firefox и Opera.

Answer 5

window.parent.caches.delete("call")

закройте и откройте браузер после выполнения кода в консоли.

Answer 6

Я склоняюсь к версии своего фреймворка, затем применяю номер версии к путям сценариев и стилей

<cfset fw.version = '001' />
<script src="/scripts/#fw.version#/foo.js"/>

Answer 7

Вы также можете отключить кэширование в браузере с помощью метатег-тегов HTML, просто поместив html-теги в раздел заголовка, чтобы избежать кэширования веб-страницы во время кодирования / тестирования, а по завершении вы можете удалить мета-теги.

(в головной части)

<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0"/>

Обновите вашу страницу после вставки этого в заголовок и также должны обновить новый код JavaScript.

Эта ссылка даст вам другие варианты, если они вам нужны http://cristian.sulea.net/blog/disable-browser-caching-with-meta-html-tags/

или вы можете просто создать такую ​​кнопку

<button type="button" onclick="location.reload(true)">Refresh</button>

он обновляется и избегает кеширования, но он будет там на вашей странице, пока вы не закончите тестирование, а затем вы можете снять его. Первый вариант лучше всего.