基于微信小程序的校园资讯平台的页面设计与实现

2019-06-27 00:09廖伟国谢杰新胡婉玲卢晓惠
科技创新与应用 2019年9期
关键词:微信小程序设计

廖伟国 谢杰新 胡婉玲 卢晓惠

摘  要:本设计结合当下移动互联网的流行以及移动手机等智能终端与校园资讯的联系越来越紧密,以及微信平台具有的庞大用户和微信小程序作为校园资讯平台有着较大优势,决定采用B/S设计模式,PHP后台语言与基于微信小程序的前端平台开发技术相结合,利用putty和lamp搭建服务器,设计出基于微信小程序的校园资讯平台。

关键词:微信小程序;校园资讯平台;设计

中图分类号:TP311        文献标志码:A 文章编号:2095-2945(2019)09-0021-03

Abstract: This design combines the popularity of the current mobile Internet and mobile phones and other intelligent terminals and campus information more and more closely linked, as well as WeChat platform has a huge number of users and WeChat Mini Program as a campus information platform has great advantages. It is decided to adopt B/S design pattern, PHP background language and front-end platform development technology based on WeChat Mini Program, use putty and lamp to build server, and design Campus Information Platform based on WeChat Mini Program.

Keywords: WeChat Mini Program; Campus Information Platform; design

1 概述

互联网已经成为人们快速获取信息的渠道,而新闻资讯则是信息的重要内容之一。处在信息化高速发展的高等学院,其信息的传递对学校的发展尤其重要。校园资讯对提高学校的教学质量和学生的学习质量也起到了非常重要的作用。因此,学院十分重视校园资讯平台的发展。

现如今,随着智能手机进一步普及,手机网民越来越多。根据中国互联网信息中心(CNNIC)发布的《中国互联网络发展状况统计报告》显示,截至2017年8月,中国网民规模达到7.51亿,其中手机网民规模就已经达到7.24亿,占比达到96.3%,这意味着手机上网已经成为人们上网行为的主要部分。而且微信已成为人们手机必不可少的软件之一,说明微信平台有着庞大的用户基础。

目前关于校园资讯平台的开发,传统的网站编辑是通过一页一页地修改,然后上传到服务器,对于日益多变的大量的信息发展,显然已很难对付庞大的业务。所以利用动态网页和数据库相结合才是发展趋势。考虑到移动平台成为用户上网的主流平台,用户慢慢习惯了用手机APP客户端实现各种应用。微信小程序不需要下载即免安装就能使用,实现了应用“触手可及”的梦想,用户扫一扫即可使用,用完就走,且简单,轻便,占用内存小。因此,通过设计微信小程序的校园资讯平台,用户可以在这个平台上了解到自己校园的各方面包括官方,兼职,社团等信息,极大地丰富了师生了解校园动态的途径。

2 小程序MINA框架介绍

要开发一个微信小程序,就需要用到微信提供的开发框架。微信团队为小程序提供的框架名为MINA应用架构。MINA框架通过封装微信客户端提供的文件系统、网络通信、数据与安全等基础功能,提供一系列的组件和API。视图层描述语言主要用到WXML和WXSS。在主要页面视图层包括前端页面,开发者使用WXML来搭建基础的页面。WXML类似于HTML标签语言,通过大量使用view标签来实现层叠包围设计。WXSS类似CSS,使用WXSS文件来控制页面的展现样式,包括页面位置,图片大小,文字颜色等。逻辑层是MINA框架的核心,AppService应用邏辑层是MINA的服务中心,页面渲染所需的数据、页面交互处理逻辑都AppService中实现。MINA框架中的AppService使用JavaScript来编写交互逻辑、网络请求、数据处理。如图1所示。

(1)官方提供经过封装的组件和API,将一定程度上减少代码量,降低开发难度。

(2)在逻辑层上有事件系统,开发者可以更加专注于逻辑上的开发。

但同时也存在一些不足,组件和API的数量有限,很多优秀的第三方插件不能直接使用,有待以后官方不断进行更新完善。

