angularjs 学习笔记(一) -----JSONP跨站访问

1、下载angular-seed-master-master包，解压缩后将新版本的angularJS文件放入其中。

2、制作frontmockup文件夹（前端调用），同时制作backmockup文件夹（后端调用），使用IIS开启2个webserver（此步骤可以用其他方式替代）。

3、 backmockup站点添加以下HTTP头

Access-Control-Allow-Credentials：true

Access-Control-Allow-Headers：origin,x-requested-with,content-type

Access-Control-Allow-Methods： POST,GET,OPTIONS

Access-Control-Allow-Origin：*

（此处用来开启跨域访问，IIS中在HTTP响应头中添加）

4、 AngularJs 跨域访问使用$resource的JSONP技术，代码如下

.service('JsonSource', ['$resource',function($resource) {

return $resource('http://127.0.0.1:801/index.asp', {}, {init:{method:'JSONP',format: 'json', params:{callback:'JSON_CALLBACK'},isArray:true}});

}])

其中init方法为自定义，因为需要用到method:'JSONP'，所以不能使用get、query等自带方法，数组直接用isArray设置。

params:{callback:'JSON_CALLBACK'}是关键点，JSON_CALLBACK为系统方法，会生成一个自增长ID，用以与客户端匹配，客户端用<%=request("callback")%>方式获得，并输出

angular.callbacks._0(

[{"name":"angular.callbacks._0","journal_id":"539016f202b418c1e6000019"}])

这个方法的原始形态是callback:'JSON_CALLBACK'，并不使用params，由于无法使用request获得参数，不知道服务器端怎么配置，理论上这个选项的安全性更高。

5、数据读取调用JsonSource的init方法

function ($scope,JsonSource ) {

JsonSource.init(function(result){

$scope.journals = result;

});

}

通过ng-repeat="journal in journals" 循环输出

6、跨站访问功能完成，整理成压缩文件angularjs-0.0-20140610-jsonp.zip。

转载于:https://www.cnblogs.com/aaronjin/p/3795823.html

angularjs 学习笔记(一) -----JSONP跨站访问相关推荐

【安全牛学习笔记】CSRF跨站请求伪造攻击漏洞的原理及解决办法
CSRF跨站请求伪造攻击漏洞的原理及解决办法 CSRF,夸张请求伪造漏洞漏洞的原理及修复方法 1.常见的触发场景 2.漏洞原理:浏览器同源策略 3.DEMO 4.漏洞危害 5.如何避免&修复 ...
【安全牛学习笔记】CSRF跨站请求伪造***漏洞的原理及解决办法
CSRF跨站请求伪造***漏洞的原理及解决办法 CSRF,夸张请求伪造漏洞漏洞的原理及修复方法 1.常见的触发场景 2.漏洞原理:浏览器同源策略 3.DEMO 4.漏洞危害 5.如何避免&修 ...
【安全牛学习笔记】xss跨站
xss跨站解释 xss类型分类 xss***手法模拟一次xss*** 简述跨站脚本***(也称为XSS)指利用网站漏洞从用户那里恶意盗取信息.***者通过在链接中插入恶意代码, ...
【AngularJs学习笔记三】Grunt任务管理器
为什么80%的码农都做不了架构师?>>> #0 系列目录# AngularJs学习笔记 [AngularJs学习笔记一]Bower解决js的依赖管理 [AngularJs学习笔 ...
跨站访问如何保证session的正常使用
1.最近公司开发了一个网站项目,一切顺利.由于网页没有兼容手机浏览器,后来添加了一个webapp端,独立于另一个站点,用于解决兼容手机浏览器的问题.其中webapp端的数据全部通过ajax进行请求另一 ...
jsonp跨域访问服务
前段时间在做产品开发的时候,需要与公司网站那边进行交互,我们所开发的产品上线后是放在一个域名下,公司网站那块是在另一个域名下,这样在页面中调用网站那边的接口时就存在跨域的问题,当时为了不修改网站那边 ...
WinDbg学习笔记（二）--字符串访问断点
标题: [原创]WinDbg学习笔记(二)--字符串访问断点作者: gaorqing 时间: 2009-07-25,21:39:04 链接: http://bbs.pediy.com/sho ...
【AngularJs学习笔记五】AngularJS从构建项目开始
为什么80%的码农都做不了架构师?>>> #0 系列目录# AngularJs学习笔记 [AngularJs学习笔记一]Bower解决js的依赖管理 [AngularJs学习笔 ...
[Jeson]Nginx入门到实践1-4章 ,关闭iptables,nginx重启,nginx缓存, 跨站访问,Rewrite规则,Https服务优化
第4章 Nginx 与 Lua nginx 与 Lua Https服务优化激活keepalive长连接设置ssl session 缓存动静分离 Rewrite规则 nginx 常见正则匹配符号表 ...

angularjs 学习笔记(一) -----JSONP跨站访问

angularjs 学习笔记(一) -----JSONP跨站访问相关推荐

最新文章

热门文章