Jquery 替换 .html() 函数,不会尝试重写 Redactor imperavi - Xss 漏洞上的 html
Jquery replacement for .html() function that won't try to rewrite the html on Redactor imperavi - Xss vulnerability
这被视为 XSS 漏洞问题。我正在使用来自 Imperavi 的编辑器组件,当 Html 无效时它似乎无法生成正确的输出值。
问题是当我们像这样插入字符串时:
<<SCRIPT a=2>qssQ5GkdwWU=7;//<</SCRIPT>
编校者删除脚本标签并生成此字符串。这是预期的,因为 XSS 攻击。
<qssQ5GkdwWU=7;//<
然后编校者尝试使用 html.(html)
将先前的值设置为编校者元素时出现问题。它会认为有一个元素并会输出:
<qssq5gkdwwu=7;> </qssq5gkdwwu=7;>
如何设置元素的值,同时防止这种行为?
您可以覆盖 JQuery 的 htmlPrefilter
功能:
htmlPrefilter: function( html ) {
return html;
},
如果出现特殊字符问题,请尝试像这样转义它们:
// trying to set following string as innerHTML
let c = '<qssQ5GkdwWU=7;//<';
// with default jquery
$('.one').html(c);
// modify filter function, and do your own character escaping
jQuery.htmlPrefilter = function(html) {
let clean = html.replace(/[&<"']/g, function(m) {
switch (m) {
case '&':
return '&';
case '<':
return '<';
case '"':
return '"';
default:
return ''';
}
});
return clean;
}
// now try on second div
$('.two').html(c);
<script src="https://code.jquery.com/jquery-3.6.0.js"></script>
One:<span class="one"></span><br>
Two:<span class="two"></span><br>
最好在加载 Redactor 之前执行上述脚本。
如果您决定自己进行清理,那么您可以使用 DOMPurify 或类似的库。
let content = 'Malicius content <img src="https://dummyimage.com/30" onload="this.style.border=`2px solid red`;alert(`attacked! :p`);" >';
// default jquery
$('.one').html(content);
// modify filter function, do your own sanitization
jQuery.htmlPrefilter = function(html) {
html = DOMPurify.sanitize(html);
console.log('sanitized: ', html)
return html;
}
// trying on second div
$('.two').html(content);
<script src="https://code.jquery.com/jquery-3.6.0.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/dompurify/2.3.4/purify.min.js" integrity="sha512-jGh38w63cHRzfBHtyKgEMMkJswUFXDA3YXrDjaE8ptzxV5DDkLDUDjtGUy5tmDkOXHWsItKfFjocaEtj1WuVnQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
One:<span class="one"></span><br> Two:
<span class="two"></span><br>
第一张图片有红色边框。并且由于第二次消毒没有。
这被视为 XSS 漏洞问题。我正在使用来自 Imperavi 的编辑器组件,当 Html 无效时它似乎无法生成正确的输出值。
问题是当我们像这样插入字符串时:
<<SCRIPT a=2>qssQ5GkdwWU=7;//<</SCRIPT>
编校者删除脚本标签并生成此字符串。这是预期的,因为 XSS 攻击。
<qssQ5GkdwWU=7;//<
然后编校者尝试使用 html.(html)
将先前的值设置为编校者元素时出现问题。它会认为有一个元素并会输出:
<qssq5gkdwwu=7;> </qssq5gkdwwu=7;>
如何设置元素的值,同时防止这种行为?
您可以覆盖 JQuery 的 htmlPrefilter
功能:
htmlPrefilter: function( html ) {
return html;
},
如果出现特殊字符问题,请尝试像这样转义它们:
// trying to set following string as innerHTML
let c = '<qssQ5GkdwWU=7;//<';
// with default jquery
$('.one').html(c);
// modify filter function, and do your own character escaping
jQuery.htmlPrefilter = function(html) {
let clean = html.replace(/[&<"']/g, function(m) {
switch (m) {
case '&':
return '&';
case '<':
return '<';
case '"':
return '"';
default:
return ''';
}
});
return clean;
}
// now try on second div
$('.two').html(c);
<script src="https://code.jquery.com/jquery-3.6.0.js"></script>
One:<span class="one"></span><br>
Two:<span class="two"></span><br>
最好在加载 Redactor 之前执行上述脚本。
如果您决定自己进行清理,那么您可以使用 DOMPurify 或类似的库。
let content = 'Malicius content <img src="https://dummyimage.com/30" onload="this.style.border=`2px solid red`;alert(`attacked! :p`);" >';
// default jquery
$('.one').html(content);
// modify filter function, do your own sanitization
jQuery.htmlPrefilter = function(html) {
html = DOMPurify.sanitize(html);
console.log('sanitized: ', html)
return html;
}
// trying on second div
$('.two').html(content);
<script src="https://code.jquery.com/jquery-3.6.0.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/dompurify/2.3.4/purify.min.js" integrity="sha512-jGh38w63cHRzfBHtyKgEMMkJswUFXDA3YXrDjaE8ptzxV5DDkLDUDjtGUy5tmDkOXHWsItKfFjocaEtj1WuVnQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
One:<span class="one"></span><br> Two:
<span class="two"></span><br>
第一张图片有红色边框。并且由于第二次消毒没有。