Зупинити Chrome кешування файлів JS


136

Я внесу зміни в свої файли JS, але він не дійсно зміниться в браузері, мені доведеться перейменовувати файли кожен раз, щоб він перезавантажував їх. Чи є якась команда .htaccess, яку я можу додати, або щось, щоб змусити її зупиняти кешування?

Це навіть кешування моїх html-сторінок жорстким ядром. Мені потрібно знову відкрити весь браузер, щоб побачити зміни. Чи може це бути проблема із сервером?


Чи вмикання заголовка ETag на вашому веб-сервері спричиняє кешування Chrome, але коректно отримувати нову копію файлу, коли він змінився?
Веб-розробник

Відповіді:


200

Ви можете натиснути піктограму налаштувань у верхньому правому куті ...| Інші інструменти | Інструменти для розробників | Мережа | Вимкнути кеш-пам'ять (поки DevTools відкритий)

Для Windows це F12або CTRL + SHIFT + Iпоки на mac CMD + SHIFT + Iвідкриває DevTools.

Новий шлях до оновлення Chrome, вересень 2018 року:

Клацніть піктограму налаштувань у верхньому правому куті ...| Налаштування | Налаштування | Інструменти для розробників | Мережа | Вимкнути кеш-пам'ять (поки DevTools відкритий)


4
Основна помилка хромування кешування речей ... навіть коли на сторінці позначено відсутність кешу .... Ой, принаймні, це працює, користувачі можуть страждати, але принаймні я можу розвинутися
Роберт Ноак

4
Зауважте, що "Налаштування" більше не внизу! Клацніть меню трьох крапок у верхньому правому куті, щоб перейти до налаштувань.
yizzlez

4
Місцезнаходження: верхній правий кут | "..." | налаштування | Налаштування | Мережа | "Вимкнути кеш-пам'ять" (поки DevTools відкритий).
атом88

1
Це ДУЖЕ БАГА ПРАКТИКА !!! Ні, у вас не повинно бути тимчасового злому .... Найкращий спосіб - це випадковий рядок запиту в кінці src. src = "someJs.js? someRandomStringCreateByInlineJsOrServerRenderCode", який би зробив так, щоб у ній завжди була нова версія. хорошим випадковим рядком було б схопити сьогоднішню дату / час і кинути її туди. можливо, вам доведеться перетворити його в рядок, оскільки він, ймовірно, є об'єктом дати. Це дійсно погано, що це була обрана відповідь і настільки сильно прихильна.

1
Що стосується Chrome 61.0.3163.100, то, здається, що ця опція зараз працює в Інших інструментах / мережевих умовах. Параметр "Інструменти для розробників" більше не існує.
Ілля Куліков

61

Швидший спосіб зробити це, клацнувши правою кнопкою миші піктограму оновлення біля адресного рядка та вибравши Порожній кеш і Перезавантажити жорсткий

Просто переконайтесь, що інструменти для розробки Chrome відкриті. (Натисніть F12) До речі ... Цей трюк працює лише в Chrome для Windows, Ubuntu та Mac OS


2
FYI, я все це спробував, і абсолютно нічого з цього не вийшло. На моїй машині (з типовими налаштуваннями для Mountain Lion) F12 показує панель приладів.
Обрі Гудмен

2
як це набагато краще, ніж прийнята відповідь? Ви можете перезавантажитись нормально за допомогою прийнятої відповіді.
SSH Цього

ні, ти не можеш. принаймні, я не можу. жодна з відповідей не працювала для мене, все ще спливає попередження, яке видалено в моєму локальному файлі js, але воно все ще знаходиться в кешованому js-файлі в хромі.
Бурак Каракуш

1
Працює для мене. Переконайтесь, що інструменти для розробки відкриті, інакше клацніть правою кнопкою миші меню не відображатиметься.
Венрікс

Я бачу варіант, але в моєму випадку сценарій не був оновлений.
Ілля Куліков


12

додати щось на кшталт script.js?a=[random Number]випадкового числа, згенерованого PHP.

Ви пробували expire = 0, прагми "no-cache" та "cache-control = NO-CACHE"? (Я не знаю, що вони говорять про Сценарії).


2
Я наткнувся на це питання і скупився через відповіді. Це жахлива ідея, оскільки: 1) генерування випадкового числа при кожному запиті змушує браузери повторно завантажувати файл при кожному відвідуванні. Ви хочете значення часу складання , щоб веб-переглядачі відновлювали це значення лише під час внесення змін на сайт. Оскільки PHP інтерпретується під час виконання, можливо, вам доведеться зробити це під час розгортання. і 2) генерування випадкового числа означає, що іноді (зі збільшенням ймовірності з часом) браузер буде робити якусь випадкову стару кешовану копію. Якщо ви повинні зробити це в час запиту, використовуйте часову позначку!
JakeRobb

Я роблю це і використовую номер версії збірки, з пристойним тайм-аутом (1 день) на значення кешу заголовка
Worthy7

11

