Javascript跨域访问解决方案
由于安全方面的考慮,?Javascript?被限制了跨域訪問的能力,但是有時候我們希望能夠做一些合理的跨域訪問的事情,那么怎么辦呢?
這里分兩類情況:
?????????一、基于同一父域的子域之間頁面的訪問?
?????????????????參見如下?3?個?domain?域:
1?、?taobao.com
????????? 2?、?jipiao.taobao.com
????????? 3?、?promotion.taobao.com
它們有相同的父域???taobao.com
?????????二、基于不同父域頁面之間的訪問?
?????????????????參見如下?3?個?domain?域:
1?、?taobao.com
???????????? 2?、?baidu.com
3?、?sina.com.cn
?????它們具有不同的父域。
解決它們之間跨域的方案:
<!--[if !supportLists]-->①?<!--[endif]-->服務器?Proxy:???域?A?的頁面?JS?需要訪問域?B?下的鏈接獲取數據,該方案在域?A?的服務器端建立一個?Proxy?程序?(?可能是?ASP?、?servlet?等任何服務端程序?)?,域?A?的頁面?JS?直接調用本域下的?Proxy?程序,?proxy?程序負責將請求發送給域?B?下的鏈接并獲取到數據,最后再通過?Proxy?將數據返回給頁面?JS?使用。
經過的訪問流程就是:?域?A?下?JS--?à?域?A?下?Proxy---?à?域?B?下的鏈接
例子:
第一步:
??域?A:??http://Jipiao.taobao.com/test.htm?????頁面上?javascript?腳本
view plaincopy to clipboardprint?第二步:
Proxy?程序?(?這里假定是一個?servlet)?:
view plaincopy to clipboardprint???
<!--[if !supportLists]-->②?<!--[endif]-->??Script?標簽?:?域?A?頁面?http://Jipiao.taobao.com/test.htm?的?head?中寫一個空的?Script?標簽
view plaincopy to clipboardprint?注意:這種方案要求域?B?返回的數據必須是合法的?JSON?格式或者如?JS?文件的格式。
域?B?返回的數據格式如下:
view plaincopy to clipboardprint??
對于基于同一父域的子域之間頁面的訪問這一類情況,還有第三種方式:?
????③?隱藏?iframe:?即域?A jipiao.taobao.com/yyyy.htm?的頁面上寫一個隱藏的?iframe?,
??
這里?promotion.taobao.com/xxxx.htm?頁面也需要設置?document.domain="taobao.com"?,?這種方法才能奏效。之所以這種?iframe?的方法不適合不同父域之間的跨域,是因為設置?document.domain?只能設置為自己的父域,而不是能設置為其他域,例如?:jiapiao.taobao.com?只能設置?document.domain=”taobao.com”?,而不是是?document.domain=”baidu.com”
優缺點比較:
??這里列舉的三種方案各有優缺點:
??Proxy?方案優點是可以適用用于幾乎所有的跨域訪問,而且只需要要一個域中進行開發,另一個域可以提供任何類型格式的數據。缺點是這種方案經過了中間?Proxy?,所以延遲可能稍微大一點,并且會加重本域服務器的負荷,開發工作量也稍微大一點。
??Script?標簽的方案可以說是非常簡單的,不用幾行代碼就搞定了事,不過它對返回的數據格式要求有點嚴格,只能是?Json?格式數據?,?如果是其他格式的數據,那么這種方法就無能為力了。
隱藏?iframe?方式也很簡單,它可以處理任何返回的數據格式,但它只適用在具有同一個父域下的跨域請求上,并且要求其他域得配合開發,即需要設置?document.domain
推薦閱讀文章:http://www.cnblogs.com/passer/archive/2008/07/16/1243811.html?
================
補充:Script標簽標簽方法最好要求服務端返回的json需要有句柄,即 如 json={...} 什么的。因為客戶端需要使用這個句柄來引用。如果沒有,客戶端JS只有采用 var json=eval(jsonStr)方式來執行,效率不是很高。還有一種形式就是客戶端傳入要回調的方法。例如 xxxx.do?callbackApi=ca
服務端接收到callbackApi參數后,將json包裝在ca中,如:ca({.....});
客戶端定義回調函數就可以訪問了。
?? function ca(json){
?????????.......
?? }
不論如何,這種方法對于服務端都有一定耦合。
轉載于:https://www.cnblogs.com/wbqsln/archive/2011/02/23/1962463.html
總結
以上是生活随笔為你收集整理的Javascript跨域访问解决方案的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 脚本自动实现DNS服务各区域配置文件
- 下一篇: 胃胀气消化不良怎么办有什么办法(胃胀气消