Ми стикалися з ситуацією, коли клієнт втратив контроль над сайтом через Clickjacking: зловмисник вбудував форму авторизації в прозорий iframe і перехопив облікові дані. Після цього ми виробили надійну методику захисту, якою ділимося в цій статті. Наша команда з 5+ річним досвідом у веб-безпеці налаштує захист від Clickjacking під ключ, гарантуючи відсутність вразливостей. За статистикою, до 15% атак на веб-форми пов'язані з цією технікою. Правильна конфігурація заголовків знижує ризик на 99%.
Clickjacking — атака, при якій зловмисник вбудовує ваш сайт у прозорий iframe поверх іншої сторінки. Користувач думає, що клікає по кнопці стороннього ресурсу, але насправді взаємодіє з вашим інтерфейсом. Наслідки: ненавмисні перекази грошей, зміна налаштувань, підтвердження дій. Захист будується на блокуванні вбудовування через HTTP-заголовки.
Як працює атака Clickjacking?
Зловмисник створює сторінку-пастку з прозорим iframe, в який завантажує ваш сайт. Над iframe розміщуються привабливі елементи (кнопка «Отримати приз»), і користувач клікає по них, не підозрюючи, що натискає на приховану кнопку вашого сайту. Типові цілі: підписка на послуги, переказ коштів, зміна пароля. Без захисту наслідки можуть бути катастрофічними.
X-Frame-Options: простий захист
Найпростіший спосіб — заголовок X-Frame-Options. Він приймає два основних значення:
add_header X-Frame-Options "DENY" always; # або add_header X-Frame-Options "SAMEORIGIN" always; | Значення | Поведінка | Сумісність |
|---|---|---|
DENY | Забороняє вбудовування всюди | Всі сучасні браузери |
SAMEORIGIN | Дозволяє лише з того ж домену | Всі сучасні браузери |
ALLOW-FROM uri | Застаріло, не підтримується | Тільки старі версії IE |
Чому одного заголовка недостатньо?
X-Frame-Options не підтримує гнучкий дозвіл для декількох довірених доменів. Для цього потрібна директива frame-ancestors у Content-Security-Policy (CSP). Вона сучасніша і дає більше контролю. CSP frame-ancestors у 10 разів гнучкіша, оскільки дозволяє задавати кілька джерел і регулярні вирази.
add_header Content-Security-Policy "frame-ancestors 'none'" always; # або add_header Content-Security-Policy "frame-ancestors 'self' https://trusted-partner.com" always; frame-ancestors 'none' — еквівалент DENY. Для максимальної сумісності з IE встановлюють обидва заголовки.
| Аспект | X-Frame-Options | CSP frame-ancestors |
|---|---|---|
| Гнучкість | Тільки одиничне джерело | Множина доменів, регулярні вирази |
| Підтримка браузерів | Всі, включаючи IE | Сучасні, IE10+ з CSP |
| Застарівання | Вважається застарілим | Актуальна специфікація |
Налаштування в Apache
Header always set X-Frame-Options "SAMEORIGIN" Header always set Content-Security-Policy "frame-ancestors 'self'" Налаштування в Laravel
// app/Http/Middleware/SecurityHeaders.php public function handle($request, Closure $next) { $response = $next($request); $response->header('X-Frame-Options', 'DENY'); $response->header('Content-Security-Policy', "frame-ancestors 'none'"); return $response; } Реєструємо middleware в Kernel.php і отримуємо глобальний захист.
Винятки для віджетів
Якщо частина сайту навмисно вбудовується (платіжна форма, віджет, embed-плеєр), застосовують гранулярне налаштування через CSP на конкретних маршрутах, а не глобально. Наприклад, у Laravel можна встановити заголовки лише для певних URI.
Як ми забезпечуємо захист від Clickjacking?
Наш процес включає кілька етапів:
- Аудит поточної конфігурації — перевіряємо заголовки, шукаємо вразливості.
- Проектування політики — вибираємо значення для X-Frame-Options та CSP з урахуванням бізнес-вимог.
- Реалізація — додаємо заголовки на всіх серверах (Nginx, Apache, IIS) та в коді застосунку.
- Тестування — перевіряємо вбудовування через iframe на різних браузерах, включаючи мобільні.
- Документація — фіксуємо конфігурацію, передаємо доступ і навчання вашій команді.
Ми виконали понад 50 проєктів з налаштування безпеки, гарантуючи захист від Clickjacking. Середня економія клієнта від запобігання атаці — до 100 000 гривень (в еквіваленті).
Що входить у роботу
- Налаштування заголовків на всіх серверах (до 5 серверів включено).
- Інтеграція в код на Laravel, Symfony, Yii та інших фреймворках.
- Тестування в браузерах: Chrome, Firefox, Safari, Edge, IE11.
- Аудит на предмет інших вразливостей (CSP, HSTS, X-Content-Type-Options).
- Звіт з результатами та рекомендаціями.
Типові помилки при налаштуванні
- Використання тільки X-Frame-Options без CSP — не захищає від атак з множинними джерелами.
- Встановлення
ALLOW-FROM— цей параметр не працює в сучасних браузерах, дає хибне відчуття безпеки. - Глобальна заборона iframe, коли потрібна функціональність віджетів — вирішується гранулярними правилами.
Термін реалізації: від 1 до 5 днів залежно від складності інфраструктури. Вартість розраховується індивідуально — оцінимо проєкт після ознайомлення з конфігурацією. MDN по X-Frame-Options рекомендує використовувати обидва заголовки для найкращої сумісності. Зв'яжіться з нами, щоб отримати консультацію та замовити налаштування захисту від Clickjacking. Захистіть свій сайт вже сьогодні — запобігання атаці коштує набагато менше, ніж її наслідки.