官網(wǎng)上的解釋為:

The?$http?service is a core AngularJS service that facilitates communication with the remote HTTP servers via the browser's?XMLHttpRequest?object or via?JSONP.($http服務(wù)就是通過(guò)瀏覽器的XMLHttpRequest對(duì)象或者通過(guò)JSONP用于和遠(yuǎn)程的http服務(wù)通信的angularJs的一個(gè)核心服務(wù))

JSONP?(JSON?with padding) is used to request data from a server residing in a different domain than the client.（JSONP是JSON的一個(gè)使用模式用戶跨域請(qǐng)求），因?yàn)?XMLHttpRequest這個(gè)對(duì)象不支持跨域請(qǐng)求,所以才有了我們需要通過(guò)JSONP來(lái)實(shí)現(xiàn)跨域請(qǐng)求訪問(wèn)。

支持跨域請(qǐng)求的標(biāo)簽如下：

<img src="http://www.baidu.com/1.png" alt=""> //雖然支持跨域但是拿不到服務(wù)端返回的數(shù)據(jù)

<iframe src="http://www.baidu.com/2.jpg" frameborder="0"></iframe> //可以收取服務(wù)端數(shù)據(jù) 但是過(guò)程較為復(fù)雜

<link rel="stylesheet" href="http://bbs.abc.com"> //會(huì)在css處理階段報(bào)錯(cuò)

<script src="http://dddd.com/1"></script> //推薦的方式

使用jsonp做跨域請(qǐng)求的時(shí)候:

1.在普通的ajax請(qǐng)求中做跨域請(qǐng)求的時(shí)候需要在當(dāng)前地址后面加上一個(gè)參數(shù)callback=func即可

2.但在angular中將所有JSONP的callback都掛在angular.callbacks這個(gè)對(duì)象上，所以在angular中使用JSONP的方式做跨域請(qǐng)求就必須給當(dāng)前地址加上一個(gè)參數(shù)callback=JSON_CALLBACK,這樣最終的結(jié)果是angular把參數(shù)換成了angular.callbacks._0或angular.callbacks._1...這樣一些隨機(jī)的函數(shù)名。

angular中對(duì)于數(shù)據(jù)邏輯的東西需要寫(xiě)service來(lái)處理，而需要scope設(shè)置值關(guān)聯(lián)到view層上的東西需要controller來(lái)處理：

?

angular執(zhí)行跨域的過(guò)程:

處理url中的回調(diào)函數(shù)的時(shí)候需要把傳過(guò)來(lái)的格式不一致的url類(lèi)型轉(zhuǎn)換成一個(gè)標(biāo)準(zhǔn)的url字符串格式類(lèi)型

其中處理url中的回調(diào)參數(shù)就是在url后面加上一個(gè)cb="my_json_cb"這樣的串

創(chuàng)建script標(biāo)簽的格式類(lèi)似于var scriptElement = document.creatElement('script');然后指定src屬性：scriptElement.src=url+...

掛載回調(diào)函數(shù) window[cb]=callback

將script標(biāo)簽放到頁(yè)面中:document.body.appendChild(scriptElement);

這種調(diào)用的方式和jquery中的$.get('http://dddd.com/22',function(data))的格式是差不多的

?

轉(zhuǎn)載于:https://www.cnblogs.com/yk123/p/7049076.html

總結(jié)

以上是生活随笔為你收集整理的angularJS1笔记-(18)-$http及用angular实现JSONP跨域访问过程的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。