AngularJS的JSONP服务
有些页面的response中,包含了 Access-Control-Allow-Origin 这个header,说明可以进行跨域请求,如果没有包含这个header的页面可以利用JSONP进行跨域
script标签中的src属性可以也实现跨域,,下面我们来简单封装利用script标签实现跨域的函数。
步骤:
- 创建script标签
- script标签的src属性等于url
a) url中有回调函数和参数
b) 回调函数需要写入window中
i. 调用的函数名不能为同一个,否则会被覆盖
ii. 所以利用随机数(转换为字符串,然后去掉前两位0和小数点)让函数名不同
c) 参数以对象形式传入,需要遍历,与url进行连接
3. 将标签插入body中
4. 移除script
代码:
function getJsonp(url,params,callback){
//创建script标签
var script=document.createElement("script");
//生成随机的回调函数名
var name="JSONP"+Math.random().toString().substring(2);
window[name]=function(data){
callback(data);
}
var strUrl=url+"?callback="+name;
for(key in params){
strUrl+="&"+key+"="+params[key]
}
script.src=strUrl;
document.body.appendChild(script);
document.body.removeChild(script);
}
了解原理即可,现在有很多插件可以解决这个问题
AngularJS的JSONP服务的更多相关文章
- 【AngularJs】---JSONP跨域访问数据传输
大家会自然想到只有一个字母之差的JSON吧~ JSON(JavaScript Object Notation)和JSONP(JSON with Padding)虽然只有一个字母的差别,但其实他们根本不 ...
- Ⅳ.AngularJS的点点滴滴-- 服务
服务(Angularjs很多方法都是服务组成的) 1.使用service方法创建的单例服务 <html> <script src="http://ajax.googleap ...
- 【AngularJs】---JSONP跨域访问数据传输(JSON_CALLBACK)
大家会自然想到只有一个字母之差的JSON吧~ JSON(JavaScript Object Notation)和JSONP(JSON with Padding)虽然只有一个字母的差别,但其实他们根本不 ...
- angularJS(三):服务(Service)、http
一.服务 服务是一个函数或对象,可在你的 AngularJS 应用中使用. 可以创建自己的服务,或使用内建服务 $location 注意 $location 服务是作为一个参数传递到 controll ...
- AngularJs之六(服务)
服务:AngularJS 中,服务是一个函数或对象,可在你的 AngularJS 应用中使用.AngularJS 内建了30 多个服务. 最常用的服务:$location 服务, $http 服务 ...
- 让AngularJS的$http 服务像jQuery.ajax()一样工作
让AngularJS的$http 服务像jQuery.ajax()一样工作 $http的post . 请求默认的content-Type=application/json . 提交的是json对象的字 ...
- 怎么理解angularjs中的服务?
AngularJS中的服务其实就是提供一种方式抽取共用类库 比如说一些工具类方法,我们传统的做法就是自己写个 utility 类,把相关的工具方法填充到utility里面去,最后把utility类放到 ...
- AngularJS之使用服务封装
AngularJS之使用服务封装可复用代码 创建服务组件 在AngularJS中创建一个服务组件很简单,只需要定义一个具有$get方法的构造函数, 然后使用模块的provider方法进行登记: / ...
- AngularJS 的异步服务测试与Mocking
测试 AngularJS 的异步服务 最近,在做项目时掉进了 AngularJS 异步调用 $q 测试的坑中,直接躺枪了.折腾了许久日子,终于想通了其中的道道,但并不确定是最佳的解决方案,最后还是决定 ...
随机推荐
- RapidJSON 代码剖析(四):优化 Grisu
我曾经在知乎的一个答案里谈及到 V8 引擎里实现了 Grisu 算法,我先引用该文的内容简单介绍 Grisu.然后,再谈及 RapidJSON 对它做了的几个底层优化. (配图中的<Grisù& ...
- 【SQL】sql server 2008R2 评估期已过,
参考1:http://www.cnblogs.com 参考2:http://www.wang1314.com 个人认为:升级+秘钥,,买正版才是最终的解决方法.
- 推公式 HDU 2552
T 给你2个值 求另外一个 需要推一下 tan(a+b)=(tan(a)+tan(b))/(1-tan(a)*tan(b)); 等式左右取tan tan(atan(a))=a 1/s=tan(...) ...
- Python笔记(4)类__属性与描述符
部分参考自:http://www.geekfan.net/7862/ 新式类与经典类 2和3不一样,3都是新式类. 新式类和经典类的区别: class A: #classic class " ...
- [bigdata] Spark RDD整理
1. RDD是什么RDD:Spark的核心概念是RDD (resilient distributed dataset),指的是一个只读的,可分区的弹性分布式数据集,这个数据集的全部或部分可以缓存在内存 ...
- [UOJ30/Codeforces Round #278 E]Tourists
传送门 好毒瘤的一道题QAQ,搞了好几好几天. UOJ上卡在了53个点,CF上过了,懒得优化常数了 刚看时一眼Tarjan搞个强连通分量然后缩点树链剖分xjb搞搞就行了,然后写完了,然后WA了QAQ. ...
- 第六章 大数据,6.3 突破传统,4k大屏的沉浸式体验(作者: 彦川、小丛)
6.3 突破传统,4k大屏的沉浸式体验 前言 能够在 4K 的页面上表演,对设计师和前端开发来说,即是机会也是挑战,我们可以有更大的空间设计宏观的场景,炫酷的转场,让观众感受影院式视觉体验,但是,又必 ...
- Debian 8中dpkg -i自动解决依赖关系
dpkg -i 后#apt-get update &&apt-get -f install
- 即时搜索或input实时检测监听输入框变化
js实现的文本框内容发生改变立马触发事件简单介绍:本章节介绍一下如何在文本框的内容发生变化的时候,立马触发一个事件执行响应的操作,而不是像是keydow或者keyup事件一样,只能够检测通过键盘输入导 ...
- Filter体现职责链模式
1. 前言 Filter—Filter 技术是servlet2.3 新增加的功能.完成的流程:对用户请求进行预处理,接着将请求交给Servlet进行处理并生成响应,最后Filter再对服务器响应进行后 ...