问题1
最近在学习AJAX,做小练习的时候,同一个AJAX请求,在Chrome里调试的时候就会提示跨域问题。如下
查阅资料发现是因为Chrome的安全策略导致的,我的解决办法是通过打开一个新的可跨域的chrome窗口实现的:
1.打开终端
2.输入下面的命令( 需要替换路径中的yourname )
open -n /Applications/Google\ Chrome.app/ --args --disable-web-security --user-data-dir=/Users/yourname/MyChromeDevUserData/
这是在mac的根目录在建了一个叫MyChromeDevUserData的文件夹,用于保存关闭安全策略后的用户信息的,名字可以随意取,位置也可以随意放,只要路径是正确的就可以。
3.第一次打开chrome有黄色背景色的“--disable-web-security”相关的提示,说明浏览器设置跨域成功。
问题2
接着当我发现我的xmlhttprequest.status==0
if (xmlhttp.readyState == 4) {
if ((xmlhttp.status >= 200 && xmlhttp.status < 300) || xmlhttp.status == 304) {
alert(xmlhttp.status);
http协议里可是没这个状态码的,这个时候如果还用if(xmlHttp.status==200)来判断运行,则会毫无结果。如果要在本地测试,最好写成if(xmlHttp.status== 200 || xmlHttp.status==0)
if (xmlhttp.readyState == 4) {
if ((xmlhttp.status >= 200 && xmlhttp.status < 300) || xmlhttp.status == 0) {
alert(xmlhttp.status);
这时候就有返回结果了。
贴一下我的代码
CDShow.html
<!DOCTYPE html>
<html>
<head>
<title>CD SHOW</title>
</head>
<body>
<div id="copy">
<button onclick="loadXMLDoc('xml/cd_catalog.xml')">Get CD INFO</button>
</div>
<script type="text/javascript" src="js/cd_show.js"></script>
</body>
</html>
cd_show.js
var xmlhttp;
function loadXMLDoc(url) {
xmlhttp = null;
if (window.XMLHttpRequest) {
//code for IE7,Firefox,Mozilla,etc.
xmlhttp = new XMLHttpRequest();
} else if (window.ActiveXObject) {
//code for IE5,IE6
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
if (xmlhttp != null) {
xmlhttp.onreadystatechange = onResponse;
xmlhttp.open("GET", url, true);
xmlhttp.send(null);
} else {
alert("Your browser does not support XMLHTTP.");
}
}
function onResponse() {
if (xmlhttp.readyState == 4) {
if ((xmlhttp.status >= 200 && xmlhttp.status < 300) || xmlhttp.status == 0) {
alert(xmlhttp.status);
txt = "<table border='1'>";
x = xmlhttp.responseXML.documentElement.getElementsByTagName("CD");
for (i = 0; i < x.length; i++) {
txt = txt + "<tr>";
xx = x[i].getElementsByTagName("TITLE");
try {
txt = txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
} catch (er) {
txt = txt + "<td></td>";
}
xx = x[i].getElementsByTagName("ARTIST");
try {
txt = txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
} catch (er) {
txt = txt + "<td></td>";
}
txt = txt + "</tr>";
}
txt = txt + "</table>";
document.getElementById('copy').innerHTML = txt;
}
}
}
cd_catalog.xml
<?xml version="1.0" encoding="ISO-8859-1"?>
<CATALOG>
<CD>
<TITLE>Empire Burlesque</TITLE>
<ARTIST>Bob Dylan</ARTIST>
<COUNTRY>USA</COUNTRY>
<COMPANY>Columbia</COMPANY>
<PRICE>10.90</PRICE>
<YEAR>1985</YEAR>
</CD>
<CD>
<TITLE>Hide your heart</TITLE>
<ARTIST>Bonnie Tyler</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>CBS Records</COMPANY>
<PRICE>9.90</PRICE>
<YEAR>1988</YEAR>
</CD>
<CD>
<TITLE>Greatest Hits</TITLE>
<ARTIST>Dolly Parton</ARTIST>
<COUNTRY>USA</COUNTRY>
<COMPANY>RCA</COMPANY>
<PRICE>9.90</PRICE>
<YEAR>1982</YEAR>
</CD>
<CD>
<TITLE>Still got the blues</TITLE>
<ARTIST>Gary Moore</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>Virgin records</COMPANY>
<PRICE>10.20</PRICE>
<YEAR>1990</YEAR>
</CD>
<CD>
<TITLE>Eros</TITLE>
<ARTIST>Eros Ramazzotti</ARTIST>
<COUNTRY>EU</COUNTRY>
<COMPANY>BMG</COMPANY>
<PRICE>9.90</PRICE>
<YEAR>1997</YEAR>
</CD>
<CD>
<TITLE>One night only</TITLE>
<ARTIST>Bee Gees</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>Polydor</COMPANY>
<PRICE>10.90</PRICE>
<YEAR>1998</YEAR>
</CD>
<CD>
<TITLE>Sylvias Mother</TITLE>
<ARTIST>Dr.Hook</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>CBS</COMPANY>
<PRICE>8.10</PRICE>
<YEAR>1973</YEAR>
</CD>
<CD>
<TITLE>Maggie May</TITLE>
<ARTIST>Rod Stewart</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>Pickwick</COMPANY>
<PRICE>8.50</PRICE>
<YEAR>1990</YEAR>
</CD>
<CD>
<TITLE>Romanza</TITLE>
<ARTIST>Andrea Bocelli</ARTIST>
<COUNTRY>EU</COUNTRY>
<COMPANY>Polydor</COMPANY>
<PRICE>10.80</PRICE>
<YEAR>1996</YEAR>
</CD>
</CATALOG>
结果: