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记录的更多相关文章

  1. Angular中的jsonp

    1.一般我们使用Angualr中的jsonp值这样使用的:注入$http服务 这样使用jsonp的方式可以支持多数api,但是douban不支持无法使用 module.controller('InTh ...

  2. 使用Cors在WebApi中实现跨域请求,请求方式为angular的 $http.jsonp

    使用Cors在WebApi中实现跨域请求 第一步,在webapi项目中安装cors 在Web API配置文件中(Global.asax)进行全局配置: public class WebApiAppli ...

  3. Angular 中的数据交互(get jsonp post)

    一.Angular get 请求数据 Angular5.x 以后 get.post 和和服务器交互使用的是 HttpClientModule 模块. 1.在 app.module.ts 中引入 并注入 ...

  4. angular 中父元素ng-repeat后子元素ng-click失效

    在angular中使用ng-repeat后ng-click失效,今天在这个上面踩坑了.特此记录一下. 因为ng-repeat创造了新的SCOPE.如果要使用这个scope的话就必须使用$parent来 ...

  5. angular源码分析:angular中脏活累活的承担者之$interpolate

    一.首先抛出两个问题 问题一:在angular中我们绑定数据最基本的方式是用两个大括号将$scope的变量包裹起来,那么如果想将大括号换成其他什么符号,比如换成[{与}],可不可以呢,如果可以在哪里配 ...

  6. 形象的讲解angular中的$q与promise(转)

    以下内容摘自http://www.ngnice.com/posts/126ee9cf6ddb68 promise不是angular首创的,作为一种编程模式,它出现在……1976年,比js还要古老得多. ...

  7. angular源码分析:angular中的依赖注入式如何实现的

    一.准备 angular的源码一份,我这里使用的是v1.4.7.源码的获取,请参考我另一篇博文:angular源码分析:angular源代码的获取与编译环境安装 二.什么是依赖注入 据我所知,依赖注入 ...

  8. 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 ...

  9. Angular 个人深究(一)【Angular中的Typescript 装饰器】

    Angular 个人深究[Angular中的Typescript 装饰器] 最近进入一个新的前端项目,为了能够更好地了解Angular框架,想到要研究底层代码. 注:本人前端小白一枚,文章旨在记录自己 ...

随机推荐

  1. [修]开启MySQL远程访问权限 允许远程连接

    原文地址:http://www.cnblogs.com/XL-Liang/archive/2012/05/03/2481310.html 这个地址也许更有帮助:http://www.cppblog.c ...

  2. NCache:最新发布的.NET平台分布式缓存系统

    NCache:最新发布的.NET平台分布式缓存系统在等待Microsoft完成Velocity这个.NET平台下的分布式内存缓存系统的过程中,现在让我们将目光暂时投向其他已经有所建树的软件开发商.Al ...

  3. javascript数组、对象和Null的typeof同为object,区分解决办法

    在JS里typeof 大家用的很多,可以使对于数组.对象和Null无法区分的问题,看了看犀牛书还是有解决办法的. document.writeln(typeof "abc"); / ...

  4. Ext JS4百强应用: 用grid.plugin.CellEditing做高级查询 --第10强

    Ext JS4,用grid.plugin.CellEditing做高级查询: 写了90%,界面出来了,小兴奋就贴出来,还有细节要调整,基本能用. 代码: Ext.define('chenghao.ad ...

  5. api 和 abi的区别

    156down vote API: Application Program Interface This is the set of public types/variables/functions ...

  6. JavaScript的事件机制

    JavaScript的事件机制 摘要 事件是将JavaScript脚本与网页联系在一起的主要方式,是JavaScript中最重要的主题之一,深入理解事件的工作机制以及它们对性能的影响至关重要.本文将详 ...

  7. Docker集群实验环境布署--swarm【7 让docker客户端支持docker-compose】

    Docker-Compose是一个部署多个容器的简单但是非常必要的工具.   登录Docker客户端的服务器(默认是安装了docker-engine的服务器),再安装compose插件 # yum i ...

  8. python命令调用函数os.popen

    参考自xerosploit 描述:利用os.popen()函数调用系统命令nmap进行扫描,并用grep命令对扫描结果关键内容进行提取 代码 #!/usr/bin/env pthon #--*--co ...

  9. sql Cursor的用法

    table1结构如下 id int name ) declare @id int ) declare cursor1 cursor for --定义游标cursor1 select * from ta ...

  10. Ubuntu创建、删除文件与目录

    "~"代表了用户主目录,即/home/帐户名.所以"/home/jv/下载"="~/下载" 创建文件和目录(文件夹) touch filen ...