html() 与 innerHTML jquery/javascript &XSS 攻击
[英] html() vs innerHTML jquery/javascript & XSS attacks
本文介绍了html() 与 innerHTML jquery/javascript &XSS 攻击的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我正在我自己的代码上测试 xss 攻击.下面的示例是一个简单的框，用户可以在其中输入他想要的任何内容.按测试！"后按钮，JS 会将输入字符串显示为两个 div.这是我为了更好地解释我的问题而制作的示例:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script><script type="text/javascript">函数 testIt(){var input = document.getElementById('input-test').value;var testHtml = document.getElementById('test-html');var testInnerHTML = document.getElementById('test-innerHTML');$(testHtml).html(输入);testInnerHTML.innerHTML = 输入；}<head>这是一个测试</head><身体><input id="input-test" type="text" name="foo"/><input type="button" onClick="testIt();"值=测试！"/><div id="test-html">
<div id="test-innerHTML">
如果您尝试将其复制到 .html 文件中并运行它，它将正常工作，但是如果您尝试输入 <script>alert('xss')</script>，只会抛出一个警告框:`test-html' div 中的那个(带有 html() 函数).
我真的不明白为什么会这样，而且，用萤火虫检查代码给了我这个结果(在注入脚本后)
这是一个测验<input id="input-test" type="text" name="foo"><input type="button" value="test!"onclick="testIt();"><div id="test-html">
<div id="test-innerHTML"><脚本>警报('xss')
如您所见，test-html div 为空，test-innerhtml div 包含脚本.有人能告诉我为什么吗?是因为 html() 对脚本注入或类似的东西更安全吗?
提前致谢，最好的问候.
解决方案
JQuery 去掉了 script 标签，这就是为什么你看不到它附加到 dom 的原因，更不用说执行了.
要查看 jquery 为何将其删除的解释，您可以在此处查看 John Resig 的回复:https://forum.jquery.com/topic/jquery-dommanip-script-tag-will-be-removed
希望能帮到你
I'm testing xss attacks on my own code. The example beneath is a simple box where an user can type whatever he wants. After pressing "test!" button, JS will show the input string into two divs.This is an example I made to explain better my question:
<html>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
function testIt(){
var input = document.getElementById('input-test').value;
var testHtml = document.getElementById('test-html');
var testInnerHTML = document.getElementById('test-innerHTML');
$(testHtml).html(input);
testInnerHTML.innerHTML = input;
}
</script>
<head>this is a test</head>
<body>
<input id="input-test" type="text" name="foo" />
<input type="button" onClick="testIt();" value="test!"/>
<div id="test-html">
</div>
<div id="test-innerHTML">
</div>
</body>
if you try to copy it into a .html file and run it, it will work fine, but if you try to input <script>alert('xss')</script>, only one alert box will be thrown: the one inside `test-html' div (with html() function).
I really can't understand why this is happening, and also, inspecting the code with firebug gives me this result (after injecting the script)
<body>
this is a test
<input id="input-test" type="text" name="foo">
<input type="button" value="test!" onclick="testIt();">
<div id="test-html"> </div>
<div id="test-innerHTML">
<script>
alert('xss')
</script>
</div>
</body>
as you can see test-html div is empty, and test-innerhtml div contans the script. Can someone tell me why? Is because html() is more secure against scripts injection or something similar?
Thanks in advance, best regards.
解决方案
JQuery strips out the script tags, which is why you aren't seeing it append to the dom let alone executing.
To see an explanation of why jquery strips it out, you can see John Resig's reply here: https://forum.jquery.com/topic/jquery-dommanip-script-tag-will-be-removed
Hope this helps
这篇关于html() 与 innerHTML jquery/javascript &XSS 攻击的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
