Campus Perceiving OPhone Widgets’ Suite

Presentation on theme: "Campus Perceiving OPhone Widgets’ Suite"— Presentation transcript:

1 Campus Perceiving OPhone Widgets’ Suite
WEN Si, XIAO Zhi-qing, CHEN Hao, YU He-qi * 各位老师、同学们，大家晚上好。 首先非常感谢大家在百忙之中抽出时间来听我的汇报。 我所在的这个项目是国家级创新基金项目“OPhone校园感知Widget”。 项目组成员有：文思、肖智清（也就是我）、然后还有陈昊和于和琪。 指导老师是移动生活与新媒体实验室的纪阳教授。

2 Widgets – A Dark Horse In Web 2.0
What’s Widgets? * 大家可能会好奇什么是Widget。 Widget的中文名叫做“微技”， 是当今Web 2.0时代的一个流行词。 为了从直观上了解Widget的含义， 我们先来看看一些Widget的例子。

3 What’s Widgets? iGoogle * 这是Google的个性化主页iGoogle。 在这个页面中， 有许多小方块。
有天气预报、有翻译、有时钟等等。 这些小方块是Web Widget.

4 What’s Widgets? MyYahoo! * 这个是雅虎的个性化主页MyYahoo.
在MyYahoo上，同样有许多Web Widget。 Web Widget,就是网络微技。 iGoogle、MyYahoo这些Web Widget，是运行在浏览器上的， 也就是说，这些Widget的引擎是浏览器。

5 What’s Widgets? Apple’s Dashboard * 这是Apple最新产品iPad的Widget面板，
Dashboard是一个需要在本地安装Widget引擎。 在Dashboard上，我们可以添加、删除Widget， 根据您的要求来放置Widget. 您还可以DIY自己的个性化Widget.

6 What’s Widgets? Microsoft’s Gadgets * 这个界面大家肯定很熟悉。
这个就是微软公司出的Widgets，叫Gadgets。 我们安装Windows Vista和Windows Seven的时候， 就默认安装了Widget引擎。 在桌面上的时钟、日历等等， 都是本地Widget.

7 What’s Widgets? * 好。 我们已经看了这么多的Widget平台和Widget示例，

8 What’s Widgets? Widgets are small applications that run on the Widget engine. * 说白了， Widget其实就是在Widget引擎上运行的小程序。

9 What’s Widgets? Widgets are small applications that run on the Widget engine. It provides a single service such as a map, news feeds, etc. * 每一个Widget的功能可能很单一，比如只是一个地图，一个RSS阅读器等等。 但是，用户可以在Widget面板上自由组合和排列Widget。 这样的活动性可以很大程度上满足了Web 2.0中的长尾现象。

10 OPhone Widget * 我们这个项目的Widget, 是基于中国移动的OPhone手机。
左边是天气预报和股票走势， 右边是一个全屏的Widget连连看游戏。

11 Widget/Server Structure
* 我们的微技系列需要由无线传感网和网络服务作支撑。 大家也许都知道C/S架构和B/S架构。 在项目的实践中， 我们设计了一种W/S架构。 这种架构特别适合于为Widget提供服务， 又与当今互联网中的主流服务兼容。 让我们来看看这个架构。 总的说， 整个结构分为Widget平台所在的终端，和提供内容服务的服务器， 还有数据库。 Widget和Web Server都各自分为几个层。

12 Widget/Server Structure
* 在我们这个项目中，这个W/S架构是怎么体现的呢？

13 Widget/Server Structure
JIL Widget Engine on OPhone * 在我们这个项目中， OPhone上的微技平台是JIL引擎。

14 Widget/Server Structure
JIL Widget Engine on OPhone Interpret HTML, CSS, JavaScript codes to native programs * JIL Widget引擎可以把本地的HTML, CSS和JavaScript代码在Widget面板上呈现出来。

15 Widget/Server Structure
JIL Widget Engine on OPhone Interpret HTML, CSS, JavaScript codes to native programs REST * Widget与服务器之间的交互采用REST风格的API。 REST是无状态表象转移， 它用URL来标记网络上的资源。 在后面的幻灯片中还会讲到这个事情。

16 Widget/Server Structure
JIL Widget Engine on OPhone Interpret HTML, CSS, JavaScript codes to native programs REST redirection + PHP * 我们用阿帕奇的重定向功能， 将用户请求的URL作为参数送给PHP代码进行解析。 再送给逻辑部分进行处理。

17 Widget/Server Structure
JIL Widget Engine on OPhone Interpret HTML, CSS, JavaScript codes to native programs REST redirection + PHP * 数据聚合层是用来屏蔽下层的数据库的异构状况。 现在有许多分布式的数据库， 有些数据库是关系型的， 它们往往用SQL语言进行数据存取。 还有一些数据库是对象型的， 他们往往用LINQ语言进行数据存取。 除了从数据库进行数据存取外， 我们还可以从其他Web服务器来读取信息。 这一层，就是用来屏蔽数据源的异构性的。 Mask off the heteromerous of databases

