JSONP 跨域共享信息


Posted in Javascript onAugust 16, 2012

由于同源策略,一般来说位于 server1.example.com 的网页无法与不是 server1.example.com 的服务器沟通,而 HTML 的 <script> 元素是一个例外。利用 <script> 元素的这个开放策略,网页可以得到从其他来源动态产生的 JSON 资料,而这种使用模式就是所谓的 JSONP。用 JSONP 抓到的资料并不是 JSON,而是任意的 JavaScript,用 JavaScript 直译器执行而不是用 JSON 解析器解析。

下面是我在一个项目中的应用:

描述:域名dev.uc.everychina.com 要获得域名 dev.members.everychina.com下的数据
dev.members.everychina.com的服务器端代码:

class JsController extends CController { 
public function actionIndex() { 
$callback = isset($_GET['callback']) ? $_GET['callback'] : ''; 
$result = array(); 
$userinfo = Intf_Client_Uc_User::instance()->getLoginUser(); 
$cid = Everychina_Member::instance()->getCid($userinfo['uid']); 
//公司展厅评分 
$room_score = Ec_RoomScore::getInstance(); 
//获得展厅老的评分 
$update_status = true; 
//重新评分 
if(isset($_GET['action']) && $_GET['action']=='update') { 
$score_res = $room_score->getScoreInfo($cid); 
$room_score->updateScoreResult($cid,$score_res); 
$update_status = true; 
} 
$result['status'] = $update_status; 
$res = $room_score->getScoreResult($cid); 
$result['score'] = $room_score->getScoreResultView($res['score']); 
if ($callback) { 
$js = json_encode($result); 
echo "$callback( ($js) );"; 
} 
}

域名 dev.uc.everychina.com 下,前端调用(html)
<a id="update_score" href="#" onclick="ajaxUpdateScore();return false;">update score</a> 
<div id="member_score"></div>

javascript
function ajaxUpdateScore(){ 
if(document.getElementById("member_score_script")) { 
var score_script = document.getElementById("member_score_script"); 
document.body.removeChild(score_script); 
} 
var score_script = document.createElement("script"); 
score_script.id = "member_score_script"; 
score_script.src = 'http://dev.members.everychina.com/index.php?r=js/index&callback=show_score&t='+new Date().getTime(); 
document.body.appendChild(score_script); 
} 
function show_score(json) { 
if(json.status == true) { 
var html = '<p>level:'+json.score.level+'</p>'; 
html += '<p>msg:'+json.score.msg+'</p>'; 
html += '<p>score:'+json.score.score+'</p>'; 
$("#member_score").html(html); 
} 
}
Javascript 相关文章推荐
获得Javascript对象属性个数的示例代码
Nov 21 Javascript
JS获取select-option-text_value的方法
Dec 26 Javascript
js Dialog 去掉右上角的X关闭功能
Apr 23 Javascript
理解javascript函数式编程中的闭包(closure)
Mar 08 Javascript
jQuery动态添加
Apr 07 Javascript
JS简单实现tab切换效果的多窗口显示功能
Sep 07 Javascript
微信小程序 实战程序简易新闻的制作
Jan 09 Javascript
微信小程序支付之c#后台实现方法
Oct 19 Javascript
node中modules.exports与exports导出的区别
Jun 08 Javascript
小程序扫描普通链接二维码跳转小程序指定界面方法
May 07 Javascript
Openlayers实现地图全屏显示
Sep 28 Javascript
JS如何监听div的resize事件详解
Dec 03 Javascript
js自执行函数的几种不同写法的比较
Aug 16 #Javascript
js三种排序算法分享
Aug 16 #Javascript
jQuery点击后一组图片左右滑动的实现代码
Aug 16 #Javascript
JavaScript高级程序设计 阅读笔记(二十) js错误处理
Aug 14 #Javascript
JavaScript高级程序设计 阅读笔记(十八) js跨平台的事件
Aug 14 #Javascript
JavaScript高级程序设计 阅读笔记(十七) js事件
Aug 14 #Javascript
JavaScript高级程序设计阅读笔记(十六) javascript检测浏览器和操作系统-detect.js
Aug 14 #Javascript
You might like
PHP随机生成信用卡卡号的方法
2015/03/23 PHP
PHP输出图像imagegif、imagejpeg与imagepng函数用法分析
2016/11/14 PHP
PHP哈希表实现算法原理解析
2020/12/11 PHP
6个常见的 PHP 安全性攻击实例和阻止方法
2020/12/16 PHP
javascript 动态添加事件代码
2008/11/30 Javascript
JavaScript strike方法入门实例(给字符串加上删除线)
2014/10/17 Javascript
javascript实现的右下角弹窗实例
2015/04/24 Javascript
js实现TAB切换对应不同颜色的代码
2015/08/31 Javascript
js实现当鼠标移到表格上时显示这一格全部内容的代码
2016/06/12 Javascript
JavaScript从0开始构思表情插件
2016/07/26 Javascript
AngularJS基础 ng-if 指令用法
2016/08/01 Javascript
详解通过源码解析Node.js中cluster模块的主要功能实现
2018/05/16 Javascript
Vue-CLI项目中路由传参的方式详解
2019/09/01 Javascript
使用Angular material主题定义自己的组件库的配色体系
2019/09/04 Javascript
[05:15]DOTA2英雄梦之声_第16期_灰烬之灵
2014/06/21 DOTA
[50:58]2018DOTA2亚洲邀请赛 4.1 小组赛 B组 Mineski vs EG
2018/04/03 DOTA
python实现感知器
2017/12/19 Python
Python输入二维数组方法
2018/04/13 Python
详解分布式任务队列Celery使用说明
2018/11/29 Python
详解Python的三种可变参数
2019/05/08 Python
python学习将数据写入文件并保存方法
2020/06/07 Python
Django restful framework生成API文档过程详解
2020/11/12 Python
解决Pycharm 运行后没有输出的问题
2021/02/05 Python
Html5导航栏吸顶方案原理与对比实现
2020/06/10 HTML / CSS
瑞典时尚服装购物网站:Miinto.se
2017/10/30 全球购物
英国蛋糕装饰用品一站式商店:Craft Company
2019/03/18 全球购物
Ray-Ban雷朋瑞典官方网站:全球领先的太阳眼镜品牌
2019/08/22 全球购物
澳大利亚顶级美发和美容贸易超市:glamaCo
2020/01/19 全球购物
实习求职信
2013/12/01 职场文书
大课间活动实施方案
2014/03/06 职场文书
学生会干部自我鉴定2014
2014/09/18 职场文书
2014年网管工作总结
2014/12/11 职场文书
公司出纳岗位职责
2015/03/31 职场文书
幼儿园迎新生欢迎词
2015/09/30 职场文书
2016年优秀少先队员事迹材料
2016/02/26 职场文书
Python中22个万用公式的小结
2021/07/21 Python