【轉發】http://www.cnblogs.com/adtxgc/p/4691872.html
在某些應用場景下,需要在主域中,調用子域中的某個接口,如果直接在主域中向子域發ajax請求,會報跨域錯誤,可以用iframe來解決這種跨域問題。
假如主域為www.baidu.com,子域為baike.baidu.com。主域中的A頁面需要通過ajax請求調用子域中的某項服務。首先需要在子域中准備一個B頁面,B頁面就是一個簡單的空頁面,最好把jquery引到B頁面中,這樣可以直接用jquery發ajax請求;在主域的A頁面中要用iframe把B頁面url地址引過來。
B頁面格式
1 //B.html
2 <html>
3 <head>
4 <title>B頁面</title>
5 <script type="text/javascript" src="jquery.js"></script>
6 </head>
7 <body>
8 <div>B頁面</div>
9 <script>
10 $(function(){
11 try{
12 document.domain = "www.baidu.com";
13 }catch(e){}
14 });
15 </script>
16 </body>
17 </html>
A頁面格式
1 //A.html
2 <html>
3 <head>
4 <title>A頁面</title>
5 <script type="text/javascript" src="jquery.js"></script>
6 </head>
7 <body>
8 <div>A頁面</div>
9 <iframe id="iframe" src="http://baike.baidu.com/B.html" style="display:none;"></iframe>
10 <script>
11 $(function(){
12 try{
13 document.domain = "www.baidu.com";
14 }catch(e){}
15 $("#iframe").load(function(){
16 var iframe = $("#iframe").contentDocument.$;
17 ifram.get("http://baike.baidu.com/接口",function(data){});
18 });
19 });
20 </script>
21 <body>
22 </html>
有一點需要注意,就是在A頁面中,要等iframe標簽完成加載B頁面之后,再取iframe對象的contentDocument,否則如果B頁面沒有被iframe完全加載,在A頁面中通過contentDocument屬性就取不到B頁面中的jQuery對象。一旦取到B頁面中的jQuery對象,就可以直接發ajax請求了,這種類似“代理”方式可以解決主子域的跨域問題。

