1. 程式人生 > >什麽是跨域?如何實現跨域?

什麽是跨域?如何實現跨域?

res methods class 方式 資源 lan lba png 指向

跨域,指的是瀏覽器不能執行其他網站的腳本。它是由瀏覽器的同源策略造成的,是瀏覽器施加的安全限制。

使用ajax請求訪問其他服務器的數據,此時,客戶端會出現跨域問題.

localhost和127.0.0.1雖然都指向本機,但也屬於跨域。

如何實現跨域?(以下是常用,我自己項目使用到的)

1、JSONP:

利用<script>標簽沒有跨域限制的“漏洞”,來達到與第三方通訊的目的。當需要通訊時,本站腳本動態創建一個<script>元素,地址指向第三方的API網址,形如:
<script src="http://www.example.net/api?param1=1&param2=2"
></script>
並提供一個回調函數來接收數據(函數名可約定,或通過地址參數傳遞)。
第三方產生的響應為json數據的包裝(故稱之為jsonp,即json padding),形如:
callback({"name":"hax","gender":"Male"})
這樣瀏覽器會調用callback函數,並傳遞解析後json對象作為參數。本站腳本可在callback函數裏處理所傳入的數據。

所有,通過Chrome查看所有JSONP發送的Get請求都是js類型,而非XHR。

要註意JSONP只支持GET請求,不支持POST請求。

2、apache設置反向代理(設置url映射解決跨域):

技術分享圖片

3、PHP端修改header(XHR2方式)

在php接口腳本中加入以下兩句即可:

header(‘Access-Control-Allow-Origin:*‘);//允許所有來源訪問

header(‘Access-Control-Allow-Method:POST,GET‘);//允許訪問的方式

4.cors

? Cross-Origin Resource Sharing(CORS)跨域資源共享是一份瀏覽器技術的規範,提供了 Web 服務從不同域傳來沙盒腳本的方法,以避開瀏覽器的同源策略,確保安全的跨域數據傳輸。現代瀏覽器使用CORS在API容器如XMLHttpRequest來減少HTTP請求的風險來源。與 JSONP 不同,CORS 除了 GET 要求方法以外也支持其他的 HTTP 要求。服務器一般需要增加如下響應頭的一種或幾種:

Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: POST, GET, OPTIONS
Access-Control-Allow-Headers: X-PINGOTHER, Content-Type
Access-Control-Max-Age: 86400

跨域請求默認不會攜帶Cookie信息,如果需要攜帶,請配置下述參數:

"Access-Control-Allow-Credentials": true
// Ajax設置
"withCredentials": true

 

什麽是跨域?如何實現跨域?