云应用开发快速入门

什么是云应用

云应用是针对移动终端的使用情景，将传统的本地应用和互联网应用的优点相结合，推出的下一代移动终端应用解决方案。

云应用框架分为移动终端和云端两部分。移动终端部分依托于云应用引擎，使用HTML5、CSS3和JavaScript开发，并且可以直接调用移动终端的各种特性接口；云端部分依托于云计算平台，使用PHP、Node.js等Web技术开发，用于提供各种云服务。

通过这个方案创建的云应用，拥有和本地应用一样流畅的用户体验，并可以便利地使用各种云服务为用户提供更强大的功能。云应用的出现让开发者摆脱了传统应用开发的桎梏，把智慧和精力都专注在解决用户需求上，快速地丰富移动互联网。



图1 云应用在线IDE

成为云应用开发者

首先需要拥有云账号，并申请云应用开发者的邀请码。使用邀请码激活开发者身份之后，就可以在线创建云应用了。遇到问题时，可以参考阿里云论坛里的“如何：成为云应用开发者？附云帐号、邀请码、激活邮件FAQ”这篇帖子，网址为http://bbs.aliyun.com/read.php?tid=16997。

SDK和IDE

为了帮助开发者快速开发出云应用，我们提供了SDK，帮助开发者快速搭建本地开发环境，并使用模拟器进行调试。同时，还提供了在线IDE，它集成了SDK，支持在线开发、在线调试，并内嵌了Git服务（如图1所示），使开发者可以基于浏览器在一个界面上同时编辑移动终端和云端的代码。如果大家对IDE有疑问，可以访问页面http://bbs.aliyun.com/read.php?tid=14303，上面有详细解释。



图2 云应用的文件结构

创建云应用

在线IDE能自动创建好基本的云应用文件结构（如图2所示），顶级的两个目录分别对应移动终端和云端的代码，它们存储在一起，但部署时会自动分发到相应的地方。



图3 云应用打包以后的文件结构

云应用的移动终端部分是典型的单页面应用结构，开发时每个页面都对应独立的模板和页面类，发布时会自动进行编译合并，并自动生成index.html，其文件结构如图3所示。

新增一个页面

新增一个模板文件 runrungo/src/tpl/welcome.xml：


新增一个页面类runrungo/src/classes/runrungo/page/HomePage.js：


配置页面类 runrungo/src/lib/runrungo.lib.js：



配置云应用入口类runrungo/src/classes/runrungo/Apprunrungo.js：



修改页面样式 runrungo/res/css/runrungo.css：



跳转到这个页面：


引入第三方类库

在云应用中，可以很方便地引入第三方类库。以jQuery为例，首先要在根目录下创建一个子目录，命名为lib，并将jquery-1.7.1.min.js上传到这个目录。然后配置app.json文件，根据实际需要调整加载顺序：


调用云端接

每个云应用都标配了一个ACE空间，可用来开发云端服务接口。作为示例，我们用Node.js版本的ACE创建数据接口（index.js）：


接下来，在云应用中调用这个接口，并且将数据显示出来：

调用移动终端接口

云应用集成了各种移动终端接口，完整列表请查看文档developer.aliyun.com/docs。下面的代码段可以说明如何启动浏览器并加载指定页面：


查看开发中的云应用

云应用不需要下载和安装，在云市场中直接点击就可以运行（如图4所示）。如果登录了云账号，还可以看到正在开发中的云应用。一旦云应用申请发布，并通过审核，所有移动终端用户都可以在云市场中看到这个应用的最新版本。



图4 无需安装，快速启动一个云应用

作者鄢学鵾，阿里云无线运营UED负责人。对Web标准、前端开发模式、性能优化和自动化有较深入的研究， 目前专注于从Mobile到PC领域的设计、 技术和业务间的结合