Реалізація аутентифікації через Passkeys (WebAuthn) на сайті
Клієнти приходять до нас з типовою проблемою: паролі зламують, фішинг зростає, користувачі кидають форму входу. Ми впроваджуємо безпарольну аутентифікацію через Passkeys (WebAuthn) — стандарт FIDO2, який захищає акаунти від крадіжки та знижує навантаження на підтримку. Наш досвід на 50+ проектах підтверджує: Passkeys у десятки разів безпечніші за традиційні паролі. Це не просто зручність — це зміна парадигми: замість того щоб пам'ятати складні комбінації, користувач підтверджує особу одним дотиком.
Passkeys — стандарт FIDO2/WebAuthn для безпарольної аутентифікації. Користувач входить через біометрію пристрою (Touch ID, Face ID, Windows Hello) або апаратний ключ YubiKey. Жодного пароля, жодного SMS — криптографічна пара ключів зберігається в безпечному сховищі пристрою. Приватний ключ ніколи не покидає пристрій, сервер зберігає лише публічний ключ. Навіть якщо база даних скомпрометована, зловмисник не зможе підробити аутентифікацію.
Passkeys підтримуються в сучасних браузерах Chrome, Safari, Firefox. iOS 16+ та Android 9+ синхронізують ключі через iCloud Keychain та Google Password Manager. Це означає, що користувач може ввійти на будь-якій платформі, де є його акаунт, без повторної реєстрації.
Як WebAuthn вирішує проблему фішингу?
Порівняйте з паролями: користувач може перейти за посиланням з листа та ввести дані на підробленому сайті. WebAuthn прив'язує підпис до домену — браузер перевіряє origin при кожному виклику. Навіть якщо користувач потрапить на фішинговий сайт, його приватний ключ не спрацює. Це і є головна перевага: неможливість фішингової атаки.
| Метод |
Безпека |
UX |
Вартість підтримки |
| Пароль |
Низька (фішинг, злом) |
Середня (запам'ятовування) |
Висока (скидання) |
| OTP/SMS |
Середня (SIM-своп) |
Низька (очікування коду) |
Середня (SMS-шлюз) |
| Passkeys |
Висока (криптографія) |
Висока (один клік) |
Низька (немає скидань) |
Впровадження Passkeys знижує витрати на підтримку на 50–70% за рахунок скорочення звернень зі скидання паролів. На одному з проектів ми впровадили WebAuthn для інтернет-магазину з 20 000 активних користувачів. Через місяць кількість звернень до підтримки зі скидання пароля впала на 80%, а конверсія входу зросла на 15%.
Чому Passkeys безпечніші за традиційні паролі?
Паролі можна вкрасти фішингом, вгадати перебором або витягти з бази даних. Passkeys використовують криптографію на еліптичних кривих (ECDSA) — кожен ключ унікальний і прив'язаний до домену. Навіть якщо зловмисник отримає доступ до сервера, він не зможе обчислити приватний ключ. За статистикою, фішингові атаки за допомогою WebAuthn стають неможливими у 100% випадків. Це робить Passkeys у 100 разів безпечнішими за паролі.
Архітектура WebAuthn
Процес реєстрації:
- Сервер генерує випадковий challenge (16 байт).
- Браузер передає challenge пристрою через Credential Management API.
- Пристрій перевіряє біометрію, створює ключову пару, повертає публічний ключ та attestation.
- Сервер зберігає публічний ключ та ID облікового запису.
Процес аутентифікації:
- Сервер генерує новий challenge.
- Браузер передає його пристрою.
- Пристрій підписує challenge приватним ключем.
- Сервер верифікує підпис публічним ключем.
Процес реєстрації та аутентифікації
Реєстрація Passkey
Приклад на PHP з бібліотекою web-auth/webauthn-lib:
$publicKeyCredentialCreationOptions = $webauthnServer->generateCreationOptions($user);
// Відправляємо опції на фронтенд
Аутентифікація через Passkey
$publicKeyCredentialRequestOptions = $webauthnServer->generateRequestOptions($user);
// Фронтенд отримує challenge та підписує
Discoverable Credentials
Сучасні Passkeys підтримують режим без введення email — браузер пропонує всі доступні ключі. На сервері ідентифікатор користувача витягується з userHandle у відповіді. Це спрощує вхід на спільних пристроях та підвищує зручність.
Управління пристроями
Показуємо список зареєстрованих Passkeys з назвою пристрою, датою останнього використання та кнопкою видалення. Після видалення запису користувач не зможе ввійти через цей ключ. Рекомендуємо синхронізувати ключі через хмарні сервіси — це знижує ризик втрати доступу.
Fallback
Завжди надаємо альтернативний спосіб входу на випадок втрати всіх пристроїв: email+пароль або Magic Link. Це страховка, яка не знижує безпеку, якщо налаштована правильно.
Типові помилки при впровадженні
- Відсутність перевірки DomainLinkage: приватний ключ можна використовувати лише на тому домені, для якого зареєстровано.
- Ігнорування User Verifier: без біометрії Passkeys не захищають від фізичного доступу до пристрою.
- Неправильна обробка timeout: challenge має закінчуватися через 5 хвилин, інакше підвищується ризик повторної атаки.
- Використання одного ключа для кількох доменів — порушення специфікації.
Що входить в роботу
- Документація з інтеграції та API
- Доступ до приватного репозиторію з кодом
- Тестування на реальних пристроях (iOS, Android, Windows, macOS)
- Підтримка після впровадження протягом 30 днів
- Рекомендації з безпеки та оновлення
Строки робіт
| Етап |
Час |
| Встановлення, конфігурація |
1 день |
| Реєстрація: backend + frontend |
2 дні |
| Аутентифікація: backend + frontend |
2 дні |
| Управління пристроями + fallback |
1 день |
| Тестування на реальних пристроях |
1–2 дні |
Разом: 7–9 робочих днів.
Середня вартість впровадження Passkeys для невеликого сайту становить $1500–$3000. При цьому економія на підтримці сягає до 60% на рік. Ми надаємо гарантію сумісності на 30 днів та сертифіковані розробки від експертів FIDO Alliance. Адже безпека акаунта підвищується до рівня, неможливого для фішингу.
Технічні деталі реалізації
Для серверної частини використовуємо бібліотеки з підтримкою WebAuthn (PHP, Node.js, Python). На фронтенді — Credential Management API. Ключі зберігаються в захищеному сховищі пристрою (Secure Enclave, TPM).
Реалізуємо під ключ. Замовте впровадження Passkeys на вашому сайті — отримайте консультацію та оцінку проекту. Зв'яжіться з нами, щоб обговорити деталі вашого проекту.
Аутентифікація та авторизація: OAuth, JWT, сесії, RBAC, 2FA
На одному проєкті токен JWT із роллю admin: false» міг бути змінений клієнтом на admin: true» — і сервер прийняв його без верифікації підпису. Ми знайшли це на тестовому стенді, коли робили огляд існуючої кодової бази новому замовнику. Причина — застаріла бібліотека jsonwebtoken, яка в певних версіях пропускала алгоритм «none». Наслідки — повний доступ до адміністративного API для будь-якого зареєстрованого користувача. Замовник не знав про це, але ми оцінили ризик, переписали модуль авторизації під ключ і запровадили обов’язкову перевірку алгоритму. Тепер подібних інцидентів немає. За 7+ років ми реалізували понад 50 проєктів із системами аутентифікації та авторизації користувачів — від стартапів до корпоративних рішень, що працюють із фінансовими даними.
Чому JWT не варто зберігати в localStorage?
JWT складається з трьох частин: header (алгоритм), payload (дані), signature (підпис). Підпис верифікує, що payload не змінено. Без перевірки підпису — це просто base64-encoded JSON, який будь-хто може підробити. Помилки, які бачимо в коді регулярно:
- Зберігання в localStorage. LocalStorage доступний будь-якому JS на сторінці — XSS-атака читає токен і відправляє на сервер зловмисника. Access token в пам’яті (змінна модуля), refresh token в httpOnly cookie — правильна схема.
- Довгоживучі access-токени. Access token на 7 днів без можливості відкликання — витік дає 7 днів доступу. Стандарт: 15 хвилин для access token, 30 днів для refresh token з ротацією. При кожному використанні refresh token видається новий, старий інвалідується — якщо старий хтось використовує повторно, це детектується як Token Reuse Attack, уся сім’я токенів відкликається.
- Зберігання секретних даних у payload. JWT payload не зашифровано, лише підписано — його видно в base64. Паролі, платіжні дані, особиста інформація — не в JWT. Алгоритм RS256 (асиметричний) кращий за HS256 (симетричний) у мікросервісній архітектурі: сервіси можуть верифікувати токен публічним ключем, не маючи доступу до секрету для його створення.
Як обрати між сесіями та токенами?
Сесії зберігають стан на сервері (Redis, database) — сервер може миттєво відкликати сесію. При масштабуванні на кілька інстансів потрібен спільний store (Redis Cluster). Cookie з session ID — httpOnly, Secure, SameSite=Strict.
Stateless JWT не вимагають server-side storage, масштабуються горизонтально. Але відкликання токена до завершення терміну — тільки через blacklist (Redis), що частково знімає перевагу stateless.
| Параметр |
Сесії (серверний стан) |
JWT (stateless) |
| Відкликання |
миттєве (видалити запис у Redis) |
лише через blacklist, потребує storage |
| Масштабування |
потрібен спільний Redis |
горизонтальне без додаткових компонентів |
| Безпека XSS |
токен у httpOnly cookie захищений |
при зберіганні в localStorage — ризик |
| Складність реалізації |
проста (сесійний middleware) |
вища (управління refresh, ротація) |
Для більшості веб-додатків сесії простіші та безпечніші. JWT має сенс для API, що споживаються з мобільного додатку, та для мікросервісної архітектури. Оцініть ваш сценарій — ми допоможемо обрати правильний підхід.
OAuth 2.0 та OpenID Connect
OAuth 2.0 — протокол делегованої авторизації, не аутентифікації. «Увійти через Google» — це OpenID Connect поверх OAuth 2.0, який додає id_token з даними користувача. Authorization Code Flow з PKCE — єдиний правильний flow для браузерних SPA та мобільних додатків. Implicit Flow застарів і небезпечний. PKCE (Proof Key for Code Exchange) захищає від перехоплення authorization code.
Реалізація OAuth сервера: не пишемо з нуля. Keycloak (open source, self-hosted), Auth0, Okta — готові рішення. Laravel Passport або Laravel Sanctum для серверних додатків. NextAuth.js для Next.js — підтримує 50+ провайдерів з коробки. Для B2B продуктів з корпоративними клієнтами — SAML 2.0 SSO. Корпоративні IT-відділи часто вимагають його замість OAuth. @boxyhq/saml-jackson — node.js бібліотека для SAML → OAuth2 адаптера.
RBAC, ABAC, ReBAC — що і коли застосовувати
Role-Based Access Control — у користувача є ролі, у ролей — права. Проста реалізація: user → roles → permissions. Але коли з'являється ресурсна авторизація («користувач може редагувати лише свої пости»), RBAC ускладнюється. У такому разі використовуйте Spatie Laravel Permission (стандарт для Laravel): поліморфні ролі та права, кешування, super-admin через gate. Інтеграція з Eloquent — $user->can('edit posts'), $user->hasRole('editor').
ABAC (Attribute-Based Access Control) — політики на основі атрибутів: користувача, ресурсу, середовища. Потрібен, коли правила доступу складні: «менеджер може переглядати замовлення свого регіону, якщо замовлення створено більше 24 годин тому». Casbin — популярна cross-language бібліотека для ABAC.
ReBAC (Relationship-Based Access Control) — Google Zanzibar model. Доступ визначається графом відносин: «користувач X є учасником команди Y, яка має доступ до проєкту Z». OpenFGA — open source реалізація від Okta.
Як ми це робимо: кейс із впровадження 2FA
Проєкт — платіжний шлюз для маркетплейсу. Потрібно було захистити доступ до операцій виводу коштів. Ми спроєктували систему:
- Основний пароль замінили на комбінацію пароль + TOTP (Google Authenticator). Використали
otplib (Node.js) для генерації та верифікації кодів.
- Під час першого підключення 2FA показували QR-код (base32-encoded secret) і генерували 10 одноразових backup-кодів, хешованих bcrypt. Відображали коди лише один раз.
- Secret для TOTP зберігали у зашифрованому вигляді в базі даних (AES-256-GCM, ключ у AWS KMS).
- На стороні фронтенду інтегрували
@simplewebauthn/browser для passkeys — біометрична аутентифікація як альтернатива паролю. Публічний ключ зберігали на сервері, private key на пристрої користувача.
- Результат: час на логін зріс на 5 секунд, але кількість зламаних акаунтів упала до нуля за пів року роботи. Гарантія безпеки — на рівні OWASP ASVS Level 2.
Також варто зазначити, що TOTP значно надійніше за SMS-верифікацію через SIM-swapping, тому для фінансових даних ми рекомендуємо TOTP або апаратні ключі.
Типові вразливості, які ми знаходимо
- Broken Object Level Authorization (BOLA/IDOR): /api/orders/12345 повертає замовлення без перевірки, чи належить воно поточному користувачу. Найпоширеніша вразливість API за OWASP. Кожен запит до ресурсу — перевірка через $user->can('view', $order).
- Mass Assignment: User::create($request->all()) — користувач передає is_admin: true в тілі запиту. Laravel вирішує через $fillable / $guarded, але часто забувають.
- Небезпечний CORS: Access-Control-Allow-Origin: * на API з авторизацією по cookie — credentials не передаються з wildcard origin, але якщо хтось зробив Allow-Credentials: true + Allow-Origin: * — це діра.
Penetration testing обов’язковий для продуктів з фінансовими даними або персональними даними користувачів. Ми проводимо аудит коду й інфраструктури на етапі приймання.
Що входить у роботу
Ми передаємо замовнику:
- Документацію архітектури авторизації (flow діаграми, опис токенів, політик доступу).
- Репозиторій із вихідним кодом, покритий unit- та integration-тестами.
- Конфігурацію для CI/CD (GitHub Actions/ GitLab CI) із перевірками безпеки.
- Доступи до середовищ (staging, production) із правами адміністратора.
- Інструкцію з експлуатації та супроводу.
- Підтримку після впровадження — 2 тижні безкоштовних консультацій.
Терміни та вартість
Базова аутентифікація (email/password + OAuth + JWT/сесії): 1–3 тижні. RBAC з детальними політиками доступу: 2–4 тижні. 2FA (TOTP + SMS): 1–2 тижні. WebAuthn/Passkeys: 2–3 тижні. Повна система аутентифікації для SaaS з multi-tenancy: 4–8 тижнів.
Вартість розраховується індивідуально залежно від обсягу та складності. Замовте консультацію — оцінимо ваш проєкт безкоштовно. Отримайте гарантію безпеки вашої авторизації користувачів.