OWASP: методы безопасности фронтенда
Основное правило для защиты от XSS атака, это санитизировать всё что может прийти от пользователя, любой пользовательский вывод где в теории могут появится данные введенные руками.
Основное правило для защиты от XSS атака, это санитизировать всё что может прийти от пользователя, любой пользовательский вывод где в теории могут появится данные введенные руками.
Основные способы атак для фронденда есть в статье.
Довольно частой проблемой стало появление атак через подключаемые пакеты NPM или используя CDN с библиотеками. Как правило такие вредные скрипты пытаются как можно больше нанести ущерба от показа простой рекламы до удаления всей ОС. (в случае установки глобальных пакетов с доступом через рут).
Но если вы установили проверенную и надежную библиотеку/фреймворк/, это не значит, что вы не получите проблемы с безопасностью. Любая вставка исполняемого кода в формате HTML приведет к уязвимости и поэтому старайтесь не использовать такие вставки. Как правило, если вы используете ESLint, то он предупредит о возможных проблемах в нативном JS, так и в Vue.js, React.js и др.
Многое сейчас по безопасности делает браузер, но необходимо убедится, что вы используете заголовки для вашего сайта.
Устанавливается в качестве HTTP header заголовка и в нем можно перечислить, откуда можно взять контент для исполнения на вашей странице. Например туда можно добавить ваши CDN или иные библиотеки которым вы доверяете.
// default-src для перечисления разрешённых источников по умолчанию
// self - указывает на текущий домен
Content-Security-Policy: default-src 'self' *.trusted.ru
Кроме всего, заголовок обладает и другими полезными фишками, поэтому посмотрите статью на хабре.
Это заголовок для политики безопасности который запрещает использовать сайт без HTTPS. В заголовке устанавливается age параметр и затем, браузер все HTTP-запросы использует через HTTPS.
Strict-Transport-Security: max-age=30534000;
Политика единого источника — для использования ресурсов только со своего домена, при чем исключительно по uri схеме: http, домен и порт. Флаг запретит использовать с поддоменов или другому http соединению.
Чтобы обезопасить хранимые данные в куках, их можно закрыть флагом httpOnly и куки не будут доступны на стороне клиента (запись/чтение). Например, там можно хранить токены типа JWT. Второй способ безопасного хранение это в памяти браузера, пока страница не будет перезагружена, что конечно не круто для пользователей :).
Возьмите в привычку учитывать всегда степень безопасности вашего кода или тогда когда вы делаете код-ревью. Пользовательский вывод всегда должен быть обработан. Не забывайте, что небезопасным сайтом вы можете подставить пользователя и нанести ему серьезный ущерб.
Рассказали о полезных фронтенд-инструментах для повышения производительности.
Рассказываем о 18 репозиториях GitHub, которые обязательно нужно занести в закладки. Они помогут вам на пути к кодингу.
Мир разработки программного обеспечения не стоит на месте. Недавние изменения в Node.js и Bun взволновали сообщество разработчиков. На фоне этих событий Next.js смягчает требования к React 19 для маршрутизатора Pages, а Astro представляет новую функциональность для управления контентом.
Известно, что работа над переводом Joomla на русский язык идёт на GitHub.