干货教程 | APICloud新手学习心得分享

最近很多爱学习的开发者，在后台给柚子君留言询问：如何在APICloud平台创建app？如何添加模块？自定义loader编译好之后在studio里面怎么同步等问题。



柚子君就借此机会给大家分享一个对 js 及前端了解较浅的新手开发者的学习心得（不要小瞧新手哦，分享的干货绝对有惊喜），主要说明一个登录页的实例及调试中遇到的问题。分享者负责的项目架构大致为ApiCloud+Asp.Net MVC，分享如下：



一、首次创建一个demo



先自己按照官网教程，登录https://www.apicloud.com/，注册后创建一个应用，进行端设置、证书设置(这里注意名称使用系统已生成好的)、模块设置(可添加几个官方模块及已有的自定义模块)，最后进行云编译。



之后，去官网下载本地编译工具APICloud Studio(在官网“开发工具”下面)，安装后，可从“云端资源库”的SVN中找到开始创建的项目，检出后，在“我的app项目”中即可看到。之后可自主在合适项目目录中创建或修改启动页面(假定为index.html)，然后在config.xml中进行设置(注意是要在“源码”而不是“编辑器”选项卡中)，widget的id属性可在云平台的系统概述中得到，content的src属性用来指定启动页面。



之后就是修改后的编译了，可用Android平板连接电脑(需要驱动，其实安装一些手机助手软件即可，如金山助手、360手机助手或豌豆荚都行)。这里分享者的心得是：APICloud中除了必须云端编译的修改(如添加官方模块、自定义模块、端配置等【哪些修改需要云编译，官方文档中都有说明】，修改后要云编译，然后在studio中“资源同步”、“编译自定义Loader”【自定义模块才需要此步】，最后再“真机同步”)以外的修改(如修改启动页html文件) ，想让其生效的话，修改后可直接真机同步(Ctrl+R)。



二、使用模拟器(没有平板、手机等Android测试设备时)



能和APICloud兼容的模拟器，网上说有海马、夜神等，都需要先找到APICloud的adb.exe位置，然后在cmd下运行【adb connect to 服务器地址】命令； 但实际上，比如安装海马玩v0.10.5后，不用任何设置操作，直接在APICloud中USB真机同步即可。【但模拟器分辨率虽能调但总是没法显示完全，遂弃；后听说夜神模拟器似乎可以，未尝试】



三、Android设备(APICloud Studio)联调服务器(vs2015、IIS)曾遇到问题



❶  在调试前可先在Android机器中使用ping工具，去ping服务器的ip，这是能联调成功的前提条件。分享者win10的防火墙似乎每次重启后都会阻碍ping通，曾被坑过。



❷ 想要在Chrome中调试Android设备中的网页，可在FQ的前提下(想省事的可搜索下载XX-Net)，在Chrome中打开chrome://inspect/#devices，就可显示出当前连接的Android机器的app中相关的页面Url，点击“inspect”即可在Chrome中查看和调试。



2.png





❸ 在index页面中，登录成功后，通过读取参数来设置需访问的服务器相关业务的页面Url。这里使用了官方的fs模块(用于存储记录一些参数的文件，此模块相关方法可参考官方文档)，主要的function如下：



3.png



四、官方文档的结构说明



不知道有没有人像分享者一样的小白，有时看别人的代码却发现在官网文档中找不到有疑问的相关函数定义…… 后来再仔细看发现，首先需要先弄清当前方法是针对什么的(比如是针对 API对象【格式类似api.xxx】、相关设备、模块方法【常用的模块应该就是db、zip及fs】、APICloud前端框架【格式类似 $api.xxx】)，然后才容易从官网文档目录的入口进入相应页面，再进行搜索。(分享者自己是把这些分类后收集到自己文档里了，借助如印象笔记等工具，这样会更加方便检索)



以上是APICloud版主左右方圆的分享，觉得可以就顺手点个赞，给分享者一个鼓励！如果你也有自己的学习心得，欢迎分享！



APICloud新手教学视频可到 APICloud 官网进行免费学习。