Я использую React для создания веб-приложения, в котором хранятся документы.Они создаются в HTML, а затем хранятся в базе данных.Чтобы показать их в приложении, я загружаю HTML-код внутри div
, используя dangerouslySetInnerHTML
.
<div dangerouslySetInnerHTML={{__html: this.props.page.content}} />
. Даже при этом все прекрасно работает, имя dangerouslySetInnerHTML
предлагает уделять больше вниманияв этом случае, но мне интересно, что именно можно сделать, чтобы оставаться достаточно гибким, чтобы загружать HTML и отображать его в веб-приложении.Я считаю, что слово опасный относится к опасности межсайтового скриптинга, а это означает, что скрипт может быть внедрен, выполняя вредоносный код.
В качестве контрмеры я думал о том, чтобы очистить код HTML доразбор его до div
.Одна библиотека, обращающаяся к этому, является DOMPurify .Другим способом было бы преобразовать HTML-код из базы данных непосредственно в React Elements с помощью html-Reaction-parser .
Это был бы правильный подход?Или есть альтернативы dangerouslySetInnerHTML
?