WebApp开发：ajax请求跨域问题的解决
服务端：PHP
客户端：Andorid, HTML5, jQuery, ajax
现象：本想通过jQuery的ajax功能从服务器取回数据存到手机的缓存里，结果总是错误，后来想到可能是跨域问题，所以查了下jsonp的方案先把流程跑通，明天再完善看看有什么好的方案
服务端：http://www.code-style.com/test/a.php
<?php //服务端返回JSON数据
$arr=array('name'=>'shujun.li');
$result=json_encode($arr); //动态执行回调函数
$callback=$_GET['callback'];
echo $callback."($result)";
?>
客户端
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Listview AutodividersSelector - jQuery Mobile Demos</title>
<script src="js/jquery.js"></script> <script type="text/javascript">
$.ajax({
url:"http://www.code-style.com/test/a.php",
dataType:'jsonp',
data:'',
jsonp:'callback',
success:function(result) {
alert(result["name"])
},
timeout:3000
});
</script>
</head>
<body>
</body>
</html>
生成URL : http://www.code-style.com/test/a.php?callback=jQuery1102004144126083701849_1420635061128&_=1420635061129
响应：jQuery1102004144126083701849_1420635061128({"name":"shujun.li"})
JSONP原理解析：
相当于jquery在页面生成一个匿名函数，这个函数可以传入一个JS对象，然后把这个函数的函数名作为URL参数传递给服务器端，服务端吐出的实际上是对这个函数的调用语句，输出到了页面以后会通过eval执行这个调用，这个匿名函数会再次调用我们的success函数，最终这么拿的数据，如果这样的话JSONP无法大规模的传输数据
$.ajax({
url:"http://www.code-style.com/test/a.php",
dataType:'jsonp',
data:'',
jsonp:'callback',
success: function(result) {
alert(result["name"])
},
timeout: 3000,
jQuery1102004144126083701849_1420635061128(obj)
{
success(obj);
}
});
WebApp开发：ajax请求跨域问题的解决的更多相关文章
- day78_淘淘商城项目_11_单点登录系统实现 + 用户名回显 + ajax请求跨域问题详解_匠心笔记
课程计划 1.SSO注册功能实现 2.SSO登录功能实现 3.通过token获得用户信息 4.ajax跨域请求解决方案--jsonp 1.服务接口实现 SSO系统就是解决分布式环境下登录问题的,本 ...
- Grails项目开发——前端请求跨域问题
Grails项目开发--前端请求跨域问题 最近做项目采用前后端分离的思想,使用Grails作为后台开发Restful API供前端调用. 在项目开发的过程中,遇到前端没办法通过ajax访问到后台接口的 ...
- 解决ajax请求跨域
跨域大部分需要通过后台解决,引起跨域的原因: 3个问题同时满足 才可能产生跨域问题,即跨域(协议,主机名,端口号中有一个不同就产生跨域) 下面是解决方法 方法一 // ajax请求跨域 /* *解决a ...
- 解决Ajax请求跨域问题
from:https://blog.csdn.net/wang379275614/article/details/53333775 上篇文章提到,由于浏览器的同源策略,使得,AJAX请求只能发给同源的 ...
- 处理Ajax请求跨域问题
ajax跨域的原理 ajax出现请求跨域错误问题,主要原因就是因为浏览器的“同源策略”. CORS是一个W3C标准,全称是"跨域资源共享"(Cross-origin resourc ...
- 关于ajax请求跨域问题
jQuery中的异步请求跨域的方法: xhrFields: {withCredentials: true} 当设置为 true时,表示允许跨域: false时,表示禁止跨域
- 关于在JS中AJAX导致跨域问题的解决
在部署一个原声的前端项目的时候,请求该服务器后端接口时发现出现了CORS跨域的问题,但是服务端已经做了同源策略的兼容,常见问题,遂记录. 报错信息: XMLHttpRequest cannot loa ...
- 关于ajax post请求跨域问题的解决心得
最近啊,公司有个项目,需要做一个手机端APP的后台管理系统.所以用到了度文本编辑框,经过了好好一番周折,终于弄好了,带到上线的时候发现啊,只能使用ip去访问网页的时候上能穿图片他不会报跨域的问题,而使 ...
- nodejs服务实现反向代理，解决本地开发接口请求跨域问题
前后端分离项目需要解决第一个问题就是,前端本地开发时如何解决通过ajax请求产生的跨域的问题.一般的做法是通过本地配置nginx反向代理进行处理的,除此之外,还可以通过nodejs来进行代理接口.当然 ...
随机推荐
- IC芯片
5.8寸显示屏/LB058WQ1(SD)01LG2 74HC04 0.3NXP10K 74HC138 0.37NXP20K 74HC245 0.52NXP30K 74HC595 明威 ...
- 一个App带你学会Retrofit2.0，麻麻再也不用担心我的网络请求了！
Retrofit.Retrofit.Retrofit,越来越多的人在玩这个网络请求框架,这个由squareup公司开源的网络请求框架确实挺好用,今天我们就来看一下这个东东怎么玩! Retrofit作为 ...
- Mysql 数据库 操作语句
mysql 格式语句规范 如何登陆你的数据库? 举例! 如果你的是 编译安装的花 那就得去编译安装后的那个目录中去,我的是安装到/usr/local/mysql 下登陆数据库:cd /usr/loca ...
- Java client 访问 memcached
在测试项目中引入了memcached作为缓存层,以下是memcached的缓存配置和调用过程. linux下memcached安装过程 直接参考以前的博文linux下安装memcached过程 不再 ...
- iOS应用审核的通关秘籍
磨刀不误砍柴工.作为手机应用开发者,你需要向应用商店提交应用审核,迅速通过审核可以让你抢占先机.对苹果iOS应用开发者来说尤其如此.苹果应用商店的审核近乎吹毛求疵,下面这些清单可以让你知道苹果会在哪些 ...
- 技术QQ群
欢迎加入moss技术交流群. 欢迎加入微信技术交流群.
- U3D 2D游戏之黑暗纪元 2D游戏基础入门开发全(1)
第一个U3D 2D游戏的例子,全部自己编写,算是入门用,这里记录一下. 1.首先游戏把层次布置好,这里分为 背景层,游戏层,UI层 背景层 (Background-1):就是单纯的背景显示作用. 游戏 ...
- ios PullToRefresh using animated GIF or image array or Vector image
说说那些令人惊叹的下拉效果 1. 动画下拉,这里借用一下github的资源 优点:直接用gif图处理,下拉进度完全按照gif图运行时间,只要时间和下拉进度匹配就可以了, 效果很流畅 https://d ...
- oracle 高版本导出低版本数据库并且导入到低版本数据的方法
第一步:sqlplus system/egis@orcl as sysdba; 进入sqlplus (输入管理员用户名/密码@数据库密码) 第二步: create directory dumpdir ...
- 伪Base16的构思和实现
最近看见了一个迅雷地址,发现将其转换为普通链接的工具后,发现所谓专用地址地址就是原地址前加一个表示迅雷的前缀,后进行Base64编码.查阅Base64编码过程后,突发奇想:能否做一个Base16算法? ...