Як використовувати HTTP заголовок Cache-Control

Колеги всім привіт.

У сьогоднішній статті ми поговоримо про те, як включити на вашому сайті HTTP заголовок Cache-Control, і навіщо його потрібно використовувати у своїх сайтах.

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

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

Cache-Control — відноситься до HTTP заголовків, цей заголовок вказує що дані які приходять від сервера потрібно кешувати браузером користувача, Cache-Control буде кешувати як в клієнтські запити, так і у відповіді веб-сервера. Політика Cache-Control включає спосіб кешування ресурсу, місце його кешування та максимальний вік до закінчення терміну дії часу життя даних.

Заголовок Cache-Control розбитий на директиви, найбільш поширені я описуватиму нижче в статті.

Приклад заголовка  Cache-control.

Cache-Control: Max-Age

Директива max-age вказує на максимальний час, протягом якого ресурс буде вважатися актуальним, визначає в секундах. По закінченні терміну дії, браузер повторно відправить запит на сервер, щоб отримати актуальні дані.

Наприклад вказавши заголовок cache-control: max-age=240 означає, що ресурс дійсний протягом 240 секунд, після чого браузер відправить запит повторно, щоб отримати актуальну сторінку з даними.

Cache-Control: No-Cache

Директива no-cache вказує на необхідність повторно надіслати запит на сервер для валідації сторінки, перш ніж використовувати кешовані дані сторінки.

Cache-Control: No-Store

Директива no-cache вказує браузеру, що дані які він отримує з сервера не кешувати. Такий варіант використання підходить зазвичай для конфіденційних даних таких як логін і пароль користувача та банківських карток.

Cache-Control: Public

Директива Public вказує що відповідь сервера може бути за кешована в будь-якому кеші.

Cache-Control: Private

Директива Private вказує, що відповідь призначена тільки для одного користувача і не повинна поміщатися в кеш, що розділяється. Наприклад, відповідь сервера на сторінку, позначену як приватну, може кешуватися браузером користувача, але не мережею доставки контенту CDN.

Щоб нам встановити  HTTP заголовок Cache-Control на сайті за допомогою php, нам потрібно скористатися спеціальною функцією яка призначена для встановлення HTTP заголовків, і вона називається header(). Вам потрібно перейти на ту сторінку, яку ви хочете кешувати і додати цю функцію в самий верх php файлу.

header("Cache-Control: max-age=3600");

Цим прикладом я вказую, що я хочу, щоб сторінка main мала можливість кешуватися в браузері користувача на одну годину. Не забуваємо, що час потрібно вказувати в секундах.

Якщо на вашому сайті не використовується мова php, а лише сама html, то для таких випадків ми можемо скористатися html тегом meta.

<meta http-equiv="Cache-Control" content="public, max-age=3600" />

Тут важливий момент полягає в тому, що заголовок Cache-Control потрібно вказувати саме в тілі тега head, а не де-небудь в іншому місці.

У підсумку колеги ми сьогодні познайомилися з дуже важливою річчю як заголовок HTTP Cache-Control. У цьому заголовку дуже багато різних директив, але я вам показував найпоширеніші і які ви 100% використовуватимете на своїх сайтах. Цей заголовок взагалі використовується разом з такими заголовками як Last-Modified і If-Modified-Since, але про цих заголовках я розповідатиму в інших статтях.

Всім дякую, я сподіваюся, що вам моя стаття хоч чимось допомогла.