angularjs解决跨域问题案例详解(简单方法)_angularjs

angularjs解决跨域问题案例详解(简单方法)_angularjs

ID:31191780

大小:71.50 KB

页数:3页

时间:2019-01-07

angularjs解决跨域问题案例详解(简单方法)_angularjs_第1页
angularjs解决跨域问题案例详解(简单方法)_angularjs_第2页
angularjs解决跨域问题案例详解(简单方法)_angularjs_第3页
资源描述:

《angularjs解决跨域问题案例详解(简单方法)_angularjs》由会员上传分享,免费在线阅读,更多相关内容在工程资料-天天文库

1、Angularjs解决跨域问题案例详解(简单方法)首先我们做点准备说明,不然你明口我说的是啥意思别人不明口,就算别人明口了那总有人不明口,那你要说了,我的意思是这个说明必须耍做了,答案是必须的,为了更好的方便大家理解嘛。我们以两个主域名或者一个主域名+—个二级域名为例,均可演示跨域问题。客户端a.com服务端b.com或者s.a.comangularjs版本VI.2.25准备工作做得很充分嘛,就差把我们的编辑器是subline暴露出来了,这个一般人我是不告诉他滴。有人嚷嚷了,这问题老早就有了,你

2、现在提出来有啥意义呢?难不成你还能把花忽悠开了?嗯,我还真能把花写开了。看戏吧,我们本篇要上演的是完整版跨域实例。接下来我们先看客户端是如何请求数据的注意哦,我们的代码是写在乩coin域名下面的var

3、app=:angular,moduleCapp",[]);app.controller、('appCtrl',['$scope',function($scope){$http({method:'JSOMP',url:http://www.b.com/test.php?callback=JSON_CALLBACK,,})・success(function(msg){console.log(data);});//或者$http.jsonp('http://www.b.com/test.php?cal

4、lback=JSON_CALLBACK,)•success(function(msg){console,log(msg);});}]);我们看到,这里是直接以jsonp的形式进行跨域请求的,其操作同jquery中对跨域的请求方式如出一辙。注意,我们的callback是固定的,即JSON_CALLBACK,尽量不耍去做任何改动我们再看服务端b.com中的test,php对请求数据的处理方式,这里以原生php的方式做参考$cal

5、lBack=isset($_GET[‘callback'])?$_GET['callback']:DEFAULT_CALLBACK;exit($calIBack.'('.jsonencode($data)我们再回来看看客户端console,log记录的结果▼[Object,Object,Object,Object,Object,Object,Object,Object,►0:Object►1:Object►2:Object►3:Object►4:Object►5:Object►6:Object»

6、7•Ahia广十到此,也就是说我们跨域请求是成功的!最后我们做个小总结,注意下其中的重点:1•客户端跨域请求的url后追加的参数是?callback=JSON_CALLBACK,参数callback的值指定为JSON.CALLBACK,注意是大写,就是JSON.CALLBACK不要作任何改动,感觉这里是个不小的坑,?callback的值稍作改动,客户端就需要全局定义callback函数,而冃还特么怎么再传给$scope处理?为了避免不必要的麻烦,这里建议就这么搞吧2.再看服务端,服务端需耍指定$

7、^11Back二$_GET['callback'];接收cal1back,而IL你还会发现接收的callback不是我们客户端写的?callback的值,客户端指定JSON_CALLBACK应该是为了触发angularjs内部的机制

当前文档最多预览五页,下载文档查看全文

此文档下载收益归作者所有

当前文档最多预览五页,下载文档查看全文
温馨提示:
1. 部分包含数学公式或PPT动画的文件,查看预览时可能会显示错乱或异常,文件下载后无此问题,请放心下载。
2. 本文档由用户上传,版权归属用户,天天文库负责整理代发布。如果您对本文档版权有争议请及时联系客服。
3. 下载前请仔细阅读文档内容,确认文档内容符合您的需求后进行下载,若出现内容与标题不符可向本站投诉处理。
4. 下载文档时可能由于网络波动等原因无法下载或下载错误,付费完成后未能成功下载的用户请联系客服处理。