国内首个基于HTML5技术的移动应用开发平台AppCan公测以来，拥有了第一批的开发者。官方也组织了扶持计划，首次扶持50个团队，这些团队中有个人开发者，有创业团队，也有企业商业项目。然而，有不少的团队和开发者对AppCan平台的开发还是感到陌生，不知如何着手。因此，本文会介绍下AppCan平台开发的一些基础，希望能够对开发者有所帮助。
开发工具
在官方的DEV文档中，找到“AppCan SDK 入门指南”，下载SDK安装包。AppCan SDK是基于Eclipse进行插件开发的，同时又集成了以Chrome内核为基础的运行模拟器，此模拟器扩展了uex前缀（即AppCan的API）的JS对象。而Chrome自带的“Developer-Tools”（在页面中点击右键，选择‘审查元素’）给css调试及JS调试带来了方便，这个工具希望开发者能够利用起来，能够在很大程度上解决css及JS的一些问题。
在官方的DEV文档中，开发者能够看到“AppCan SDK真机调试环境”。这个工具是做什么用的呢？由于HTML5+css，在Chrome中的效果和在手机上的效果有些差距：PC 版本webkit(浏览器引擎，Chrome和Safari及IOS，Android浏览器都采用此引擎)上支持的一些css属性在手机版webkit上并不支持。因此，开发者开发的应用需要在真机上运行看效果。然而，通过AppCan SDK打包生成安装包，然后安装到手机上去查看效果，如此反复，定会影响开发效率。为此，AppCan提供了player版本，只需要安装player，开发者只需把应用包（网页包）拷贝到手机相应的目录下即可。比如下载Android Player是一个.apk的安装包，安装到手机上后，把需要调试的应用包（在AppCan SDK中创建项目目录下的android_iphone目录）拷贝到“sdcard/widgetone/widgetapp”目录下，运行player程序，进入即可看到开发者拷贝进去的应用的icon，点击icon进入应用。而利用uexLog.sendLog接口，可以在手机上运行JS时，把log信息输出到AppCan SDK的Log控制台。
关于通讯
利用AppCan平台开发的应用，里面的网页包，即html页面都是在手机本地保存的，那么这些页面如何与服务器进行通讯呢？很多开发者都有这个疑问。这里需要了解一个“Ajax跨域请求”的概念。离线的一个html页面异步去请求一个网络的链接，这个请求是属于Ajax跨域请求问题。Ajax跨域请求是有安全限制的，这一安全限制是浏览器的行为，即所有支持JavaScript的浏览器都实现了同源策略这一安全策略。
那么，既然有限制，如何解决呢？这里介绍两种方式，第一、利用JSONP方式，JSONP是JSON with Padding的略称，它是一个非官方的协议，它允许在服务器端集成Script tags返回至客户端，通过javascript callback的形式实现跨域访问。--（来源百度）在大家比较常用的jquery.js中就利用JSONP方式实现了Ajax跨域请求：$.getJSON(url,[data],[callback])；第二、利用AppCan提供的uexXmlHttpMgr对象，此方法也是利用callback的形式实现跨域访问。并且，uexXmlHttpMgr还扩展了Post方式请求，即还能实现文件上传。
关于窗口机制
AppCan提供了一套窗口机制，用来提升应用的交互体验。利用“多窗口机制”，开发者可以把不同html页面放到不同的窗口中。比如A窗口加载a.html，B窗口加载b.html。A窗口中的JS代码可以通过uexWindow.open方法打开B窗口，此时B窗口执行，而A窗口在后台挂起。当B窗口中的JS代码关掉（uexWindow.close）当前窗口时，A窗口从后台挂起状态回到当前执行状态。
AppCan还提供了“主+辅窗口机制”，由于在IOS5.0、Android2.2才开始支持css的position fixed属性。因此在这些版本之前的设备上，基本无法实现导航栏固定，内容区域可以滚动的效果。而AppCan的“主+辅窗口”能够用来固定导航栏的，实现上述效果，如下图：
图 一：主+辅窗口示意图
AppCan也提供“浮动窗口机制”，可以在当前窗口中浮动一个窗口出来，这在做一些交互体验中非常实用。而且，浮动窗口也可以一定程度上代替iframe，因为iframe在手机版webkit中支持比较弱，它不允许设置iframe的高和宽；甚至用了iframe的页面会影响当前页面其它内容的显示。
关于开发的一些建议
在AppCan的扶持计划中，有些开发者或团队的项目将近完成。但看到其代码书写规范还是需要注意些，这也是为什么有些应用运行比较慢的原因：
Ø 建议所有UI，能够用css3表示的都用css3去写，而非用图片代替。比如阴影，圆角，渐变色等。
Ø 建议所有的JS（即<script></script>）都放到</body>之后，这是因为html是阻塞执行的，如果<script></script>放到<head></head>中，JS中有加载触发跨域请求的话，那么html执行到这会先去执行请求，而后去解析之后的<body></body>内容，看起来页面加载缓慢。
Ø 建议所有用到uex前缀的AppCan API，都在window.uexOnload中执行。window.uexOnload等同于window.onload，只是前者是在uex对象的初始化工作完毕后才执行，此初始化工作需要几毫秒；而后者是网页一加载即可执行，会比window.uexOnload快一些。
Ø 建议在第一级页面中，比如“主+辅窗口示意图”中的下导航，有四个栏目，每个栏目点击进去都是不同的而且是比较常用的功能。那么可以用四个窗口去加载这四个栏目，而不需要关掉（uexWindow.close）这个四个窗口，即让这四个窗口在程序运行中一直存在。这样，窗口从后台挂起状态转入运行状态，要比窗口重新开启来的快。其他页面的开关还是挂起，可根据具体业务需求而定。
Ø 在手机上的onclick事件是有延迟的，这也是为什么有些应用看起来会慢的原因。因此，如果有比较讲究事件响应的应用，可以用ontouchstart,ontouchmove,ontouchend事件去模拟onclick事件。
