私は、AJAXとXmlHttpRequestを直接操作することと、Ajaxを行うこととの間にいくつかの奇妙な点があります。私が下に挙げたテストケースは古典的なASPですが、それは私の喜びです。サーバ側の技術は問題ではありません。AJAX - jQuery対ダイレクトXmlHttpRequestスクリプトの奇妙さを返す
私は自分の愚かさを排除していないと付け加えなければならない - 私はそれが何であるかをよく分かっていない:-)これは完全に自明ではないかもしれないが、私の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
...そこにはアクセス制御ヘッダが要求にない、また任意の応答ヘッダに返されることに注意してください。
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で発生します。
<%@ 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 jQueryの場合、その追加されたコードは、DOMに追加実行
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);
}
Ta ...私はそれがぼんやりとしたものになると思っていましたが、何が欠けているのか分かりませんでした。 –