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冒泡排序
May 24 Javascript
jquery 双色表格实现代码
Dec 08 Javascript
百度Popup.js弹出框进化版 拖拽小框架发布 兼容IE6/7/8,Firefox,Chrome
Apr 13 Javascript
jquery maxlength使用说明
Sep 09 Javascript
JS读取cookies信息(记录用户名)
Jan 10 Javascript
复选框全选与全不选操作实现思路
Aug 18 Javascript
innerHTML,outerHTML,innerText,outerText的用法及区别解析
Dec 16 Javascript
node.js回调函数之阻塞调用与非阻塞调用
Nov 13 Javascript
javascript实现网页中涉及的简易运动(改变宽高、透明度、位置)
Nov 29 Javascript
JavaScript字符串对象(string)基本用法示例
Jan 18 Javascript
详解Vue CLI3配置之filenameHashing使用和源码设计使用和源码设计
Aug 31 Javascript
解决Vue使用swiper动态加载数据,动态轮播数据显示白屏的问题
Sep 27 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编写的导航条程序
2006/10/09 PHP
PHP代码网站如何防范SQL注入漏洞攻击建议分享
2012/03/01 PHP
浅析虚拟主机服务器php fsockopen函数被禁用的解决办法
2013/08/07 PHP
PHP实现从远程下载文件的方法
2015/03/12 PHP
YII2.0之Activeform表单组件用法实例
2016/01/09 PHP
PHP获取HTTP body内容的方法
2018/12/31 PHP
PHP大文件分割分片上传实现代码
2020/12/09 PHP
把textarea中字符串里含有的回车换行替换成&amp;lt;br&amp;gt;的javascript代码
2007/04/20 Javascript
javascript GUID生成器实现代码
2009/10/31 Javascript
Javascript Math ceil()、floor()、round()三个函数的区别
2010/03/09 Javascript
JQuery表格拖动调整列宽效果(自己动手写的)
2014/09/01 Javascript
jQuery实现响应浏览器缩放大小并改变背景颜色
2014/10/31 Javascript
jQuery中position()方法用法实例
2015/01/16 Javascript
JavaScript获取页面中第一个锚定文本的方法
2015/04/03 Javascript
jQuery手风琴的简单制作
2017/05/12 jQuery
详解webpack编译多页面vue项目的配置问题
2017/12/11 Javascript
js实现一个简单的MVVM框架示例
2018/01/15 Javascript
vue项目在安卓低版本机显示空白的原因分析(两种)
2018/09/04 Javascript
js简单的分页器插件代码实例
2019/09/11 Javascript
node.js中Buffer缓冲器的原理与使用方法分析
2019/11/23 Javascript
为什么推荐使用JSX开发Vue3
2020/12/28 Vue.js
python xml解析实例详解
2016/11/14 Python
关于反爬虫的一些简单总结
2017/12/13 Python
python实现对文件中图片生成带标签的txt文件方法
2018/04/27 Python
python scipy求解非线性方程的方法(fsolve/root)
2018/11/12 Python
Python flask框架post接口调用示例
2019/07/03 Python
Python占用的内存优化教程
2019/07/28 Python
如何理解Python中包的引入
2020/05/29 Python
python中tkinter窗口位置\坐标\大小等实现示例
2020/07/09 Python
python中的列表和元组区别分析
2020/12/30 Python
使用CSS3的rem属性制作响应式页面布局的要点解析
2016/05/24 HTML / CSS
基于CSS3的CSS 多栏(Multi-column)实现瀑布流源码分享
2014/06/11 HTML / CSS
详解FireFox下Canvas使用图像合成绘制SVG的Bug
2019/07/10 HTML / CSS
白血病募捐倡议书
2014/05/14 职场文书
先进党支部事迹材料2016
2016/02/26 职场文书
MYSQL数据库使用UTF-8中文编码乱码的解决办法
2021/05/26 MySQL