1. 程式人生 > >cors跨域(以及和jsonp的區別)

cors跨域(以及和jsonp的區別)

上次我們說到,jsonp只支援get方式跨域,不支援post,是因為底層是使用script標籤去接受請求,jsonp通過給script的src中的url設定回撥函式,傳給服務端後,服務端返回一個回撥函式的呼叫,把資料包在這個回撥函式裡面,然後我們在全域性中定義一下這個回撥函式準備解析資料就好了。如果對jsonp和跨域還不是很瞭解的話,請看我的另一篇文章http://blog.csdn.net/qq_33562825/article/details/60765688

現在假設我要跨域,同時跨域的時候傳遞的資料非常多,get對資料大小又有限制,用get就不靠譜,必須使用支援post跨域的。

 之前都是假如我們的網站aa,現在想請求一個叫bb的網站,用的是jsonp的方式,aa通過script標籤告訴bb我要跨域,bb說你必須有令牌,然後aa亮出了令牌jsonp,bb看了以後就把資源給aa了

而現在我們需要的這種跨域方式,是支援get以及post跨域的,與jsonp不同的是,它不是直接發請求給要進行跨域的網站,而是先經過伺服器,通過伺服器的處理後,才能實現的跨域。這種方式叫做—-CORS.

CORS是一個W3C標準,全稱是”跨域資源共享”(Cross-origin resource sharing)。

它允許瀏覽器向跨源伺服器,發出XMLHttpRequest請求,從而克服了AJAX只能同源使用的限制。
CORS需要瀏覽器和伺服器同時支援。目前,所有瀏覽器都支援該功能,IE瀏覽器不能低於IE10。
整個CORS通訊過程,都是瀏覽器自動完成,不需要使用者參與。對於開發者來說,CORS通訊與同源的AJAX通訊沒有差別,程式碼完全一樣。瀏覽器一旦發現AJAX請求跨源,就會自動新增一些附加的頭資訊,有時還會多出一次附加的請求,但使用者不會有感覺。
因此,實現CORS通訊的關鍵是伺服器。只要伺服器實現了CORS介面,就可以跨源通訊。

在php中,通過下面程式碼給客戶端設定一個響應頭,瀏覽器響應時就會知道允許跨域了

  header( 'Access-Control-Allow-Origin:*' )//允許所有網站跨域訪問該網站


 header( 'Access-Control-Allow-Origin:http://baidu.com' )//只允許百度跨域訪問該網站

jsonp方式和cors方式的區別

  • jsonp是jquery提供的跨域方式
  • cors是w3c提供的一個跨域標準
    ——————————————————————
  • jsonp只支援get方式的跨域
  • cors支援get和post方式的跨域
    ——————————————————————
  • jsonp支援所有的瀏覽器(因為所有瀏覽器都可以使用script標籤傳送請求)
  • cors不支援IE10以下的瀏覽器