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 相关文章推荐
ASP.NET中基于JQUERY的高性能的TreeView补充
Feb 23 Javascript
关于JavaScript的面向对象和继承有利新手学习
Jan 11 Javascript
JS如何判断移动端访问设备并解析对应CSS
Nov 27 Javascript
最细致的vue.js基础语法 值得收藏!
Nov 03 Javascript
react.js 获取真实的DOM节点实例(必看)
Apr 17 Javascript
原生JavaScript实现Ajax异步请求
Nov 19 Javascript
vue.js 获取select中的value实例
Mar 01 Javascript
小程序视频列表中视频的播放与停止的示例代码
Jul 20 Javascript
解决vue-router在同一个路由下切换,取不到变化的路由参数问题
Sep 01 Javascript
vue-cli 脚手架基于Nightwatch的端到端测试环境的过程
Sep 30 Javascript
Async/Await替代Promise的6个理由
Jun 15 Javascript
node.js中process进程的概念和child_process子进程模块的使用方法示例
Feb 11 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定时计划任务的实现方法详解
2013/06/06 PHP
php获取指定范围内最接近数的方法
2015/06/02 PHP
ThinkPHP实现递归无级分类――代码少
2015/07/29 PHP
PHP 文件写入和读取操作实例详解【必看篇】
2019/11/04 PHP
PHP使用PDO实现mysql防注入功能详解
2019/12/20 PHP
escape、encodeURI、encodeURIComponent等方法的区别比较
2006/12/27 Javascript
Input 特殊事件onpopertychange和oninput
2009/06/17 Javascript
js event事件的传递与冒泡处理
2009/12/06 Javascript
ExtJs GridPanel简单的增删改实现代码
2010/08/26 Javascript
基于jQuery的获取标签名的代码
2012/07/16 Javascript
javascript基于prototype实现类似OOP继承的方法
2015/12/16 Javascript
配置nodejs环境的方法
2017/05/13 NodeJs
JavaScript算法教程之sku(库存量单位)详解
2017/06/29 Javascript
jQuery中库的引用方法
2018/01/06 jQuery
使用vue-cli3新建一个项目并写好基本配置(推荐)
2019/04/24 Javascript
jQuery实现的记住帐号密码功能完整示例
2019/08/03 jQuery
js实现漂亮的星空背景
2019/11/01 Javascript
在Python中使用CasperJS获取JS渲染生成的HTML内容的教程
2015/04/09 Python
Python基于有道实现英汉字典功能
2015/07/25 Python
在Python程序中操作MySQL的基本方法
2015/07/29 Python
基于python的Tkinter实现一个简易计算器
2015/12/31 Python
python实现12306火车票查询器
2017/04/20 Python
python自动化脚本安装指定版本python环境详解
2017/09/14 Python
python里使用正则的findall函数的实例详解
2017/10/19 Python
python3读取csv文件任意行列代码实例
2020/01/13 Python
Python 实现Image和Ndarray互相转换
2020/02/19 Python
python爬虫今日热榜数据到txt文件的源码
2021/02/23 Python
世界汽车零件:World Car Parts
2019/09/04 全球购物
JDBC操作数据库的基本流程是什么
2014/10/28 面试题
毕业实习个人鉴定范文
2013/12/10 职场文书
男方父母婚礼答谢词
2014/01/25 职场文书
教师对学生的寄语
2014/04/03 职场文书
力学专业求职信
2014/07/23 职场文书
初中家长评语和期望
2014/12/26 职场文书
2015年检验科工作总结
2015/04/27 职场文书
python操作xlsx格式文件并读取
2021/06/02 Python