1 <html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 2 <title>document.domain 跨子域测试 | by js8.in</title> 3 </head> 4 <body> 5 <div style="100%;border:2px solid green;"> 6 7 <h1>document.domain 跨子域测试</h1> 8 <h3>此页面来自：<span id="host"></span></h3> 9 <button onclick="post()">发送post</button> 10 <button onclick="get()">发送get</button> 11 <iframe id="iframe" src="http://dali.sinaapp.com/proxy.htm" frameborder="0" style="margin:10px;90%;height:300px;border:2px solid #f60;"></iframe> 12 <p><a href="http://www.80sec.com/cross_domain_attack.html" target="_blank">跨子域安全</a></p> 13 </div> 14 <script type="text/javascript"> 15 document.getElementById('host').innerHTML = location.host; 16 document.domain = 'sinaapp.com'; 17 var reqURL = 'http://dali.sinaapp.com/request.php'; 18 var iframe = document.getElementById('iframe'); 19 var iframeWin = iframe.contentWindow; 20 21 function post(){ 22 var iframeXHR = iframeWin.xmlHttp(); 23 iframeXHR.open('POST', reqURL, true); 24 iframeXHR.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); 25 iframeXHR.onreadystatechange = function(){ 26 stateChangeHandler(iframeXHR); 27 }; 28 29 iframeXHR.send('action=post'); 30 } 31 32 function get(){ 33 var iframeXHR = iframeWin.xmlHttp(); 34 iframeXHR.open('GET', reqURL+'?t='+(+new Date()), true); 35 iframeXHR.onreadystatechange = function(){ 36 stateChangeHandler(iframeXHR); 37 }; 38 iframeXHR.send(null); 39 } 40 41 function stateChangeHandler(xhr){ 42 if (xhr.readyState == 4) { 43 var stat = xhr.status; 44 if ((stat >= 200 && stat < 300) || stat == 304 ) { 45 var txt = xhr.responseText; 46 alert(txt); 47 }else { 48 alert('fail'); 49 } 50 } 51 } 52 </script> 53 </body></html>
1 <html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 2 <h3>此页面来自：<span id="host"></span></h3> 3 <script> 4 document.getElementById('host').innerHTML = location.host; 5 6 document.domain = 'sinaapp.com'; 7 xmlHttp = (function() { 8 var f; 9 if(window.ActiveXObject) { 10 f = function() { return new ActiveXObject('Microsoft.XMLHTTP');}; 11 } else if(window.XMLHttpRequest) { 12 f = function() { return new XMLHttpRequest();}; 13 } else { 14 f = function() { return;}; 15 } 16 return f; 17 })(); 18 </script> 19 </head> 20 <body> 21 </body> 22 </html>
1. 两个不同子域名通过设置 document.domain=’主域名’ 获取操作对方的跨域权限。
2. 如何获取xhr，即时函数可以一次得到结果，以后调用不用再if判断是否支持XMLHttpRequest
3. location.host 的含义
4. 如何获得子iframe的window对象
5. xhr 响应发送过程： open("type", "url", true ), setRequestHeader("Content-Type", "application/x-www-form-urlencoded"), send("要发送的内容")。回调函数：onreadystatechange
6. post 的发送数据在header里面看，get在url。