3 软件设计与实现

3.1 软件整体功能设计

根据功能需求分析,该软件主功能为前台显示模块和后台管理模块。

(1)前台显示系统,一般用户可以登录,浏览不同的新闻;又可以对平台进行意见反馈。

(2)后台资讯管理系统,管理员可以对平台进行资讯管理,文件管理,用户反馈管理等。整体的功能结构图如图2。

3.2 软件流程分析

本平台分为前台和后台两个部分。前台部分不需要进行身份验证,任何人都可以通过微信浏览信息。后台系统的管理员首先输入自己的账号密码,输错就会重新开始,然后进行资讯管理,文件管理,反馈管理,输入相关操作后,数据库将会进行逻辑处理,查看是否有满足的数据,最后把数据反馈给管理员。流程如图3所示。

3.3 数据库设计

根据前面的功能结构设计得到的数据,可以设计出满足于用户需求的各种实体,实体-联系图是根据用户的要求建立的概念性的数据模型,用于辅助用户与管理员进行交流,如图4所示。

3.4 关键技术实现

3.4.1 小程序部分

(1)从新闻列表正确跳转到对应的详情页面。从新闻列表正确跳转到详情页面,并不需要一页一页地去设置,用id来表示新闻列表,从而让列表和详情页面正确对接,关键代码如下

(2)加载更多新闻的实现,如图5。

(3)网络环境判断的实现。为了让用户不在WiFi网络的环境下,避免因为流量不足而不断加载新闻,设置一个网络环境的反馈判断,当网络处于WiFi环境时,没提示。但网络不处于WiFi环境时即2g、3g、4g网络状态下时,就会提示不在WiFi网络下,会消耗流量,如图6所示。

3.4.2 后台管理的实现

管理员管理新闻则需要在服务器上安装weiphp,安装好weiphp在模型管理中新建cms插件,设计新闻包含字段标题,图片,内容,时间,作者等,如图7。

3.4.3 服务器的搭建方法

软件开发需要考虑经济性和实用性,腾讯云服务器简单高效,价格便宜,安全可靠,因此服务器选择租赁云服务器的方式,搭建工具选用putty和lamp相结合。本服务器的ip地址为119.29.176.117,利用putty连接服务器如图8所示。

4 结束语

在互联网的时代,传统的宣传方式已经渐渐淡化了大部分人的生活,手机网民的增长以及微信平台庞大的用户量说明了利用微信小程序搭建校园资讯平台将有很大的市场前景。

基于微信小程序的校园资讯平台,管理员可以通过后台轻松高效地管理新闻信息,对重要的信息进行发布,让师生第一时间了解校园动态,有利于校园数字化建设。

通过这次开发,我们学习了很多知识,基本掌握了小程序MINA架构从而理解Web前端语言,也掌握了后台语言PHP以及服务器的搭建的理论,同时又能把所学的理论应用到开发实践中,提高自己的实操能力。但由于时间和技术上的缺陷,该软件还有以下不足:

(1)小程序功能不够丰富,如没有新闻搜索功能等。

(2)页面布局还比较简单,不够完善。

参考文献:

[1]刘红卫.微信小程序应用探析[J].无线互联科技,2016(23):11-12+40.

[2]邱晓虹.基于.NET校园新闻管理系统的設计和实现[D].华东师范大学,2010.

[3]刘玉佳.微信“小程序”开发的系统实现及前景分析[J].信息通信,2017(01):260-261.

[4]刘增杰,张工厂,刘玉萍.php5.5从零开始学[M].清华大学出版社,2014.

猜你喜欢
微信小程序设计
BUBA台灯设计
图书馆微信小程序的应用现状及前景分析
基于CNKI的微信小程序研究文献计量分析
信息技术与专业课程融合路径探索
有种设计叫而专
从互联网生态看微信小程序的发展
微信小程序面面观
当图书馆遇上微信小程序
陈国兴设计作品
匠心独运的场地设计画上完美句点