angular中的jsonp记录
angular的正常机制采用引入$http服务的形式进行 get post等的访问。但是在跨域访问的时候就需要采用jsonp了。
不废话,直接上示例和引用原文地址:
比如访问地址为
http://url
需要再上边的 url后边加上 callback=JSON_CALLBACK
即访问地址形式为:
http://url?callback=JSON_CALLBACK
此访问的意思是告诉服务器端需要获取我的 callback (key),然后采用对应的key值对应的value JSON_CALLBACK (字符串)
进行返回,jsonp 这边会将返回的内容作为一个js表达式进行调用。
即服务器那边放回形如 return "JSON_CALLBACK("+ jsonData +")"; 的内容。
这边直接进行调用,当然你js的这边需要提供好对应的方法,既然你传递过去了 JSON_CALLBACK 那么就声明一个
JSON_CALLBACK全局方法吧。
即 function JSON_CALLBACK(){//your code
}
好吧,上边说的其实是一般的方法,在angular里边按照这么进行调用的话,其实请求的地址是形如(可以在debug模式中的network中进行查看)
http://url?callback=angular.callbacks._0
所以在返回的时候就要将对应的 JSON_CALLBACK 进行更改了。
即服务器端需要返回 return "angular.callbacks._0("+ jsonData +")"; 的内容
最后写一下就是, 服务器只要按照上边进行返回的话,那么就直接在success中进行调用了~ 我的是这个样子的,欢迎大家分享沟通。
$http.jsonp(url).success(function(data){
console.log(data);
});
附上stackoverflow(真是个好网站)参考地址:
原文地址:http://stackoverflow.com/questions/12066002/parsing-jsonp-http-jsonp-response-in-angular-js
angular中的jsonp记录的更多相关文章
- Angular中的jsonp
1.一般我们使用Angualr中的jsonp值这样使用的:注入$http服务 这样使用jsonp的方式可以支持多数api,但是douban不支持无法使用 module.controller('InTh ...
- 使用Cors在WebApi中实现跨域请求,请求方式为angular的 $http.jsonp
使用Cors在WebApi中实现跨域请求 第一步,在webapi项目中安装cors 在Web API配置文件中(Global.asax)进行全局配置: public class WebApiAppli ...
- Angular 中的数据交互(get jsonp post)
一.Angular get 请求数据 Angular5.x 以后 get.post 和和服务器交互使用的是 HttpClientModule 模块. 1.在 app.module.ts 中引入 并注入 ...
- angular 中父元素ng-repeat后子元素ng-click失效
在angular中使用ng-repeat后ng-click失效,今天在这个上面踩坑了.特此记录一下. 因为ng-repeat创造了新的SCOPE.如果要使用这个scope的话就必须使用$parent来 ...
- angular源码分析:angular中脏活累活的承担者之$interpolate
一.首先抛出两个问题 问题一:在angular中我们绑定数据最基本的方式是用两个大括号将$scope的变量包裹起来,那么如果想将大括号换成其他什么符号,比如换成[{与}],可不可以呢,如果可以在哪里配 ...
- 形象的讲解angular中的$q与promise(转)
以下内容摘自http://www.ngnice.com/posts/126ee9cf6ddb68 promise不是angular首创的,作为一种编程模式,它出现在……1976年,比js还要古老得多. ...
- angular源码分析:angular中的依赖注入式如何实现的
一.准备 angular的源码一份,我这里使用的是v1.4.7.源码的获取,请参考我另一篇博文:angular源码分析:angular源代码的获取与编译环境安装 二.什么是依赖注入 据我所知,依赖注入 ...
- Angular中 build的时候遇到的错误--There are multiple modules with names that only differ in casing
今天早上遇到一个Angular的编译的时候的错误 具体信息: There are multiple modules with names that only differ in casing.This ...
- Angular 个人深究(一)【Angular中的Typescript 装饰器】
Angular 个人深究[Angular中的Typescript 装饰器] 最近进入一个新的前端项目,为了能够更好地了解Angular框架,想到要研究底层代码. 注:本人前端小白一枚,文章旨在记录自己 ...
随机推荐
- [修]开启MySQL远程访问权限 允许远程连接
原文地址:http://www.cnblogs.com/XL-Liang/archive/2012/05/03/2481310.html 这个地址也许更有帮助:http://www.cppblog.c ...
- NCache:最新发布的.NET平台分布式缓存系统
NCache:最新发布的.NET平台分布式缓存系统在等待Microsoft完成Velocity这个.NET平台下的分布式内存缓存系统的过程中,现在让我们将目光暂时投向其他已经有所建树的软件开发商.Al ...
- javascript数组、对象和Null的typeof同为object,区分解决办法
在JS里typeof 大家用的很多,可以使对于数组.对象和Null无法区分的问题,看了看犀牛书还是有解决办法的. document.writeln(typeof "abc"); / ...
- Ext JS4百强应用: 用grid.plugin.CellEditing做高级查询 --第10强
Ext JS4,用grid.plugin.CellEditing做高级查询: 写了90%,界面出来了,小兴奋就贴出来,还有细节要调整,基本能用. 代码: Ext.define('chenghao.ad ...
- api 和 abi的区别
156down vote API: Application Program Interface This is the set of public types/variables/functions ...
- JavaScript的事件机制
JavaScript的事件机制 摘要 事件是将JavaScript脚本与网页联系在一起的主要方式,是JavaScript中最重要的主题之一,深入理解事件的工作机制以及它们对性能的影响至关重要.本文将详 ...
- Docker集群实验环境布署--swarm【7 让docker客户端支持docker-compose】
Docker-Compose是一个部署多个容器的简单但是非常必要的工具. 登录Docker客户端的服务器(默认是安装了docker-engine的服务器),再安装compose插件 # yum i ...
- python命令调用函数os.popen
参考自xerosploit 描述:利用os.popen()函数调用系统命令nmap进行扫描,并用grep命令对扫描结果关键内容进行提取 代码 #!/usr/bin/env pthon #--*--co ...
- sql Cursor的用法
table1结构如下 id int name ) declare @id int ) declare cursor1 cursor for --定义游标cursor1 select * from ta ...
- Ubuntu创建、删除文件与目录
"~"代表了用户主目录,即/home/帐户名.所以"/home/jv/下载"="~/下载" 创建文件和目录(文件夹) touch filen ...