Shindig中JavaScript RPC机制的应用

鉴客 发布于 2010/01/31 23:23
阅读 939
收藏 0

所说的RPC是做什么的:
实现安全的JavaScript跨域调用,比如说gadget-to-container、 container-to-gadget、gadget-to-gadget等。
例如adjustHeight这个特性,gadget通知 container(指partuza\UCHome方)更改iframe的高度,这涉及了Javascript的跨域调用。

像 adjustHeight、requestShareApp、requestSendMessage、requestNavigateTo都需要依赖于 RPC这一个特性。
---------------------------------------------------------------------------------------
以 Shindig和Partuza为例,跟踪adjustHeight的过程。

pplication\Views\common \header.php可以作为研究的起点,里面有
<script type="text/javascript" src="<?=PartuzaConfig::get('gadget_server')?>/gadgets/js/rpc.js?c=1"></script>
<script type="text/javascript" src="<?=PartuzaConfig::get('web_prefix')?>/js/jquery-1.3.js"></script>
<script type="text/javascript" src="<?=PartuzaConfig::get('web_prefix')?>/js/jquery.ui.all.js"></script>
<script type="text/javascript" src="<?=PartuzaConfig::get('web_prefix')?>/js/jquery.class.js"></script>
<script type="text/javascript" src="<?=PartuzaConfig::get('web_prefix')?>/js/container.js"></script>

可 以将"<?=PartuzaConfig::get('web_prefix')?>/js/container.js"作为第三方网站(指 partuza、UCHome)对 OpenSocial UI的自定义后的文件,存储在第三方网站处,而不是放置在Shindig。截止到目前(2009年3月20日),adjustHeight、 requestShareApp、requestNavigateTo都需要在这样的一个文件中进行UI的定制,requestSendMessage还 需要在Shindig处进行定制,但 Shindig开发人员也正在调整中,让这些OpenSocial UI统一在第三方网站处定制。

打 开container.js可以看到使用下面的语句:
gadgets.rpc.register('resize_iframe', this.setHeight);

意思是指:将Shindig规定的resize_iframe方法设置为自身的setHeight方 法;换句方式阐述,resize_iframe是Shindig规定的UI接口,setHeight是第三方网站的自定义实现。

resize_iframe 是Shindig内部对adjustHeight调用的一个别名。

从gadget.xml到最终调用上面的container.js的过 程可参照下图:


注 释1:rpc.js创建rpc对象时,将from变量赋给了f,from变量为iframe的名称,在该图中值应为 remote_iframe_canvas。
换句话说,在html中如果iframe没有指明name属性,则f变量为空,将会导致由 shindig发送给partuza的iframe标识为空,则进而无法让partuza定位iframe元素。
注释2:在 contianer.js中可直接使用this.f进而获得iframe,图中所示为使用jquery的方法设置ifame的高度。


---------------------------------------------------------------------------------------
Shindig 方的关键文件:

    * features\src\main\javascript\features\rpc\rpc.js
    * features\src\main\javascript\features\dynamic-height\dynamic-height.js
    * config\container.js

Partuza方的关键文件:

    * html\gadgets\files\container\rpc_relay.html
    * html\js\container.js
    * Application\Views\common\header.php
---------------------------------------------------------------------------------------
备 注1:
由于UCHome自带的javascript可能会与jquery有一定冲突,partuza所带的container.js使用了 jquery,则可将container.js修改为不使用jquery的方式调整iframe高度:

var iframe_element = document.getElementById(this.f);
iframe_element.style.height=height+"px";

备 注2:
shindig方也有一个container.js,位于config目录,可以将此文件看做为shindig rpc.js等文件的配置文件,
在里面和上述过程以及图示相关的配置项目有parentRelayUrl等,该parentRelayUrl将最 终指向partuza方。

加载中
返回顶部
顶部