毕业设计（论文）-快速创建App平台的研发与设计.doc

i 目录目录 1.1.引言引言1 1 1.1 平台的背景 .1 2 2 相关技术介绍相关技术介绍1 1 2.1 mvc 模型.1 2.2 phalcon框架的 php 技术 1 2.3 cordova移动开发客户端框架 2 3 3 平台技术方案平台技术方案2 2 4 4 快速创建快速创建 appapp 平台平台3 3 4.1 平台描述 3 4.2 账户权限模块 3 4.3 app模块 .4 4.4 登录与注册模块 4 4.5 账户模块 4 4.6 管理模块 5 4.7 订阅模块模块 5 4.8 问题反馈模块 5 5 5 快速创建快速创建 appapp 平台数据库设计平台数据库设计 5 5 5.1 快速创建 app平台数据库表设计.5 5.2 快速创建 app平台数据库 e-r 图 .7 5.3 快速创建 app平台 ui 图 8 6.6.平台功能模块的实现平台功能模块的实现1313 6.1 数据库访问的实现 .13 6.2 登录模块的实现 .13 6.2.1 账户登录13 6.2.2 管理员登录15 6.3 app更新后台模块 15 6.3.1 新增第三方 qq 登录模块.17 6.3.2 实现填写 app 类型模块17 6.3.4 实现选择 app 功能页模块18 6.3.5 实现选择 app 样式和颜色模块18 6.3.6 实现填写 app 基本信息模块18 6.3.7 实现 app 预览模块19 ii 6.3.8 实现 app 管理模块19 7 7 移动应用开发服务关键技术移动应用开发服务关键技术2121 8 8 总结总结2121 快速创建快速创建 appapp 平台的研发与设计平台的研发与设计 岭南师范学院数学与计算科学学院，湛江 524048 摘摘 要：要：本文研究快速创建 app 平台的主要目的是能够帮助完全不懂语言编程的人，能在 数分钟的时间内创建一个属于自己的 app.平台设计分为前台 app 创建模块、后台数据库设计与 管理模块、中间网页服务器三个模块,使用了 angularjs、phalcon、cordova 等框架.采用 js，php ，mongodb 等技术结合，实现 app 开发、账户管理、内容管理系统、分析数据等模块的 具体研发过程. 关键词关键词：app；cordova；混合 app；webapp；客户定制 app researchresearch andand designdesign ofof thethe rapidrapid creationcreation ofof appapp platformplatform author:liu siyuanteacher: gui xiancai lingnan normal university of mathematics and computer science, zhanjiang 524048 abstract: this article is an application platform that is designed to help people that dont understand programming language, to be able to construct and create their own application within a few minutes of time. this articles content will be based upon the three modules, which is the front- desk(reception) app builder module, the background database design and management module, and lastly the web-server module. the platform will be based on angularjs, phalcon, cordova framework. use technology such as php,mongodb,js, implementation web app development, account management, cms content management, analysis module. keywords: app ;cordova;hybrid app; webapp; customization 1 1.1.引言引言 1.11.1 平台的背景平台的背景 移动互联网市场的发展态势，巨大的商机令人垂涎，各领域企业纷纷开发了专 属的 app，但很多非 it 软件类企业开发经营自己的 app，却面临软件开发、商业模 式和市场推广三座大山.快速创建 app 平台是一款非编程 app 制作的平台服务.快速 创建 app 平台可以帮助企业、个人免费 diy 制作属于自己的手机 app 应用.无需具备 编程能力、不用自己架设服务器，只需要花几分钟的时间，就可以制作运营自己的 app. 对于开发者来说，html5 技术跨平台，适配多终端.传统移动终端上的 native app，开发者的研发工作必须针对不同的操作系统进行，成本相对较高.native app 对于账户还存在着管理成本、存储成本以及性能消耗成本.html/javascript/css 语 言所开发的应用只要一次开发就能进入所有浏览器进行分发.即使是走传统的 app store 应用商店渠道，只需要再将底层用 html5 开发的应用“封装”为 app，从时间 和资金成本上讲远小于跨系统移植. 2 2 相关技术介绍相关技术介绍 2.12.1 mvcmvc 模型模型 mvc 全名是 model view controller，是模型(model)视图(view)控制器 (controller)的缩写，一种软件设计典范，用一种业务逻辑、数据、界面显示分离 的方法组织代码，将业务逻辑聚集到一个部件里面，在改进和个性化定制界面及账 户交互的同时，不需要重新编写业务逻辑.mvc 被独特的发展起来用于映射传统的输 入、处理和输出功能在一个逻辑的图形化账户界面的结构中. 2.22.2 phalconphalcon 框架的框架的 phpphp 技术技术 phalcon 是一套实现 mvc 架构的高性能 php 应用程序框架.初始版本发布于 2012 年 11 月，开放源代码并基于 bsd 授权条款.与其他大部分的 php 框架不同，phalcon 使用 c 语言编写，因此 phalcon 的执行速度高过其他 php 框架，并且消耗更少的资 源，根据官方的测试，phalcon 是目前世界上速度最快的 php 框架之一.是一个开源 的，全堆栈的，用 c 语言写成的 php5 框架，专为高性能设计.你不需要学习和使用 2 c 语言的功能，因为这是一个 php 框架，只不过用 c 写成而已.同时 phalcon 是松耦 合的，您可以根据需要使用其他组件1. 2.32.3 cordovacordova 移动开发移动开发客户端框架客户端框架 apache cordova 是一套设备 api，允许移动应用的开发者使用 javascript 来访 问本地设备的功能，比如摄像头、加速计.它可以与 ui 框架（如 jquery mobile 或 dojo mobile 或 sencha touch）等相结合使用，这些 ui 框架可以使用 html、css 和 javascript 开发智能手机应用. 在使用 cordova api 时，应用程序的构建可以无需本地代码（如 java 或对象 c 等） ，使用的是 web 技术. 由于这些 javascript. api 在多个设备平台上是一致的，而且是基于 web 标准 创建的，因此应用程序的移植很方便，基本不做什么改变. 使用 cordova 的应用使用平台 sdk 打包成应用程序，可以从每种设备的应用程 序商店下载安装. cordova 提供了一套统一的 javascript 库供调用，它支持 ios、android、blackberry、windows phone、palm webos、bada 和 symbian2. 3 3 平台技术方案平台技术方案 由于 phalcon 是基于 c 的 mvc 模式的 web 开发框架，利用这一框架可以建立动 态的、高性能的、安全的、跨平台的动态网站.为了使系统将来的维护、升级等工作 方便、简单，我们采用 mvc 开发模式，以 php 为开发平台，在本系统中我们细分为 四层即网络服务层，视图层、数据层、控制逻辑层，使用 angularjs 来实现是图层 层 view 的功能；用 nodejs 来实现接口的定义3；用于控制逻辑层来具体实现的业 务.具体实现就是 angularjs 提交信息到 controller 进行判断，然后调用 controller 中的的具体 action 方法实现具体业务，这当中可能涉及到对数据库的 操作，即调用数据层里面的具体方法.最后返回一个信息给 controller ，由 controller 把信息封装到一个 json 格式的数据中，再由 controller 返回数据到 网络服务层，来实现各种需求.使用 mvc 模式，我们在修改页面的时候，因为里面不 包含有逻辑代码，所以不会影响到系统的逻辑工作，只需要 ui 就能完成工作；在逻 辑层部分，只需要专注于代码的开发，而不需要关心数据库数据的实现，因为数据 3 库数据调用只需要通过接口实现即可，数据库开发人员只需要完成数据开发工作.网 页逻辑需要一个平台维护系统：cms，所以依然需要在静态模板页实现逻辑代码，即 用 phalcon 进行渲染和逻辑编码.因此，可以我们可以通过下列路线来进行开发： （1）用 uxpin 来实现静态代码的设计和 angularjs 逻辑代码的实现4. （2）用 php 来实现动态代码的设计，如进行的行为和动作. （3）用 nodejs 调用模型和逻辑的 api 对接，完成业务操作后，把得到的结果 存到 json 中，然后把封装结果的 json 作为返回的请求. （4）用 nodejs 作为数据库的调用接口，php 代码可以通过该 nodejs 通过调用 api 来实现对数据库的调用5. （5）对数据库的设计，首先设计数据表，然后用 mongodb 建立数据表. 4 4 快速创建快速创建 appapp 平台平台 4.1 平台描述平台描述 移动应用开发平台是专门用于实现账户自我 diy 自己需要的 app,进行商业或者 个人兴趣的平台. 移动应用开发平台通常以下的 7 个模块,不同模块分别实现不同的功能. (1)账户模块,账户模块主要实现账户功能，其中对账户资料的收集最为重要. (2)app 模块,app 模块是最核心的模块，其中实现对 app 的生成，app 上架到 appstore，app 资料的管理. (3)问题反馈模块，是对于平台运作后期最为重要的一部分，它能反馈许许多多 的问题，然后我们分析问题对平台进行修改和完善. (4)账户管理模块，它是管理账户的资料，与账户模块紧紧相连. (5)代理模块，是平台后期很重要的营销模式. (6)订阅模块，他实现了 app 平台服务于账户之间的联系，实现账户在平台购买 app 的关键. (7)登陆注册模块，他实现了账户与平台的关联，实现 app 与平台的沟通. . 4.4.2 2 账户权限模块账户权限模块 （1）账户管理：账户进入到账户管理页面后，可以实现对自己资料的增删改查， 并且根据账户权限可以查询到自己账户的资料，进入账户管理页面. （2）账户权限管理：由于平台管理有多种多样的功能，并非所有客户都愿意 4 将 root 所有权赋予给所有的人，所以这里 root 账户可以实现 rbac（基于角色控制） 进而实现不同的账户拥有不同的权限用于管理自己的 app 或者平台. 4.4.3 3 appapp 模块模块 （1）app builder（app 创建模块）：当客户进入到创建 app 时，可以选择不 同模板和不同的内容来填充客户的 app，这里就是 app builder，它能实现你 app 的 diy，样式的选择，模板的选择，功能的选择，内容的选择，是最重要的用户体 验部分. （2）app manage（app 管理）：当客户创建成功 app 后，他会进入到 app 管理 页面，你能在 app 管理页面对你的 app 进行增删改查，不同的样式，不同的内容， 不同的功能都能在这里修改，同时可以生成你的 app 下载体验. （3）app tostore(app 上架): 在这里你能选择你的 app 生成的平台类型，安 卓，ios，win8 进行上架，可以选择上架到百度，谷歌. 4.44.4 登录登录与注册模块与注册模块 登录与注册模块主要分为账户登录注册与管理登录注册，这里有一套 rbac（基 于角色控制）进行权限的分配.根据你账户角色的不同拥有不同的增删改查权利.如 果你是一名普通用户，你仅仅可以对你账户资料的进行增删改查.同时你是平台的管 理员，你可以查看到不同账户的的资料并且进行账户的增删改查.注册模块主要实现 账户的注册功能. 4.54.5 账户账户模块模块 （1）添加账户：使用平台的前提首先你需要有一个账户，此时你需要注册一个 账户. （2）修改账户：你能在此进行你账户信息的修改，比如你公司地址换了，你需 要更新你的账户信息以供后续我们提供服务的连通性. （3）删除账户：如果账户进行了非法勾当，我们平台可以进行删除账户. （4）查询账户：账户是基于平台，所以平台可以知道账户的资料和行为. 4.64.6 管理模块管理模块 代理模块主要应用于平台服务的销售，销售的重要性不容置疑，一个平台的收 入依赖于销售.因此平台提供不同的营销方式，可以单体购买，团体购买，代理购买， 使用代理模式. 5 4.74.7 订阅模块模块订阅模块模块 （1）添加订阅：添加一个套餐的订阅. （2）修改订阅：账户购买的同时可以修改自己订阅，进而选择更喜欢的套餐或 者产品. （3）删除订阅：账户不需要订阅的时候可以进行删除订阅. （4）查询订阅：平台提供订阅的历史，方便客户统计订阅到期时间，和续费时 间. 4.84.8 问题反馈模块问题反馈模块 （1）添加反馈：添加反馈，叙述自己 app 出现的问题，管理人员可以根据反馈 的内容进行维护. （2）修改反馈：反馈的的问题可能是账户本身出现操作问题，如果账户自身发 现 app 问题可以进行修改反馈，使得管理人员和平台知道问题的来源. （3）删除反馈：当反馈已经解决可以进行删除反馈. （4）查询反馈：可以查看所反馈的内容. 5 5 快速创建快速创建 appapp 平台数据库设计平台数据库设计 5.15.1 快速创建快速创建 appapp 平台数据库表设计平台数据库表设计 （1）账户管理表 快速创建 app 平台使用的是 mongodb 数据库技术，账户是本系统的主要账户.因 此，数据系统中需要存储账户的基本6. 表表 1.1.账户管理表账户管理表 字段字段缩写字段类型字段描述 account idaccountidint 主键 nameaccnamechar(100) 公司/名称 nationaccnationchar(128) 公司国家 province/stateaccstatechar(128) 公司省份 cityacccitychar(128) 公司城市 addressaccaddrchar(256) 公司地址 telephone numberacctelchar(12) 公司的电话号码 emailaccemailchar(1 00) 公司电子邮件地址 faxaccfaxchar(12) 公司的传真号码 descriptionaccdescchar(1024) 公司的描述 6 user quotaaccuserquotaint 账户数量 表表 2.2.账户信息管理表账户信息管理表 字段字段缩写字段类型字段描述 user ididintegerprimary key usernamenamechar(100) 名称 passwordpwdchar(100) 密码 given namegivnamechar(100) 名字 family namefamnamechar(100) 姓氏 gendergenderchar(100) 性别 ageageint 年龄 id number / nricnricchar100) 身份证 cellphone numbertelchar(100) 手机号码 emailemailchar(100) 电子邮件 nationnationchar(100) 国家 province / statestatechar(100) 省份 citycitychar(100) 城市 addressaddrchar(100) 地址县 registration dateregdatedatetime 注册时间 last login timelastlogindatetime 上一次登录的时间 role idroleidint 当前对应的权限 （3）app 信息表中包括 appid（appid） 、app 名字（appname） 、等内容. 表表 3.app3.app 表表 user ididinteger 主键 app ididinteger 主键 app namenamevarchar(100) app 的名称 account idaccountidinteger 外键 apptype package idtypeidinteger 外键 creation datecdatadatetime app 的创建时间 7 creator ididinteger 创建 app 的账户 ios versioniosboolios android versionandroidboolandroid configuration pathconfigpathvarchar (300) 配置文件路径 total pagespageinteger app 页数 app statusstatusbool app 的状态 5.25.2 快速创建快速创建 appapp 平台数据库平台数据库 e-re-r 图图 这里拥有 3 个表，账户表，账户表和 app 表.一个账户可以开启多个账户，然后 每个账户可以创建多个 app，所以就有了以下的表关系. 图图 1.1.数据库数据库 erer 图图 5.35.3 快速创建快速创建 appapp 平台平台 uiui 体验图体验图 下面的图片是快速创建 app 平台前台 ui 体验图，图片介绍了如果进行客户定制 8 形式的选择 app 的各种部件，几分钟的选择后就可以生成一个可供各种平台安装的 app. 图图 2.2.平台介绍图平台介绍图 9 图图 3.3.账户登录图账户登录图 图图 4.4.引导创建图引导创建图 10 图图 5.5.选择选择 appapp 类型图类型图 11 图图 6.6.选择选择 appapp 功能页面图功能页面图 图图 7.7.选择选择 appapp 主题主题 12 图图 8.8.选择选择 appapp 样式样式 图图 9.9.填写填写 appapp 主要信息主要信息 13 图图 10.10.预览图片预览图片 图图 11.app11.app 管理页面管理页面 14 6.6.平台功能模块的实现平台功能模块的实现 6.16.1 数据库访问的实现数据库访问的实现 数据库连接是本平台最为重要的实现部分，因为系统中的全部模块的实现都依 赖于数据库操作的实现，包括对数据中的数据的查询、添加、修改、删除等基本操 作.比如 app 模块中，账户对 app 信息的查询、修改、添加等等. 6.26.2 登录模块的实现登录模块的实现 注册完成后，后台数据库系统中就已经存储了他们的信息.这时，当用户打开快 速创建 app 平台的首页时，就可以通过登录模块登录到快速创建 app 平台进行 app 的创建了.另一方面，管理员如果要对系统进行维护，包括对账户信息的查看、添加、 修改，对不同模型的查看、添加、修改等等工作，也首先需要登录系统.登录模块部 分包括管理员登录模块和账户登录两个部分.管理登录模块实现了对管理员的权限监 控功能，并通过检测赋予管理员不同的权限来实现对平台的管理.账户登录模块主要 是对账户是否合法进行检测，包括两个方面内容：一是账户身份合法性检测，该部 分是通过验证账户输入的 id 是否正确来检查进入平台的合法性；二是检查进入平台 后操作的合法性，该部分是通过验证账户是否多重登录来检测操作的合法性.通过上 述两项检查后，系统才为账户分配资源，否则平台将自动退出，账户如果输入有误 则提示账户重新登录.下面对账户登录部分的功能实现介绍. .1 账户登录账户登录 从登录页面中输入账户的 id 及密码，平台便从数据库中查找是否有该账户存在， 如果存在该账户,再判断输入的 id 和密码是否正确. (从数据库中查找比对)代码： /账户登录，phalcon 框架 public function dengluaction() $arr = array(0 = name,1 = pwd,2 = appid); $ws = array(0 = token); $data = $this-base2($this, $arr, $ws); if($data) $name = $dataname; $appid = $dataappid; $pwd = $datapwd; if(strpos($name, ) $logintype = email; 15 $rs = appuseremail; else if(strlen($name)=11 $rs = appusertel; else $logintype = loginname; $rs = loginname; $user=appuser:findfirst(array(array($rs=$name,appid=$appid); if($user) if($user-appuserpwd != $pwd) c(errorfiled, pwd is error); echoinfo(611); return; $flag = $this-checkuserstatus($user); if(!$flag) return; $user-islogin = true; $lasttime = $user-lastlogintime-sec; $user-lastlogintime = getmongodate(); $user-appusertoken = $datatoken;/保存 ws 端的 token if(!$user-save() throw new exception(账户数据不能更新, 1000); $identity = array(); $identityuserid = $user-appuserid; $identitytokenid = $user-appusertoken; $identitylasttime = $lasttime; c(data, $identity); echoinfo(200, “success“); return; else echoinfo(609, user is not find); return; .2 管理员登录管理员登录 管理员身份的验证过程与账户登录时对身份的验证过程几乎相同.只是在数据库 16 中所查询的集合（表格）或者字段不一致. 6.6.3 3 appapp 更新后台模块更新后台模块 app 后台的更新代码，首先判断版本是否需要更新，如果版本不一致则进行更 新，主要代码如下： public function getrecordbyid($obj) return $this-findbyid($obj-appid); /更新一条文档记录依靠 appid public function updaterecordbyid($obj) if(!($obj=null) $record=$this-findbyid($obj-appid); /把 php 对象转为数组 $array=get_object_vars($obj); /获取数组的键值名,返回一个键值名数组 foreach (array_keys($array) as $keyname) if ($keyname=“appid“) $record-_id=$obj-$keyname; else $record-$keyname=$obj-$keyname; $record-save(); else echo “删除记录失败“; /删除一条文档记录依靠 appid public function deleterecordbyid($obj) if(!($obj=null) $this-findbyid($obj-appid); $this-delete(); else echo “删除记录失败“; 17 /创建一条新的文档记录依靠 accoutid public function createrecordbyid($obj) if(!($obj=null) $this-accountid=$obj-accountid; $this-save(); else echo “创建 appid 失败“; /存储选择的功能 public function savefeature($obj) if(!($obj=null) $this-appfeaturemap=$obj-appfeaturemap; $this-appfeaturedir=$obj-appfeaturedir; $this-appfeaturecal=$obj-appfeaturecal; $this-appfeaturenote=$obj-appfeaturenote; $this-save(); else echo “储存功能错误“; /app 更新函数 public function isupdate($obj) /根据 appid 获取一条需要更新的记录 $record=$this-getrecordbyid($obj); /判断 version if(!($record-appversion = $obj-appversion) echo “version 不一样,you shold rebuld the app,return a appstore url“; else /相同,检测 appupdatenum 是否一样 if (!($record-appupdatenum = $obj-appversion) tozip(“e:/xampp/htdocs/www“,“e:/xampp/htdocs/www.zip“); echo “打包成功,“; /updatenum 相同,不需要更新 18 else echo “不需要更新“; .1 新增第三方新增第三方 qqqq 登录模块登录模块 该子模块实现登录功能的第三方登录.后台实现一个接口.post 接受参数进行判 断是否第三方 qq 登录 /qq 登录的实现代码 public function qqdengluaction() $arr = array(0 = openid,1 = appid); $data = $this-base($this, $arr); if($data) $user = qquser:getuser($data); if(is_object($user) $flag = $this-checkuserstatus($user); if(!$flag) return; $identity = array(); $identityuserid = $user-appuserid; $identitytokenid = getmd5($user-appuserid.“3an%xing*“.$user- lastlogintime-sec); c(data, $identity); echoinfo(200, “success“); else echoinfo(614, “user is not exist“); .2 2 实现实现填写填写 appapp 类型模块类型模块 该子模块实现填写 app 类型模块. public function indexaction() $this-loadpartials(); if($this-getrequest()-isxmlhttprequest() $html = array(html = $this-getlayout()- getpartial(content_editor)-tohtml(); $this-getlayout()-sethtml(zend_json:encode($html); 19 .4 实现选择实现选择 appapp 功能页模块功能页模块 该子模块实现选择 app 功能页面模块. public function editaction() if($type = $this-getrequest()-getparam(type) $this-getlayout()-setbaserender(content, sprintf(application/customization/page/edit/%s.phtml, $type), admin_view_default); $html = array(html = $this-getlayout()-render(); $this-_sendhtml($html); .5 实现选择实现选择 appapp 样式和颜色模块样式和颜色模块 该子模块实现选择 app 样式和颜色页面模块. public function colorsaction() $this-loadpartials(null, false); $html = array(html = $this-getlayout()-render(); $this-getlayout()-sethtml(zend_json:encode($html); .6 实现填写实现填写 appapp 基本信息模块基本信息模块 该子模块实现填写 app 基本信息模块. public function saveaction() if($data = $this-getrequest()-getpost() try if(!empty($data“name“) if(is_numeric(substr($data“name“, 0, 1) throw new exception(“ce champ ne peut pas commencer par un chiffre“); $this-getapplication()- setname($dataname)-save(); catch(exception $e) $html = array( message = $e-getmessage() ); $this-_sendhtml($html); 20 .7 实现实现 appapp 预览模块预览模块 该子模块实现 app 预览模块. public function modalaction() $layout = $this-getlayout(); $layout-setbaserender(modal, html/modal.phtml, core_view_default)-settitle($this-_(preview)-setsubtitle($this- _(preview and test your native apps directly on your mobile.); $layout-addpartial(modal_content, admin_view_default, application/previewer/modal.phtml); $html = array(modal_html = $layout-render(); $this-getresponse()-setbody(zend_json:encode($html)-sendresponse(); die; .8 实现实现 appapp 管理模块管理模块 该子模块实现 app 管理模块. public function listaction() $this-loadpartials(); public function editaction() if($app_id = $this-getrequest()-getparam(app_id) $application = new application_model_application(); $application-find($app_id); if(!$application-getid() $this-getsession()-adderror($this-_(this application does not exist); $this-_redirect(application/backoffice/list); else $this-loadpartials(); $this-getlayout()-getpartial(content)- setcurrentapplication($application); public function savepostaction() if($datas = $this-getrequest()-getpost() $application = new application_model_application(); 21 try if(!empty($datasapp_id) $application-find($datasapp_id); if(!$application-getid() throw new exception($this-_(an error occurred while saving the application. please try again later.); if(empty($datasbundle_id) throw new exception($this-_(the bundle id is required