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 相关文章推荐
use jscript with List Proxy Server Information
Jun 11 Javascript
javascript动态加载二
Aug 22 Javascript
js解析json读取List中的实体对象示例
Mar 11 Javascript
jQuery实现点击该行即可删除HTML表格行
Oct 17 Javascript
JS结合bootstrap实现基本的增删改查功能
Jul 22 Javascript
js实现千分符和保留几位小数的简单实例
Aug 01 Javascript
js学习之----深入理解闭包
Nov 21 Javascript
js正则表达式验证密码强度【推荐】
Mar 03 Javascript
JS实现图片转换成base64的各种应用场景实例分析
Jun 22 Javascript
微信小程序form表单组件示例代码
Jul 15 Javascript
elementUI Tree 树形控件的官方使用文档
Apr 25 Javascript
JavaScript深入V8引擎以及编写优化代码的5个技巧
Jun 24 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中单个数据库字段多列显示(单字段分页、横向输出)
2014/07/28 PHP
使用GD库生成带阴影文字的图片
2015/03/27 PHP
PHP微信开发用Cache 解决数据缓存
2016/07/11 PHP
PHP使用imagick扩展实现合并图像的方法
2017/04/25 PHP
PHP获取访问设备信息的方法示例
2019/02/20 PHP
JS构建页面的DOM节点结构的实现代码
2011/12/09 Javascript
jQuery修改class属性和CSS样式整理
2015/01/30 Javascript
浅析javascript中的DOM
2015/03/01 Javascript
浅谈jQuery页面的滚动位置scrollTop、scrollLeft
2015/05/19 Javascript
Backbone.js的一些使用技巧
2015/07/01 Javascript
基于Jquery实现万圣节快乐特效
2015/11/01 Javascript
jquery单击事件和双击事件冲突解决方案
2016/03/02 Javascript
BootStrapTable服务器分页实例解析
2016/12/20 Javascript
jQuery插件FusionCharts绘制的3D饼状图效果实例【附demo源码下载】
2017/03/03 Javascript
JavaScript之实现一个简单的Vue示例
2019/01/17 Javascript
详解如何用webpack4从零开始构建react开发环境
2019/01/27 Javascript
开源一个微信小程序仪表盘组件过程解析
2019/07/30 Javascript
非常实用的jQuery代码段集锦【检测浏览器、滚动、复制、淡入淡出等】
2019/08/08 jQuery
Electron 调用命令行(cmd)
2019/09/23 Javascript
React学习之受控组件与数据共享实例分析
2020/01/06 Javascript
[53:21]2014 DOTA2国际邀请赛中国区预选赛5.21 DT VS LGD-CDEC
2014/05/22 DOTA
[02:52]2017DOTA2国际邀请赛中国区预选赛晋级之路
2017/07/03 DOTA
[51:36]Optic vs Newbee 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/18 DOTA
pandas修改DataFrame列名的方法
2018/04/08 Python
python计算阶乘和的方法(1!+2!+3!+...+n!)
2019/02/01 Python
python中自带的三个装饰器的实现
2019/11/08 Python
HTML5验证以及日期显示的实现详解
2013/07/05 HTML / CSS
英国家居用品和床上用品零售商:P&B Home
2020/01/16 全球购物
经典c++面试题五
2014/12/17 面试题
电子技术专业中专生的自我评价
2013/12/17 职场文书
写自荐信的注意事项
2014/03/09 职场文书
六五普法规划实施方案
2014/03/21 职场文书
2014年工作总结与下年工作计划
2014/11/27 职场文书
辞职信标准格式
2015/02/27 职场文书
2015年办公室工作总结范文
2015/03/31 职场文书
高中家长意见怎么写
2015/06/03 职场文书