Кілька ідей:

  1. Коли ви оновлюєте сторінку в Chrome, зробіть CTRL + F5, щоб зробити повне оновлення.
  2. Навіть якщо встановити термін дії "0", воно все одно кешуватиметься протягом сеансу. Вам доведеться знову закрити і знову відкрити веб-переглядач.
  3. Переконайтеся, що при збереженні файлів на сервері часові позначки оновлюються. Chrome спочатку видасть HEADкоманду замість повного GET, щоб побачити, чи потрібно ще раз завантажити повний файл, а сервер використовує часову позначку, щоб побачити.

Якщо ви хочете відключити кешування на вашому сервері, ви можете зробити щось на кшталт:

Header set Expires "Thu, 19 Nov 1981 08:52:00 GM"
Header set Cache-Control "no-store, no-cache, must-revalidate, post-check=0, pre-check=0"
Header set Pragma "no-cache"

В .htaccess


Якщо це було, але попередня перевірка = 0, після перевірки = 0 - це доповнення, яке змінило для мене.
TadLewis

7

Швидкі кроки:

1) Відкрийте інформаційну панель Інструменти для розробників, перейшовши до меню Chrome -> Інструменти -> Інструменти для розробників

2) Клацніть на значку налаштувань праворуч (це гвинтик!)

3) Поставте прапорець "Вимкнути кеш (коли DevTools відкрито)"

4) Тепер, поки панель приладів вгору, просто натисніть оновлення, і JS не буде кешований!


1
Однак це не допомагає налагоджувати за допомогою WebStorm. Тоді DevTools відкрито, WebStrom не може приєднати відладчик.
Олександр Волков

5

Проблема полягає в тому, що Chrome повинен мати must-revalidateзаголовок Cache-Control`, щоб повторно перевірити файли, щоб побачити, чи потрібно їх перезавантажувати.

Ви завжди можете SHIFT-F5 і змусити Chrome оновлюватись, але якщо ви хочете виправити цю проблему на сервері, включіть цей заголовок відповіді:

Cache-Control: must-revalidate

Це повідомляє Chrome проконсультуватися з сервером і перевірити, чи є новий файл. Якщо є новий файл, він отримає його у відповіді. Якщо ні, то він отримає відповідь 304 і впевненість, що той, який знаходиться в кеші, є актуальним.

Якщо ви НЕ встановлюєте цей заголовок, Chrome, за відсутності будь-якого іншого налаштування, яке визнає недійсним файл, визнає недійсним ніколи перевіриться на сервері, чи не з’явилася нова версія.

Ось повідомлення в блозі, де далі обговорюється це питання.


1
Я думаю, що це має бути Cache-Control: must-revalidateзамість Cache-Control: must-validate. Я не думаю, що остання справедлива.
László Monda,

3

Під час оновлення своїх веб-додатків я або використовую оброблювач, щоб повернути один JS-файл, щоб уникнути масових звернень на моєму сервері, або додати до них невелику рядок запитів:

<script type="text/javascript" src="/mine/myscript?20111205"></script>

2
Хоча це виглядає як геніальна практика, у вас можуть виникнути проблеми з деякими проксі-серверами, які перестануть кешувати, коли знайдуть рядок запитів: developers.google.com/speed/docs/best-practices/…
Франсуа Буржуа

2
То що ж робити замість цього?
BlueSky

1
<Files *>
Header set Cache-Control: "no-cache, private, pre-check=0, post-check=0, max-age=0"
Header set Expires: 0
Header set Pragma: no-cache
</Files>

1

Я знаю, що це "старе" питання. Але головних болів при кешуванні ніколи не буває. Після купи проб і помилок я виявив, що один з наших веб-провайдерів хостингу провів через CPanel це додаток під назвою Cachewall. Я щойно натиснув на Увімкнути режим розробки та ... voilà !!! Це відразу зупинило тривалий біль :) Сподіваюся, це допоможе комусь іншому ...


0

Я отримував той самий файл css, коли переглядав веб-сайт (на сервері хостингу компанії з реальним доменом) і мені не вдалося отримати оновлену версію на chrome. Мені вдалося отримати оновлену версію файлу, коли я переглядав його на Firefox. Жодна з цих відповідей не працювала для мене. У мене також є файли веб-сайтів на своїй машині та переглядаю сайт з localhost за допомогою мого локального сервера apache. Я вимкнув сервер apache і мені вдалося отримати оновлений файл. Якось мій локальний сервер apache возився з хромованим кешем. Сподіваюся, це допомагає комусь, оскільки мені було дуже важко це виправити.


0
  1. Відкрийте Інструменти для розробників

    • Або F12
    • Або ...-> More Tools->Developer Tools
  2. Клацніть Empty Cache and Hard Reload

    • Клацніть правою кнопкою миші значок оновлення (лише ліворуч для адресного рядка)
    • Або клацніть піктограмою оновлення лівою кнопкою миші та утримуючи її протягом 1 секунди

0

Ви можете відкрити вікно анонімного перегляду. Перехід на інкогніто вікно працював для мене, коли відключення кешу в звичайному хромованому вікні все ще не перезавантажував файл JavaScript, який я змінив з останнього кешу.

https://www.quora.com/Does-incognito-mode-on-Chrome-use-the-cache-that-was-previously-stored

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.