18 Widget/Server Structure
JIL Widget Engine on OPhone Interpret HTML, CSS, JavaScript codes to native programs REST redirection + PHP * 实际上， 我们用的数据库只有MySQL数据库。 我们还会从其他的RSS源来读取信息。 Mask off the heteromerous of databases MySQL + RSS

19 Sensors * 我们这个项目叫做校园感知Widget。 其实无论感知什么东西， 都离不开传感器。
我们用的这一套无线传感设备是购买自LOIT公司。

20 Sensors * 这个是无线传感器的节点。 Node

21 Sensors * 这个是无线传感器的中继。 Node Relay

22 Sensors Node Relay Gateway * 这个是无线传感器的网关。 无线传感器节点测量到温度、湿度等数据后，
通过中继把数据传到网关。 网关再设法把数据插入到数据库中。 Node Relay Gateway

23 Sensors How to insert data? * 现在问题就来了： 我们怎样把数据插入到数据库中呢？
是不是就随便写一个程序把数据插到数据库就可以了呢？ 不是的。 我们要的是一种松耦合的、易扩展的、符合W/S特点的数据插入方案。 为此，我们提出了两种方案。

24 Sensors Server at Sensor * 一种，是把每一个无线传感器节点或者是无线网关做成Web服务器，
然后由主内容服务器去访问它。 我们回忆一下刚才看的那张W/S架构层次图。 我们已经知道， Web服务器的最下一层是用来屏蔽数据源的差异的。

25 Sensors Server at Sensor * 我们把Web服务器做在传感器上， 通过访问传感器来获得数据。

26 Sensors Server at Sensor Providing web service at 32k ROM, 2k RAM MCU.
* 事实上， 我们已经实现了在很低的硬件要求下提供Web服务。 我们已经能用32KB硬盘，2KB内存的单片机提供Web服务。

27 Sensors Server at Sensor Providing web service at 32k ROM, 2k RAM MCU.
Not enough fixed IP addresses. * 但是后来我们发现， 每一个Web服务器都需要一个固定的IP地址。 在北邮这种到处都用DHCP来分IP地址的地方， 是找不到那么多的IP地址的。 也许要等IPv6出来以后， 这个问题才能解决。 这种方案最后并没有部署到实际的演示系统中。

28 Sensors RESTful API REST = REpresentational State Transfer
HTTP protocol GET method POST method … * 最后，我们给Widget提供了是REST风格的API。 REST是无状态表象转移的意思。 我们知道，HTTP协议里有GET、PUT、POST、DELETE这四种标准动作。 所有的网络行为，都可以认为是对网络资源实行这四种方法。 比如，获得某天气信息，就是向这个时间和地点对应的URL发送GET消息； 插入一个温度，就是向这个温度对应的URI发送PUT或POST消息。 REST的重要思想之一， 就是只用这四个方法， 而不用其他方法， 来完成所有的网络交互过程。

29 Sensors RESTful API REST HTTP protocol GET method POST method … *
我们再来看看刚才那个图。 现在，我们向应用提供用REST风格的API。 Widget通过调用REST风格的API来从内容服务器获取数据。

30 Sensors RESTful API REST HTTP protocol GET method POST method … *
Web服务器再把收到的数据插到数据库中。

31 Sensors RESTful API REST HTTP protocol GET method POST method … *
数据插入的过程， 从REST的层面上讲，就是用了HTTP协议的POST方法。

32 Web Server RESTful API Compute Data I/O *
服务器端除了提供REST风格的API外，还做了普通的计算和对数据库的读写。

33 Widgets * 最后，我们再来谈谈Widget. 对用户的体验影响最大的， 应该就是Widget界面。
我们的Widget基于JIL Widget引擎。

34 Widgets JIL Widget Engine China Mobile Veri-zone … Voda-fone Soft-Bank
* JIL是联合创新实验室Joint Innovation Lab的意思。 它是由中国移动、Softbank Mobile和Vodafone等公司联合创立的一个Widget标准化联盟。 我们在OPhone终端上的开发， 就是基于JIL官方提供的开发平台。

35 Widget Demo Perceiving Widgets * 这些是我们做的Widget。 这些是感知系列Widget。
可以显示和分析传感器测量的信息。

36 Widget Demo Information Mashup Widgets * 这些是信息混搭Widget。 还是左下角这个图。
信息是由网络上其他的信息源提供的。 这体现了我们W/S架构对B/S、C/S的兼容性。 右边就是一个RSS阅读widget， 可以用来读北邮人论坛的。

37 Widget Demo 4W Learning Widgets whenever, whoever, wherever, whatever
* 这些是学习系列Widgets。 有考研学习Widget，科学发展观学习Widget, GRE、托福学习Widget, 驾考学习Widget等等。

38 MMarket http://www.mmarket.com/ * 我们制作的部分Widget已经上市。
登录中国移动Mobile Market， 在导航栏有Widget。点进去，就可以看到我们的产品了。

39 MMarket * 这些产品都是要收费的。

40 Contact me: xzq.xiaozhiqing@gmail.com
The End. Contact me: * 完了。谢谢大家。

41 Q&A