DDR爱好者之家

AngularJS中的JSONP实例解析
站长资源 2024/11/28 佚名
53 1538
DDR爱好者之家 Design By 杰米

概念

      首先呢，Json和JSONP是不一样的哦。Json呢，是众多数据存储的其中一种格式，是数据书写方式的其中一种。好比是大中华众多诗体的一种(比如说是七言诗吧)。这种诗体规定了: 这种诗体要包含题目，每行诗句的字数(7个字) 等等的文本格式。而Json所规定的文本格式是这样子的

AngularJS中的JSONP实例解析

(Json格式示意图)

　  而JSONP呢，它是一种特殊的通讯方式，使用它能够轻松绕过浏览器的同源安全限制，达到加载来自不同源的资源(脚本, 图片, 其他)的效果。比如说，您是一个王国的王子，你意外地喜欢上了附近一个小城镇里面的一位漂亮年轻的姑娘(资源)，你想和她见面并进一步往下发展(获取资源)。但是呢，您的父亲国王先生(浏览器)可不同意，国王认为这个姑娘不是王室的女孩(非同源的资源)，配不上王子，把王子困在城堡里面的同时，还往城堡外放好多士兵监察，禁止外人进入(浏览器的同源安全限制)。但是王子对爱非常坚持，他试过多种方式与这个姑娘联系，比如说让太监欧巴带封信给漂亮姑娘(PUT,GET,POST等等)，但是呢，每当到达城门的时候，士兵就会发现这封信的地址是给小姑娘的，于是屡屡禁止了太监出去(获取外部资源时，PUT,GET,POST不奏效)。于是王子想到了一种特殊的通讯方式，就是飞鸽传书(JSONP)，小鸽子呢能够飞跃城堡，从而避开士兵的监察(绕过浏览器的同源安全限制)，来达到与姑娘通讯的效果(与跨域资源共享CORS的通讯实现啦!O(∩_∩)O)。最终，经过九九八十一难之后，王子喜欢上了太监(∑(っ °Д °;)っ 人生处处充满惊喜...)

具体的实现方法

    要达到这种通讯效果，王子(发送请求的方式)和姑娘(服务端)都要有所准备。

　王子在发送JSONP请求的时候，首先需要一只鸽子吧(使用Jsonp), 再来呢，需要一封信绑在鸽子上(地址栏中的callback参数)

$http.jsonp("https://api.github.com").success(function(data){//...})

　　当姑娘接到小鸽子带来的信之后呢，也要把内容写在小鸽子身上的信，来回信(通过callback参数，把响应内容包装成一个JavaScript参数，并由该请求对应的回调函数来进行调用)

　　包装数据的方法

res.send(【callback函数】+ '('+ JSON.stringify(result) + ')');

　其他细节

    使用JSONP的时候，AngularJS会生成一个 <script> 标签并插入到DOM中进行请求，响应成功之后会把该节点删除(删除节点这点具体Angular版本不同可能会有所不同吧)

　　其中,CALLBACK会被替换成一个特地为此请求生成的自定义函数，即是由

$http.jsonp("https://api.github.com")...) 变成

<script src="/UploadFiles/2021-04-02/api.github.com">

   因此当我们自己开发JSONP的后端服务时，要确保响应数据被包含在请求指定的回调函数中

 　注意事项

   使用JSOPN有潜在的安全隐患，因为JSONP允许后端服务调用应用的JavaScript，使站点变得脆弱的同时，还可能暴露用户隐私

　 文章参考

  《AngularJS权威教程》

以上就是本文的全部内容，希望对大家有所帮助，同时也希望多多支持！

DDR爱好者之家 Design By 杰米
广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
DDR爱好者之家 Design By 杰米
ddrfans.com DDR爱好者之家
8,675无损音乐
1,324高清电影
213破解软件
70,141收录资讯

P70系列延期，华为新旗舰将在下月发布

3月20日消息，近期博主@数码闲聊站 透露，原定三月份发布的华为新旗舰P70系列延期发布，预计4月份上市。

而博主@定焦数码 爆料，华为的P70系列在定位上已经超过了Mate60，成为了重要的旗舰系列之一。它肩负着重返影像领域顶尖的使命。那么这次P70会带来哪些令人惊艳的创新呢？

根据目前爆料的消息来看，华为P70系列将推出三个版本，其中P70和P70 Pro采用了三角形的摄像头模组设计，而P70 Art则采用了与上一代P60 Art相似的不规则形状设计。这样的外观是否好看见仁见智，但辨识度绝对拉满。

更新日志

友情链接

杰晶网络 DDR爱好者之家 南强小屋 黑松山资源网 白云城资源网
DDR爱好者之家 Design By 杰米