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 相关文章推荐
js 数组操作代码集锦
Apr 28 Javascript
Array.prototype.slice.apply的使用方法
Mar 17 Javascript
JavaScript插件化开发教程(五)
Feb 01 Javascript
Vue 固定头 固定列 点击表头可排序的表格组件
Nov 25 Javascript
微信小程序之网络请求简单封装实例详解
Jun 28 Javascript
JavaScript实现无刷新上传预览图片功能
Aug 02 Javascript
原生js封装添加class,删除class的实例
Nov 06 Javascript
基于Vue+element-ui 的Table二次封装的实现
Jul 20 Javascript
这样回答继承可能面试官更满意
Dec 10 Javascript
在Echarts图中给坐标轴加一个标识线markLine
Jul 20 Javascript
vue中如何添加百度统计代码
Dec 19 Vue.js
vue3中的组件间通信
Mar 31 Vue.js
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/08/20 PHP
Thinkphp中的curd应用实用要点
2015/01/04 PHP
php登录超时检测功能实例详解
2017/03/21 PHP
PHP设计模式之单例模式定义与用法分析
2019/03/26 PHP
tp5.1 框架路由操作-URL生成实例分析
2020/05/26 PHP
javascript OFFICE控件测试代码
2009/12/08 Javascript
jquery keypress,keyup,onpropertychange键盘事件
2010/06/25 Javascript
关于JavaScript中string 的replace
2013/04/12 Javascript
深入理解JavaScript系列(38):设计模式之职责链模式详解
2015/03/04 Javascript
jquery插件corner实现圆角边框的方法
2015/03/09 Javascript
JS实现点击事件统计的简单实例
2016/07/10 Javascript
jQuery中页面返回顶部的方法总结
2016/12/30 Javascript
jQuery实现拖动效果的实例代码
2017/06/25 jQuery
JavaScript事件方法(实例讲解)
2017/06/27 Javascript
用JavaScript做简易的购物车的代码示例
2017/10/20 Javascript
vue router 用户登陆功能的实例代码
2019/04/24 Javascript
关于layui的下拉搜索框异步加载数据的解决方法
2019/09/28 Javascript
Vue强制组件重新渲染的方法讨论
2020/02/03 Javascript
vue项目配置同一局域网可使用ip访问的操作
2020/10/23 Javascript
pandas使用之宽表变窄表的实现
2020/04/12 Python
基于python检查矩阵计算结果
2020/05/21 Python
Python3通过chmod修改目录或文件权限的方法示例
2020/06/08 Python
Dune London官网:英国著名奢华鞋履品牌
2017/11/30 全球购物
西班牙宠物用品和食品网上商店:Tiendanimal
2019/06/06 全球购物
自我鉴定怎么写
2013/12/05 职场文书
心理健康教育制度
2014/01/27 职场文书
美术教学感言
2014/02/22 职场文书
专项法律服务方案
2014/06/11 职场文书
公司领导班子对照材料
2014/08/18 职场文书
2014各大专业毕业生自我评价
2014/09/17 职场文书
创先争优活动个人总结
2015/03/04 职场文书
劳动仲裁代理词范文
2015/05/25 职场文书
Nginx解决403 forbidden的完整步骤
2021/04/01 Servers
Pytorch 如何实现LSTM时间序列预测
2021/05/17 Python
python生成可执行exe控制Microsip自动填写号码并拨打功能
2021/06/21 Python
Python+tkinter实现高清图片保存
2022/03/13 Python