ajax跨域訪問遇到的問題及解決方案

Ajax請求一個目標地址為非本域（協議、域名、端口任意一個不同）的web資源，并根據響應獲得外部應用數據。比如我們用Ajax訪問城市天氣預報、IP地址等公共服務接口時，就涉及跨域了。我們請求一個外部服務時，瀏覽器會基于安全問題拒絕授權訪問。

而script、script、iframe標簽的src屬性就不存在跨域的問題，所以Ajax跨域就是利用這一點以及js對JSON的支持，外部服務只要給Ajax的請求響應一段JS代碼或JSON數據，就能被Ajax獲取到。

由于安全方面的原因, 客戶端js使用xmlhttprequest只能用來向來源網站發送請求，比如在www.readlog.cn下去請求test.readlog.cn的數據，都是不行的。不過，解決辦法倒是不少。這里整理一下。

解決方式1 web代理的方式 (on Server A)

由該頁面代替用戶頁面完成交互，從而返回合適的結果。此方案可以解決現階段所能夠想到的多數跨域訪問問題，但要求A網站提供Web代理的支持，因此A網站與B網站之間必須是緊密協作的，且每次交互過程，A網站的服務器負擔增加，且無法代用戶保存session狀態。

解決方式2. on-Demand方式 (on Server A)

MYMSN的門戶就用的這種方式，不過 MYMSN中不涉及跨域訪問問題。在頁面內動態生成新的

解決方式3. iframe方式 (on Server A)

查看過醒來在JavaEye上的一篇關于跨域訪問的帖子，他提到自己已經用iframe的方式解決了跨域訪問問題。數據提交跟獲取，采用iframe這種方式的確可以了，但由于父窗口與子窗口之間不能交互（跨域訪問的情況下，這種交互被拒絕），因此無法完成對父窗口效果的影響。

在頁面內嵌或動態生成指向別的網站的IFRAME，然后這2個網頁間可以通過改變對方的anchor hash fragment來傳輸消息。改變一個網頁的anchor hash fragment并不會使瀏覽器重新裝載網頁，所以一個網頁的狀態得以保持，而網頁本身則可以通過一個計時器(timer)來察覺自己anchor hash的變化，從而相應改變自己的狀態。

解決方式4. 用戶本地轉儲方式 (local)

IE本身依附于windows平臺的特性為我們提供了一種基于iframe，利用內存來“繞行”的方案，即兩個window之間可以在客戶端通過windows剪貼板的方式進行數據傳輸，只需要在接受數據的一方設置Interval進行輪詢，獲得結果后清除Interval即可。FF的平臺獨立性決定了它不支持剪貼板這種方式，而以往版本的FF中存在的插件漏洞又被fixed了，所以FF無法通過內存來完成暗渡陳倉。而由于文件操作FF 也沒有提供支持（無法通過Cookie跨域完成數據傳遞），致使這種技巧性的方式只能在IE中使用。

解決方式5: （其實還是在服務端A用iframe解決了與服務器B通信的問題）

要解決的問題：發生在用戶提交網頁 URL （還包括 Tag, Notes 等）給bookmark 服務器時。

關于 URL 的提交至少可以有三種方式：

1. 登陸 Bookmark 服務器的提交頁面，將要收藏的 URL 通過該頁面提交給服務器。
2. 安裝瀏覽器插件，通過插件將 URL 提交給服務器。
3. 從 Bookmark 服務器動態加載 javascript 小工具到當前頁面，通過它來完成提交工作。

第一種方式開發起來最簡單，但對用戶來講比較麻煩，每次都需要先登陸 Bookmark 服務器才能完成提交；第二種方式我并不熟悉插件開發，而且用戶也不喜歡太多的插件堆滿自己的瀏覽器；第三種方式開發難度小，又避免了每次登陸服務器的麻煩，所以最終采用它。第三種方式中動態加載的 javascript 小工具除了需要生成 UI 供用戶填寫信息（ URL ， tag ， notes 等），當用戶點擊提交的時候，還要完成與服務器通信的功能。

聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com