Словарь веб-разработчика

WAF (Web Application Firewall) — брандмауэр прикладного уровня (L7), анализирующий HTTP-трафик и блокирующий вредоносные запросы до того как они достигнут приложения. Защищает от SQL-инъекций, XSS, CSRF, DDoS на уровне HTTP и других атак из OWASP Top 10. Режимы работы Detection mode — логирует подозрительные запросы, но не блокирует. Для начальной настройки Prevention mode — активно блокирует атаки Типы Network-based — аппаратное решение перед серверами Host-based — модуль на сервере (ModSecurity для Nginx/Apache) Cloud-based — Cloudflare WAF, AWS WAF, Fastly. Проще всего подключить Ограничения WAF — не замена безопасному коду, а дополнительный слой защиты. False positives (блокировка легитимных запросов) требуют тонкой настройки правил.

Web Components — набор нативных браузерных API для создания собственных HTML-элементов с инкапсулированной логикой и стилями. Без фреймворка, на чистом JavaScript. Три технологии Custom Elements — регистрация собственного тега: <my-button> Shadow DOM — изолированное дерево DOM со своими стилями, не вытекающими наружу HTML Templates — <template> и <slot> для контента Пример class MyCard extends HTMLElement { connectedCallback() { const shadow = this.attachShadow({ mode: 'open' }); shadow.innerHTML = ` .card { border: 1px solid #ddd; padding: 16px; } `; } } customElements.define('my-card', MyCard); // Использование в HTML: // Контент здесь Web Components vs React/Vue Web Components — нативный стандарт без зависимостей. React/Vue — библиотеки с лучшим DX и экосистемой. Можно комбинировать: Lit (Google) упрощает написание Web Components.

Webhook — механизм push-уведомлений между сервисами: вместо того чтобы постоянно спрашивать «есть новости?» (polling), внешний сервис сам отправляет HTTP POST-запрос на ваш URL при возникновении события. Эффективнее и проще, чем polling.ПримерыStripe отправляет payment.succeeded на ваш endpoint — вы активируете подпискуGitHub отправляет push event — ваш CI запускает билдTelegram Bot API отправляет новое сообщение на ваш webhook URLБезопасностьВнешний сервис подписывает тело запроса секретным ключём (HMAC-SHA256). Ваш обработчик проверяет подпись до выполнения каких-либо действий — чтобы убедиться, что запрос пришёл действительно от доверенного источника.НадёжностьОбработчик webhook должен отвечать быстро (200 OK) и ставить реальную работу в очередь — иначе внешний сервис может счесть доставку неудачной и повторить запрос.

WebSocket — протокол полнодуплексного соединения между браузером и сервером поверх TCP. В отличие от HTTP, где клиент всегда инициирует запрос, WebSocket позволяет серверу отправлять данные клиенту в любой момент — идеально для чатов, онлайн-игр и live-дашбордов.Как устанавливается соединениеНачинается как обычный HTTP-запрос с заголовком Upgrade: websocket. Сервер подтверждает апгрейд — и TCP-соединение остаётся открытым. Обе стороны могут отправлять сообщения в любой момент без накладных расходов нового HTTP-запроса.АльтернативыSSE (Server-Sent Events) — односторонний поток от сервера к клиенту, проще в реализацииLong polling — клиент ждёт ответа сервера, затем сразу делает новый запрос. Устаревший подходСерверные библиотекиNode.js: Socket.io, ws. PHP: Ratchet, Swoole, ReactPHP. Go: gorilla/websocket. Python: websockets, FastAPI WebSocket. В продакшне часто используют отдельный WebSocket-сервер рядом с основным HTTP-приложением.