總結一下跨域的幾種情況


在網站開發中,經常會遇到跨域問題,下面總結一下集中常見的跨域問題。

 

1. 不同域名屬於跨域,如:www.a.com 和www.b.com,另外www.a.com 和www.a.com.cn也屬於不同域名。

 

2. 主域名和子域名(二級域名、三級域名等)跨域,如:www.a.com 和 bbs.a.com 跨域。

 

3. 不同協議屬於跨域,如:http://www.a.com 和 https://www.a.com。

 

4. Ip和域名屬於跨域,如:123.23.23.12 和 www.a.com。

 

那如何解決跨域呢?

 

如何解決跨域問題

  • JSONP 
      JSONP是JSON with Padding的略稱。它是一個非官方的協議,它允許在服務器端集成Script tags返回至客戶端,通過javascript callback的形式實現跨域訪問(這僅僅是JSONP簡單的實現形式)。關於jsonp的使用方式,可以參考http://blog.csdn.net/alen1985/article/details/6365394,優缺點可以參考http://blog.csdn.net/z69183787/article/details/19191385  
  • 添加響應頭,允許跨域 
      addHeader(‘Access-Control-Allow-Origin:*’);//允許所有來源訪問 
      addHeader(‘Access-Control-Allow-Method:POST,GET’);//允許訪問的方式
  • 代理的方式 
    服務器A的test01.html頁面想訪問服務器B的后台action,返回“test”字符串,此時就出現跨域請求,瀏覽器控制台會出現報錯提示,由於跨域是瀏覽器的同源策略造成的,對於服務器后台不存在該問題,可以在服務器A中添加一個代理action,在該action中完成對服務器B中action數據的請求,然后在返回到test01.html頁面。

Demo1(添加允許跨域請求的響應頭)

  • html頁面 

  • Web后台 
     
     
    按照上面的訪問,由於127.0.0.1:8080和localhost:8081的域和端口不同,所以同樣會出現跨域問題。 

現在用添加響應頭的方式 


Demo2(jsonp的callback方式)

這里演示的是jquery的ajax,后台采用的是webservice接口形式 

注意此時的dataType為jsonp格式,看看后台的接收 
, 
我們返回的其實就是一個函數的調用文本,這里注意,callback的名稱,由於前台沒有指定callback函數,所以這里自動生成了,如果想自定義回調函數名稱如下操作,添加一行請求參數 

這樣后台的回調函數名就變成了mytest 

瀏覽器發出的請求格式和響應數據如下,其實就是返回函數的調用,而需要返回的數據則以函數參數值的形式填入 
 
此時控制台就能夠獲取到“hello world” 

推薦參考資料: 
http://www.cnblogs.com/chopper/archive/2012/03/24/2403945.html


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM