Додайте версію, яка вказує на те, що кешована стара версія статичного файлу оновлено, щоб уникнути використання
Оскільки передній етап довгий, якщо ви хочете побачити тільки програму, будь ласка, пропустіть її.
Середовищі
- Візуальна студія
-
- Visual Studio 2019
- ASP.NET ядро
-
- 3.1 (Сторінка бритви, MVC)
Про кешування файлів на веб-сторінках
При відвіді веб-сторінки, крім HTML, .js файли (Javascript), .css файли (таблиці стилів) і файли зображень завантажуються клієнту для відображення і виконання. Однак деякі файли зображень великі, і завантаження їх кожного разу може бути дорогим. Крім того.js файли .css файли часто використовуються на інших сторінках, і немає необхідності завантажувати їх кожен раз. Ці файли можуть бути тимчасово збережені у вашому браузері після завантаження. Це називається кешуванням.
Наприклад, якщо файл кешовано, HTML завантажується з веб-сервера під час відвідування тієї самої сторінки. Інші файли переглядаються та запускаються з використанням локально збережених файлів без їх завантаження, якщо є кеш. Це зменшує навантаження на сервер і дозволяє клієнту переглядати сторінку на високій швидкості, не споживаючи пропускну здатність зв'язку.
Проблеми, викликані кешуванням
Чи однакові файли, розміщені на сервері та кешовані файли, зазвичай залежить від шляху до файлу, описаного в HTML. Той самий шлях до файлів є в основному кешовані файли. (Можуть бути й інші умови, але шлях до файлу визначений)
Нижче наведено приклад шляху до файлу. Застосовуються атрибути параметрів href і src.
<!-- スタイルシート (.css) -->
<link rel="stylesheet" href="/css/site.css" />
<!-- 画像ファイル -->
<img src="/image/sample.png" alt="サンプル画像" />
<!-- JavaScript (.js) -->
<script src="/js/site.js"></script>
Однак така поведінка може бути проблемою.
Наприклад, якщо користувач має файл JavaScript версії 1 при першому доступі до нього, файл JavaScript версії 1 кешування. Потім сервер публікує файл JavaScript версії 2. Якщо шлях до файлу JavaScript був таким самим, коли користувач відвідував ту саму сторінку, може використовуватися файл Javascript версії 1, кешований без завантаження файлу JavaScript версії 2. Це може викликати дефекти, які громадськість не має наміру.
У цей час, я думаю, що ви часто бачите "Спробувати видалити кеш" в якості одного з контрзаходів на стороні користувача, але це може бути причиною.
Як боротися з проблемами кешу на стороні сервера
Як уже згадувалося вище, чи використовуються кешовані файли, багато в чому залежить від шляху до файлу (URL).
Тому під час оновлення файлу його можна примусово завантажити, змінивши ім'я файлу.
Наприклад, якщо файл версії 1
<link rel="stylesheet" href="/css/site.css" />
Під час оновлення файлу версії 2
<link rel="stylesheet" href="/css/site2.css" />
Site2 .css на стороні клієнта.
Однак, якщо зробити це вручну, він може бути громіздким і схильним до помилок змінювати шляхи і перейменовувати фізичні файли.
Додавання параметрів запиту до шляху до файлу
Спосіб роботи Web дозволяє додавати параметри запиту з комбінацією клавіш і значень після шляху. У механізмі кешування клієнта, навіть якщо фізичні файли однакові, якщо параметри запиту різні, вони будуть розпізнані як окремі файли. Параметри запиту — це значення, які не мають значення, якщо немає мети використання, навіть якщо вони додані.
Параметри запиту можна додавати до шляху в такому форматі:
<!-- クエリパラメータなし -->
<link rel="stylesheet" href="/css/site.css" />
<!-- クエリパラメータあり -->
<link rel="stylesheet" href="/css/site.css?key=value" />
За допомогою цього механізму потрібно змінити шлях, але перейменовувати фізичний файл не потрібно.
Автоматичне додавання параметрів запиту до програми (неправильний приклад)
Автоматично додаючи цей параметр запиту до програми, У разі змінення статичного файлу не потрібно змінювати шлях до файлу вручну.
Простим прикладом є додавання поточного часу до параметрів запиту, коли користувач має доступ до веб-сторінки. Це дуже легко, тому що я думаю, що ви можете писати в одному рядку на будь-якій мові програмування. Я думаю, що приклад покоління виглядає наступним чином:
<link rel="stylesheet" href="/css/site.css?20210223120000" />
Однак у цього є недолік, що перевага кешування взагалі втрачається. Шлях змінюється щоразу під час відвідування веб-сторінки, навіть якщо це той самий файл, що й попередній. Оскільки він розпізнається як окремий файл, CSS файли завантажуються з сервера кожного разу. Старі версії файлів більше не будуть використовуватися, але це те ж саме, що просто не використовувати функції кешування.
ASP.NET версії, додавши параметри запиту в Core
Alcause немає попередньої ASP.NET Core забезпечує стандартне рішення цієї проблеми кешування.
Вам просто потрібно додати атрибут до тегу, який asp-append-version="true" описує шлях до файлу наступним чином:
<link rel="stylesheet" href="~/css/site.css" asp-append-version="true"/>
<img src="/image/sample.png" asp-append-version="true"/>
<script src="~/js/site.js" asp-append-version="true"></script>
Якщо ви дійсно відвідуєте сторінку після її публікації в Інтернеті, вона буде розширюватися наступним чином:
<link rel="stylesheet" href="/css/site.css?v=S2ihmzMFFc3FWmBWsR-NiddZWa8kbyaQYBx2FDkIoHs" />
<img src="/image/sample.png?v=Z0tUqQmLt_3L_NSzPmkbZKxL8cMxglf08BwWb5Od5z4" />
<script src="/js/site.js?v=dLGP40S79Xnx6GqUthRF6NWvjvhQ1nOvdVSwaNcgG18"></script>
Додається випадковий рядок, але це не змінюється при кожному доступі. Цей рядок є значенням гашів і генерується на основі вмісту файлу, на який укаяте. Таким чином, той самий рядок генерується до тих пір, поки вміст файлу не зміниться. Якщо вміст файлу зміниться, його буде змінено на новий рядок.
Це гарантує, що кешовані файли є кращими, оскільки, якщо файли однакові, шляхи однакові. Під час оновлення файлу шлях змінюється, тому можна завантажити та використати новий файл.
До asp-append-version="true" речі, цей атрибут стандартний тільки для статичних файлів, розміщених в папці wwwroot.
Зауважте, що випадкові рядки не розгортаються, якщо встановлено інші файли.
Про програму-зразок
Шаблон проекту за промовчанням .js asp-append-version сайту.
Сайт.css до asp-append-version нього не додано.
Зразок _Layout.cshtml програми додає сайт.js і .css частину asp-append-version файлу.
Ми також додаємо теги img asp-append-version як посилання.