首先我們來想一想

為什么會有跨域這個名詞的出現呢?

跨域又是什么呢?為何要跨域?

瀏覽器的同源策略又是什么?怎么解決?

jsonp又是什么?

跨域的原理又是什么呢?

名詞解釋:

跨域:

瀏覽器對于javascript的同源策略的限制,例如a.cn下面的js不能調用b.cn中的js,對象或數據(因為a.cn和b.cn是不同域),所以跨域就出現了.

上面提到的,同域的概念又是什么呢??? 簡單的解釋就是相同域名,端口相同,協議相同

同源策略:

請求的url地址,必須與瀏覽器上的url地址處于同域上,也就是域名,端口,協議相同.

比如:我在本地上的域名是study.cn,請求另外一個域名一段數據

這個時候在瀏覽器上會報錯:

這個就是同源策略的保護,如果瀏覽器對javascript沒有同源策略的保護,那么一些重要的機密網站將會很危險~

study.cn/json/jsonp/jsonp.html

請求地址

形式

結果

http://study.cn/test/a.html

同一域名,不同文件夾

成功

http://study.cn/json/jsonp/jsonp.html

同一域名,統一文件夾

成功

http://a.study.cn/json/jsonp/jsonp.html

不同域名,文件路徑相同

失敗

http://study.cn:8080/json/jsonp/jsonp.html

同一域名,不同端口

失敗

https://study.cn/json/jsonp/jsonp.html

同一域名,不同協議

失敗

jsonp:

jsonp?全稱是JSON with Padding,是為了解決跨域請求資源而產生的解決方案,是一種依靠開發人員創造出的一種非官方跨域數據交互協議。

一個是描述信息的格式，一個是信息傳遞雙方約定的方法。

jsonp的產生:

1.AJAX直接請求普通文件存在跨域無權限訪問的問題,不管是靜態頁面也好.

2.不過我們在調用js文件的時候又不受跨域影響,比如引入jquery框架的,或者是調用相片的時候

3.凡是擁有scr這個屬性的標簽都可以跨域例如

4.如果想通過純web端跨域訪問數據只有一種可能,那就是把遠程服務器上的數據裝進js格式的文件里.

5.而json又是一個輕量級的數據格式,還被js原生支持

6.為了便于客戶端使用數據，逐漸形成了一種非正式傳輸協議，人們把它稱作JSONP，該協議的一個要點就是允許用戶傳遞一個callback?參數給服務端，

demo1:基于script標簽實現跨域

舉個例子:我在http://study.cn/json/jsonp/jsonp_2.html下請求一個遠程的js文件

1

2

3

4

5

Insert title here

6

7

8 var message = function(data) {

9 alert(data[1].title);

10 };

11

12

13

14

15

16

17

18

總結

以上是生活随笔為你收集整理的跨域会报40几_关于跨域,以及跨域的几种方式的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。