AJAX - jQuery vs direct XmlHttpRequest返回脚本奇怪

时间:2012-03-14 10:19:12

标签: jquery ajax xmlhttprequest

我试图在使用jQuery执行AJAX与直接操作XmlHttpRequest之间找到一些奇怪的底线。我在下面的测试用例是经典ASP,但这只是我的便利 - 服务器端技术应该无关紧要。

我应该补充一点,我并没有排除我的愚蠢 - 我只是不确定它是什么:-)这可能是完全无足轻重的,我错过了一些相当明显的东西,但我不是让我的google-fu正确找出它是什么我错过了。

基本上我正在调用返回内联Javascript的代码。这将注入HTML页面,并打算执行。我完全控制所有代码和服务器(即,这不应该是跨域请求)。

我所看到的是jQuery版本的工作原理 - 它执行AJAX页面返回的脚本。直接方法不起作用。 javascript不会执行。

我的第一个想法是“XSS”,并且jQuery做了特定于标题的东西,但是我用fiddler进行了调查,并且我看到两个请求都出去了,两者都返回相同的代码。除了GET(jQuery在请求中粘贴一个查询字符串 - 我认为这是为了解决缓存问题)之外,我还有两个请求镜像完全镜像,但实际上请求看起来像这样:

GET http://myLocalMachine:8000/ajaxtest/ajax.asp HTTP/1.1
x-requested-with: XMLHttpRequest
Accept-Language: en-gb
Referer: http://hsl10161:8000/ajaxtest/main.html
Accept: text/html, */*
Accept-Encoding: gzip, deflate
User-Agent: Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.1; Trident/4.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; .NET4.0E; Tablet PC 2.0; .NET CLR 1.1.4322; InfoPath.3; MATM)
Host: myLocalMachine:8000
Connection: Keep-Alive

...请注意,请求中没有Access-Control标头,也没有在响应标头中返回:

HTTP/1.1 200 OK
Cache-Control: No-cache
Pragma: No-cache
Content-Type: text/html
Expires: Wed, 14 Mar 2012 10:00:57 GMT
Vary: Accept-Encoding
Server: Microsoft-IIS/7.5
X-Powered-By: ASP.NET
X-UA-Compatible: IE=EmulateIE7
Date: Wed, 14 Mar 2012 10:01:57 GMT
Content-Length: 55

此内容的其余部分是测试用例...描述的行为发生在IE8和Firefox 10上。

ajax.asp

<%@ Language=VBScript %>
<%
Option Explicit
Response.CacheControl = "No-cache"
Response.AddHeader "Pragma", "No-cache"
Response.Expires = -1
%>
<script type="text/javascript">alert('Hi!');</script>

main.html中

<html>
<head>
    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript" src="ajax.js"></script>
    <script type="text/javascript">
        function resetdiv()
        {
            $('#target').html('...');
        }
    </script>
    <title>AJAX test</title>
</head>
<body>
    <div id="target"></div>
    <button onclick="ajax1('ajax.asp', 'target')">With jQuery</button>
    <button onclick="ajax2('ajax.asp', 'target')">Without jQuery</button>
    <button onclick="resetdiv();">Reset</button>
</body>
</html>

ajax.js

function ajax1(strURL,target)
{
$.ajax({
    url: strURL,
    cache: false,
    dataType: "html",
    async: false,
    type: "GET",
    success: function (data) {
        $('#' + target).html(data);
    }
});
}

function ajax2(strURL,target)
{
var localAjax = new XMLHttpRequest();
localAjax.open("GET", strURL, false);
localAjax.setRequestHeader("Accept", "text/html, */*");
localAjax.setRequestHeader("x-requested-with", "XMLHttpRequest");
localAjax.onreadystatechange = function() {
    if (localAjax.readyState == 4)
    {
        var respText = localAjax.responseText;
        var targetField = document.getElementById(target);
        if (targetField != null) {
            targetField.innerHTML = respText;
        }
    }
}
localAjax.send(null);
}

1 个答案:

答案 0 :(得分:0)

当使用.html()添加时,jQuery执行添加到DOM的代码... JavaScript .innerHTML没有。您可以在代码上使用eval()函数使其执行