标题 | 安徽广播电视大学微信平台设计与实现 |
范文 | 童敏 张文盛 张黎娜 摘要: 针对现有业务系统不能适配移动设备、入口多和信息孤岛等问题,设计和实现安徽广播电视大学微信平台。本平台依托安徽广播电视大学微信公众号,使用WeUI、jQuery、PHP、MVC等技术,设计和实现微信网站,主要包括微主页、微平台和微服务模块;升级现有的多个业务系统,使之支持移动端和自适应访问,并集成到微信平台中;利用微信身份认证服务实现多个业务系统的单点登录功能。应用表明,安徽广播电视大学微信平台能够满足一站式业务办理和信息查询需求,显著提高学校信息化服务和应用水平。 关键词:微信;手机网站;单点登录;PHP 中图分类号:TP391 文献标识码:A 文章编号:1009-3044(2018)14-0073-03 1 引言 安徽广播电视大学是一所以现代信息技术为支撑,专门从事成人远程开放教育的高等学校。学校秉承学历教育和非学历教育并重的发展战略,已经建成几十个学习平台和业务系统。但这些平台和系统都是单独开发,彼此之间不能互通,成为信息孤岛。此外,这些平台和系统主要面向PC端开发,没有适配移动端,随着移动应用全面普及,已经不能满足师生多样的工作学习需要。目前学校正在向开放大学转型,提出建设“一流信息化,一流开放大学”的双一流建设目标。一流信息化包括建设统一的开放大学学习和管理平台,时间紧任务重。我们决定开展前期研究工作,在對现状进行全面分析的基础上,建设安徽广播电视大学微信平台。本研究以移动应用作为切入点,依托安徽广播电视大学微信公众号,采用WeUI、jQuery、PHP和MVC等技术,开发微信平台,将其打造成安徽电大重要的互联网宣传窗口,为全省电大师生提供多终端、无缝和一站式的信息服务。 2 安徽广播电视大学微信平台设计 2.1 相关技术 安徽广播电视大学微信平台设计使用的相关技术包括微信公众号自定义菜单、基于OpenID的单点登录和终端自适应。 在关注微信公众号后,微信APP在下方显示自定义菜单。用户点击菜单项,可进入预先设置好的链接地址,比如手机网站。因此微信公众号是理想的统一入口。 在关注微信公众号时,腾讯会为用户分配标识信息,且在该公共号下唯一,即OpenID。业务系统使用腾讯提供的接口获取OpenID,将其和本地账户绑定,即可实现单点登录。 业务系统可实现PC端和手机端两套前台界面,公用后台业务逻辑代码。用户访问业务系统时,系统通过某些特征(例如浏览器发送的UserAgent信息)判断终端是手机还是普通 PC,并返回对应界面,从而实现终端设备自适应。 2.2 系统结构 本微信平台包括微主页、微平台和微服务三个模块。微主页是学校主页的手机版,方便师生在手机端查询学校概况、学校新闻、通知公告、分校之窗等内容。微平台是学校几个大型学习平台入口的索引页面,包括国家开放大学学习网、安徽省高等学历继续教育在线平台、中小学教师教育网、安徽省专技技术人员继续教育在线平台、安徽全民终生学习网等,方便学生进入各个平台学习。微服务是师生日常工作学习中要用到系统的索引页面,包括微报名、微交费、微测试、微活动、微点餐等功能。系统结构如图1所示。 为了降低成本和提高效率,安徽电大微信平台开发遵循最小化原则,即如果对现有业务系统升级即可满足需求,就不需要重构。对业务现状和系统需求进行分析,结果如表1所示。 主页系统是学校门户,地位重要,必须在微信平台展示。微信平台采用PHP技术,主页系统采用Node.js+.net技术,两者技术架构差别很大。主页系统是由公司开发的,在其上实现微主页功能有难度,决定在微信平台中实现。微主页模块直接访问主页数据库,和主页系统共享数据,实现无缝对接。 网上报名系统实现求学者的预约报名、正式报名、网上审核、网上交费和在线入学测试等功能,为学员提供网上一站式的报名服务。该系统具有不受时间限制、全天候、全流程的特点,为求学者提供便利,也促进安徽电大招生工作的开展。 学生交费系统实现学生在网上完成交学分费、交教材费、历史查询等功能,能够提高效率,节省时间,降低成本。 学生活动平台是为丰富全省电大学生校园文化生活,进一步增强学生对校园的归属感,提高学校知名度,推动招生报名等工作而开发的系统。目前已经在平台上成功开展过歌手大赛和书画摄影大赛等活动,收到师生的一致好评。 入学测试系统完成新生的入学测试任务。开放教育要求对新生进行入学测试,对其知识技能大致了解,为将来的个性化学习支持服务提供参考。入学测试系统可单独使用,也能够和网上报名系统对接。 综上,微报名、微交费、微活动和微测试,都在原系统的基础上升级开发完成。微点餐是全新功能,放在微信平台中实现。 微信平台和主页等系统在物理上是平行关系,互相对等,相对独立。但在逻辑上是上下层关系,有链接,也有数据库直接访问,以及数据交换(OpenID)。为了便于区分,定义图1中分割线以上模块组成的系统称为小微信平台,定义图1中所有模块包含在内的系统称为大微信平台,默认情况下指小微信平台。 2.3 技术架构 微信平台基于B/S模式开发,采用Windows2008+IIS7(fastCGI)+PHP7(OPcache)+MYSQL5.6运行环境。IIS7内置FastCGI模块,可以运行FastCGI模式的脚本引擎。在fastCGI模式下,PHP最高效和最安全,能够支持大并发量和高负载。PHP7内置的OPcache模块,能够缓存中间代码,节省编译时间,优化执行。MYSQL5.6属于轻量型数据库产品,支持绝大多数SQL特性,性能完全满足需求。PDO(Php Data Object)接口是PHP为数据库操作开发的抽象接口,与具体数据库无关,具体数据库需要提供驱动,方便解耦。微信平台通过PDO_MYSQL驱动连接MYSQL数据库,通过PDO_SQLSRV驱动连接MSSQL数据库。微信平台技术架构如图2所示。 微信平台包括客户端前台和服务器后台,客户端前台是用户可见部分,主要由HTML,CSS和JS组成,服务器后台只对程序员可见,主要是PHP代码和数据库。客户端前台又包括普通用户前台和管理员前台,普通用户前台是在手机上上看到的页面集合,管理员前台是管理员管理系统的页面集合。微信平台采用多种成熟的框架进行开发来提高开发效率。普通用户前台采用WeUI,WeUI+和jQuery WeUI等前端库。管理员前台采用DWZ框架。服务器后台基于MVC模型,采用国人研制的禅道框架(Zentao Framework)开发。 2.4 界面设计 移动互联网时代,应用层出不穷,如果界面不能符合业界规范和吸引人,很容易被抛弃,因此界面设计对于移动端非常重要。安徽电大微信平台采用许多成熟和优秀的前端框架进行界面设计。 WeUI是一套同微信原生视觉体验一致的基础样式库,由微信官方设计团队为微信 Web 开发量身设计,可以令用户的使用感知更加统一。 WeUI+是Zepto1.2、weui.js、WeUI0.44/1.1以及上百个组件开发而成,兼容IOS和Android平台,主要用于微信/手机网站开发,是WeUI的增强版,样例丰富。 WeUI目前只包含 CSS 代码,官方短期内不会出JS版本,并且官方组件太少根本不够用。jQuery WeUI也是WeUI的增强版,除此之外还包含大量拓展组件,使用方便。 DWZ富客户端框架(jQuery RIA framework),是中国人自己开发的基于jQuery实现的Ajax RIA开源框架。 DWZ富客户端框架设计目标是简单实用、扩展方便、快速开发、RIA思路、轻量级。DWZ适合开发管理员前台。 除了大量使用前端库外,还请专业人事设计背景图片和图标,美化界面。 手机界面设计需要在形式和内容上寻找平衡。PC显示器可以呈现大量内容,相比之下手机屏幕限制很多。如何将PC端显示的页面移植到手机端,是值得研究的。一般的做法是在符合规范的前提下,将内容压缩和重排,必要时甚至要拆分成多个页面。具体到每个页面如何设计则要具体分析,不能一刀切。 2.5 模块设计 主页新闻存放在主页数据库的gCms_posts表中。微主页主要显示新闻,直接访问该表并显示即可。微主页主要有两种页面类型:新闻列表和新闻详情。新闻列表要支持分页,且能滑动加载。jQuery WeUI支持滑动加载功能,加入相关代码即可。新闻列表中每条新闻后面要显示新闻缩略图片,gCms_posts表中有新闻图片信息,是一个URL接口,微主页直接调用即可。但显示的图片是原始尺寸,适合PC端,手机加载会很慢,且耗流量。经过研究,发现该接口可以接收尺寸参数,并将缩放后的图片返回。传递合适的图片尺寸参数给接口,将其封装成函数,直接调用。用户查看新闻时,需要增加浏览次数,修改gCms_posts表的ViewCount字段。主页系统非常重要,需要严格保护。微主页模块要访问主页数据库,必须执行权限分配最小化原则,只授予表级读权限甚至列级权限,即gCms_posts表可select,gCms_posts表的ViewCount字段可update,其他表无权访问。 其他模块设计主要包括界面和业务逻辑,业务逻辑对应系统已经实现,因此重点是界面设计,界面设计前面已经涉及,不再赘述。微信平台和其他系统相对独立,其他模块的数据安全由各個系统自己控制和保护。 2.6 单点登录 OpenID是理想的单点登录凭据,但一个公众号只能配置一个授权域名,在授权域名下的网站才能获取OpenID。大微信平台包含多个系统,每个系统都有自己的域名,例如小微信平台域名是m.ahtvu.ah.cn,报名系统域名是bm.ahtvu.ah.cn。必须解决OpenID在多个系统之间共享问题,方法是采用中间服务,由中间服务代理其他系统获取OpenID,工作原理如图3所示。 中间服务由小微信平台(m.ahvu.ah.cn)完成。假设用户用微信APP访问报名系统(bm.ahtvu.ah.cn),报名系统判断是微信访问(UserAgent包含MicroMessenger字符串),开始上述请求过程,获取OpenID。然后报名系统在本地用户表里查询OpenID是否有绑定,如果是,则执行自动登录,否则弹出绑定界面,提醒用户完成绑定操作。 3 安徽广播电视大学微信平台实现 3.1 关键代码 腾讯提供接口和样例代码获取OpenID等信息,将其封装成getWxInfo函数,相关代码入下: public function getWxInfo() { if (!$this->session->wx) {//没有token if (!$this->session->wxcode) {//没有code //重新获取code return false; } else {//获取token $token = $this->weixin->getAccessToken($this->session->wxcode); session_unset(); if (!$token) die('getAccessToken failed'); $userinfo = $this->weixin->getUserInfo($token->access_token, $token->openid); if (!$userinfo) die('getUserInfo failed'); $wx = new stdClass(); $wx->token = $token; $wx->userinfo = $userinfo; $wx->stamp = time() - 60; $this->session->set('wx', $wx); } } else {//有token $wx = $this->session->wx; if ($this->session->wx->stamp + $this->session->wx->token->expires_in < time()) { //token过期,刷新 $token = $this->weixin->refreshToken($wx->token->refresh_token); if (!$token) {session_unset(); return false; } $userinfo = $this->weixin->getUserInfo($token->access_token, $token->openid); if (!$userinfo) die('getUserInfo failed'); $wx = new stdClass(); $wx->token = $token; $wx->userinfo = $userinfo; $wx->stamp = time() - 60; $this->session->set('wx', $wx); } } return true; } 终端自适应代码如下: //判断是否手机访问 public function isMobile() { $s1 = $this->server->http_accept; $s2 = $this->server->http_user_agent; if (stripos($s1, "wap") !== false || stripos($s2, "android") !== false || stripos($s2, "iphone") !== false) {//请求包含特征字符,表明是手机 return true; } return false; } public function srok() { //省略其他代碼 if (!$this->student->isMobile()) { $this->display();//不是手机访问,则渲染并显示PC界面 } else { $this->display('student', 'srok.wx');//否则渲染并显示手机界面 } } 3.2 系统截图 微主页、微平台、微交费和微点餐如图4所示。 管理员前台如图5所示。 4 结束语 针对安徽广播电视大学微信平台的建设问题,从设计和实现两个方面进行详细研究,确保平台开发成功并投入运行。本研究采用折衷路线,力求成本最小,效果最快,基本达到预期目标。现在高校都存在信息系统众多、信息孤岛现象短期难以消除,但又希望在移动互联网方面有所突破和完善的矛盾。本文对此做出了有益的探索,为相似背景和需求的单位提供了参考。微信平台建设是一个尝试,建成统一的学习管理平台,完成流程再造、统一数据和系统重构,才是开放大学建设的内涵,还需要做进一步研究。 参考文献: [1] 白浩,郝晶晶.微信公众平台在高校教育领域中的应用研究[J].中国教育信息化,2013(4):78-81. [2] 闫小坤,周涛.微信公众平台应用开发从入门到精通[M].北京:清华大学出版社,2015. [3] Brett McLaughlln. PHP&MySQL;实战手册[M].2版. 北京:中国电力出版社,2014. [4] 闫晓甜,李玉斌.微信平台支持下的高校微课程设计与应用研究[J].中国远程教育,2015(7). |
随便看 |
|
科学优质学术资源、百科知识分享平台,免费提供知识科普、生活经验分享、中外学术论文、各类范文、学术文献、教学资料、学术期刊、会议、报纸、杂志、工具书等各类资源检索、在线阅读和软件app下载服务。