Использование dangerouslySetInnerHTML каковы риски и что мешает кому-либо удалить настройку через браузер?

#javascript #html #reactjs #frontend #browser-security

#javascript #HTML #reactjs #интерфейс #браузер-безопасность

Вопрос:

Я использую dangerouslySetInnerHtml для рендеринга html из шаблона mustache в React. Я читаю о проблемах безопасности этого, и это ново для меня.

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

Я читал, что вам следует «очистить» html. Приведенные в этом примеры предоставляют библиотеки, которые люди используют, где они очищают html, а затем используют этот исправленный вариант в dangerouslySetInnerHtml атрибуте.

Однако что мешает кому-либо просто зайти в JS и отредактировать html с помощью devtools или чего-то еще, чтобы очистка не происходила.

У меня не так много контекста по этому вопросу, поэтому, извините, я не смог быть более конкретным с примером.

Я перепробовал множество парсеров для реагирования html. Пришел к выводу, что мне нужно использовать dangerouslySetInnerHTML

Ответ №1:

Вы должны «очистить» HTML, когда этот HTML-код поступает от пользователя, как будто у вас есть входные данные, чтобы пользователь мог отправить HTML-код на ваш сервер, а затем показать его в браузере других пользователей.

«Однако что мешает кому-либо просто зайти в JS и отредактировать html с помощью devtools или чего-то еще, чтобы очистка не происходила». Это кажется неправильным, извините. причина в том, что опасный HTML-код может повлиять только на пользователя, который его просматривает. Если они редактируют JS-файлы в своем браузере, это не имеет смысла, потому что они являются жертвой самих себя.

Подробнее о https://en.wikipedia.org/wiki/Cross-site_scripting (для чего используется очистка HTML)

Комментарии:

1. Хорошо, это имеет гораздо больше смысла. Я думаю, у меня были эти идеи, и мне нужен был кто-то вроде вас, чтобы пролить ясный подтверждающий свет на вещи.