【《基于微信平台的校园服务小程序的设计》9800字（论文）】

I基于微信平台的校园服务小程序的设计摘要为了解决学生使用高校公共资源不合理的问题，本文计一个基于微信平台的校园服务小程序，该小程序使用CSS、HTML和JavaScript设计前端页面，利用SSM框架搭建后台服务器与后端数据交互，通过MySQL、MongoDB和云服务器技术存储有效数据，选择基于微信平台的流行性、传播快和使用方便、轻型应用的小程序。该系统囊括一系列可为广大学生学习生活的服务功能，例如图书查询、空教室查询、图书馆座位预约和签到、空浴室查询、宿舍电费查询等功能，从而实现对学校公共资源的合理化利用，提升学生在校学习生活的质量。关键词：查询功能，小程序，SSM框架AbstractInordertosolvetheproblemofunreasonableuseofuniversitypublicresourcesbystudents,IdesignedacampusserviceappletbasedonWeChatplatform.TheappletusedCSS,HTMLandJavaScripttodesignthefront-endpage,andusedSSMframeworktobuildtheback-endservertointeractwiththeback-enddata.ThroughMySQL,MongoDBandcloudservertechnologytostoreeffectivedata,choosebasedonWeChatplatformpopularity,spreadfast,easytouse,lightapplicationofsmallprograms.Thesystemincludesaseriesofservicefunctionsforstudents'studyandlife,suchasbookinquiry,emptyclassroominquiry,libraryseatreservationandcheck-in,emptybathroominquiry,dormitoryelectricitychargeinquiryandotherfunctions,soastorealizetherationaluseofschoolpublicresources,improvethequalityofstudents'studyandlifeinschool.Keywords:Queryfunction;Smallprogram;SSMframework目录TOC\o"1-3"\h\u摘要 1绪论1.1课题背景及意义随着移动互联技术的不断革新，随之而来的变化也在影响人们的生活方式。微信作为广大人民经常使用的手机软件之一，也在此背景下成为人们生活的主要工具，而微信小程序又是其为打造闭环系统基础之上，继续完善微信生态体系从而推出的一种全新应用形式[1]。自2015年问世以来，小程序逐渐备受世人的关注，从2017年开始，各大互联网公司如阿里巴巴、字节跳动、美团等都开始进军小程序市场，而微信小程序借助微信庞大的用户基数，在小程序市场中备显突出，截止2020年初，微信就已拥有8亿多用户和1000多万个公众号，大有代替低频应用的趋势，在占据市场主导地位的高频应用中同时也扮演着不可或缺的角色[2]。随着微信小程序开发技术的日渐成熟，势必会在互联网时代中迎来更高的热潮。当前，我国的高等教育正全面走向信息化时代，同时又推进了大量的教学，教育资源技术的革新。但是这些各种各样的资源往往比较分散，学校的管理体系缺乏对公共资源的集中共享和协作调节的能力。所以如何发挥高校各类公共资源聚合价值，是我国高等教育面向信息化的最大问题。为了加快迈向教育信息化的步伐，教育部发布了《教育信息化2.0行动计划》和《校园信息化总体框架》，明确说明了信息化校园的建设不仅是教育信息化的重要组成部分，还是衡量教育现代化程度的重要标志。依托微信平台来开发校园服务小程序有着低成本、易操作、流通性强等好处[3]。而IOS或Android的开发需要大量的人力和时间，后期维护的成本也会更高，投入市场的经济效益也没有较高的性价比。综上所述，校园服务微信小程序的设计经过开发实现后，就可以有效的提高各个高校的各类公共资源的使用率，从而构建出一个集教学、管理和生活服务为一体并且以各种教学资源为载体的智能校园环境。1.2国内外研究现状针对提升校园公共资源利用率这个问题，大多数发达和发展中国家都已经采取了相关举措，例如开发一个图书馆座位预约系统或者教务系统。这些都只是提升单方面的教学资源，而未能有一个能完全贯彻学生在校学习生活的系统。根据安徽某高校关于对于学校服务系统评价的调查问卷中，90%的高校学生表示非常希望学校能够开发一个校园服务系统这不仅可以提高学校公共资源的利用率，而且更好的激发学生学习的积极性，提升学生在校生活质量。在国内就已经有这样类似功能的软件，例如超级课程表，今日校园等。然而校园服务系统的开发仍然有所不足，主要有以下几点：第一，系统缺乏规划设计，方案没有精确进行需求分析。许多高校的教学改革项目，没有充分做好系统的设计和规划就仓促上线了，结果发生许多不符合人性化的问题，导致用户的体验感不令人满意。第二，各种设备、技术相互糅合的方案会带来运维与管理困难的问题，随着教育科技的不断进步，高校装备了许多计算机，投影仪，移动终端等电子设备，同时在线教学平台，课堂软件，教学工具在教学课堂上扮演比较重要的角色。设备的重复和软件的重叠，使得教学工具的使用难以达到统一。第三，软件应用与教学任务相脱节，用户体验较差，许多企业在软件设计的过程中并没有深入研究教学任务，没有真正走到教学环境中，难以深度的挖掘和梳理老师、学生和管理三个维度的目标、障碍和需求，没有真正领悟教学法的思路去做功能和体验的支撑设计。为了解决校园服务的应用现状从而提高向社会输送更多的优质人才的能力，我国开始逐渐重视高校的信息化建设，各级政府和教育主管部门也为此制定了许多加快推进高校信息化建设的方针。因此在这种环境下，校园智能化的建设成为高校推进信息化建设的必然趋势。不过高校想要打造一个智能的、环保的、便捷的、舒适的学习环境，不可能一蹴而就，是需要一步一步地积累。众所周知，我国高校的信息化建设发展迟，各大高校都是在一边建设一边积累经验，正因为如此，我国才会在科教兴国的战略下将信息化建设放在重要位置，并在“十二五”规划中就正式明确提出了“校园智能化”的伟大建设愿景，从此智能校园的建设就成为我国教育信息化2.0蓝图中的重要工作之一。在2018年，我国为了尽快实现教育的现代化和追赶发达国家的教育建设步伐，大力推动教育强国的建设和“互联网+教育”的普及，教育部及国家标准委出台了《教育信息化2.0行动计划》、《校园信息化总体框架》等政策及标准，争取在2022年基本上实现“三全两高一大”的发展目标。

2需求分析本章从开发者的角度对系统需求和功能需求进行分析说明，以便用户更好的理解本系统的使用流程2.1系统需求分析 本文所设计微信小程序主要的功能是：图书查询、课程表查询、空自习室查询、图书馆座位预约、空浴室查询、电费查询、通讯录、校历查询、校园出行导航、预约签到、意见留言等功能。由HTML、CSS和JavaScript[4]组成一个完整的前端网页，使用springboot框架搭建的后台进行数据的交互，利用MySQL存储用户的数据和需要进行交互的数据。在交互过程中，基于Java语言[5]的后台对数据库中的数据进行查询和修改，再及时反馈经过后台分析过后的结果[6]，然后用户在前端获取所需的信息。2.2功能需求分析该系统功能模块主要分为登陆模块、图书查询，课程表查询和其他功能模块，如图2-1所示图2-1系统总体模块图2.2.1登录模块在登陆界面中分别是账号框和密码框，用户的账号和密码是该用户虚拟教务系统的学号和密码。点击登陆后本系统会结合用户所输入的账户和密码进行合法性验证，如果验证不成功则服务器会拒绝连接，并反馈给用户错误提示。此时用户可以通过点击“帮助”按钮，根据其提示找回密码；反之则登录成功，进而跳转到首页菜单页面。登录页面和帮助页面如图2-2所示。图2-2登陆界面图2.2.2图书查询模块用户登录完成后点击图书模块，通过搜索栏输入关键字搜索图书，关键字检索类型分别有书名、作者、主题、出版社。通过使用图书查找功能，用户不仅可以查询自己想看的图书所在图书馆中的位置，还可以分享转发自己喜欢的图书。2.2.3课表查询模块用户登录小程序后，可以将教务系统上自己的课程信息导入个人课表模块。该模块就会自动生成课程表，用户便可以随时查看自己本学期的课程情况，同时也可以分享自己的课表。2.2.4其他功能模块用户点击其他按钮，便跳转到一系列与校园生活相关的功能模块，主要包括：空自习室查询、图书馆座位预约、定位签到、电费查询、空浴室查询、成绩查询、校历查询、校园出行导航、校园各部门通讯录和意见留言。这些功能模块是该小程序最主要的组成部门。用户可以在该界面根据自己所需点击相应的按钮，点击注销登陆就会注销账号回到登陆页面，点击分享按钮就可以将小程序分享给其他同学。同时添加了广告位提升小程序的经济效益，也可以将实时新闻链接到此位置，及时了解时事政治。2.3可行性分析2.3.1经济可行性本文意在设计一个校园服务小程序系统，依托微信这种用户基数庞大的软件更易投入社会市场。该系统的建成将会对高校公共资源的利用率不高起到重要的改善作用，同时也会将高校设施，教学业务，校园服务这三方面统一为一体。本系统从用户的需求度入手，具有合理的功能性和现代化的设计潮流。并且微信小程序开发成本低，适用性很强，易于后期维护，具有良好的经济价值效益。2.3.2技术可行性本系统使用的则是移动互联网开发中最流行的框架之一的SSM[7]，它是一款优秀并且兼具轻量级特点的企业级开发框架，整合了Spring与SpringMVC框架的AOP、IOC、DI等特性。与传统的SpringMVC相比，它不仅化繁为简优化了许多配置，还可以与其他框架无缝对接，再加上内置的Tomcat，实现一键启动，提高项目的搭建便捷性。本系统需要储存大量的数据，所以选用的是支持多语言的、高效的且开源的MySQL数据库来持久化存储需要的数据。并使用Redis来存储本系统的数据，一定程度上减轻MySQL数据库的访问压力，还可以缩短网站的响应时间。前端页面设计使用的是JavaScript、CSS和HTML。本人在大学期间学习了有关前端页面的开发和数据库的使用，并通过自学学习进一步提升了对于这些技术的使用能力，在大三期间进修了Java开发框架的课程，并在暑期通过网课方式深入学习这方面的知识。所以本系统在此技术上是可行的

3系统详细设计本章主要介绍系统详细设计，在系统分析的基础上对系统架构、系统功能模块、和系统数据库进行详细解说。3.1系统基本架构设计该系统是基于SSM技术进行设计与开发，是标准的MVC模式[8]，因此可把系统划分为视图层，控制层，服务层和持久层。使用SpringMVC负责请求转发和视图，Spring实现业务对象管理，Mybatis作为数据对象的持久化引擎。3.2系统功能模块设计该系统功能模块主要分为三大模块，即图书模块，课程表模块和其他模块图3-2系统功能模块结构图图书模块：用户点击图书列表查看图书简介，也可以通过搜索栏进行关键字查找自己想要的图书。课程表模块：通过访问教务系统，根据学年学期实时导入课程表信息，显示课程的名字、地点和节数图书馆座位预约：用户点击选择校区和自习室然后在选择座位号，点击预约后，系统修改该位置的状态，显示已被预约。空教室预约：系统根据用户选择的校区和节数自动筛选出空的教室，自动筛选即根据数据库中的教室状态值进行甄别。浴室查询：点击浴室的校区和浴室单位，后台就会向用户反应现在的剩余位置，并且拥有预判一段时间内浴室的使用人数。电费查询：用户绑定楼号宿舍号，系统就会反馈该宿舍的剩余电量已使用电量等。成绩查询：显示出学生的考试信息即科目、授课老师、学期总结，同时可以将成绩分享出去。3.3数据库设计3.3.1实体图设计根据系统模块分析可知系统有多个实体，如：用户实体、图书实体、空教室实体、图书馆座位实体，浴室实体、电费实体等。以此来设计实体关系图各个实体所拥有的属性如图3-3至3-8所示：用户实体图3-3用户实体属性图图书实体图3-4图书实体属性图空教室实体图3-5空教室实体属性图图书馆座位实体图3-6图书馆座位实体属性图5.电费实体图3-7电费实体属性图浴室实体图3-8浴室实体属性图3.1数据库表设计 本系统选用的数据库是MySQL数据库[9]，安装完成MySQL数据库后，在默认连接下创建库Datebase，并在该库下创建所需要的表，最主要的几个表分别是图书信息表、空教室表、图书馆座位信息表、用户表、电费表、浴室表。从开发者的角度对系统主要功能模块进行分析，并通过一下的数据表展示了本系统的数据库设计表。表3-1用户表字段名数据类型是否为空是否为主键说明StuIDbigint(20)否是学号StuNamevarchar(20)否否姓名StuClassvarchar(50)否否班级StuMajorvarchar(50)否否专业StuEnterDatevarchar(20)否否入学时间StuSexvarchar(1)是否性别StuNationvarchar(10)否否民族StuBirthvarchar(20)否否出生日期表3-2图书馆座位表字段名数据类型是否为空是否为主键说明Cmpusvarchar(20)否否校区Floorbigint(20)否否楼层Roombigint(20)否否教室Numberbigint(20)否否座位号Statusvarchar(1)否否状态字段名数据类型是否为空是否为主键说明Campusvarchar(20)否否校区Buldingvarchar(20)否否教学楼Floorbigint(10)否否楼层Roombigint(10)否否教室Datebigint(20)否否星期Numbigint(10)否否节数表3-3空教室表字段名数据类型是否为空是否为主键说明ISBNbigint(20)否是主键BookNamevarchar(50)否否书名Authorvarchar(50)否否作者Themevarchar(50)否否主题Pressvarchar(50)否否出版社Scorebigint(10)否否评分Statusvarchar(1)否否状态Press_datevarchar(20)否否出版日期Locationvarchar(100)否否图书馆藏位置Author_infovarchar(100)否否作者信息Book_infovarchar(1000)否否书本简介表3-4图书信息表字段名数据类型是否为空是否为主键说明StuIDbigint(20)否是主键StuNamevarchar(20)否否姓名Apartmentvarchar(20)否否公寓名称Floorbigint(10)否否楼号Dormbigint(10)否否寝室号Dump_energybigint(10)否否剩余电量表3-5电费表字段名数据类型是否为空是否为主键说明Schoolvarchar(20)否否校名Campusvarchar(20)否否校区Shownamevarchar(20)否否浴室名Showroombigint(10)否否淋浴间号Statusvarchar(1)否否状态表3-6空浴室信息表

4系统功能的实现本章主要是对系统详细描述本系统的四大模块：登录模块、图书查询模块、课表查询模块、其他模块的功能上展示，核心代码的理论介绍。4.1系统主页该系统的主页是通过JavaScript语言、CSS语言和HTML语言设计的，再运用小程序自身所带有组件进行配置，各种相互结合已达到快速转换并渲染各个页面的效果。这四者的结合构成系统中所有页面的配置。首先在启动微信小程序时，我们会通过varapp=getapp()定义一个全局变量app，然后在app.json文件中pages配置系统登录页面的路径pages/index/index且必须放在首位，因为小程序的先后顺序pages中页面路径来决定。pages配置表如图4-1所示。图4-1pages的配置 程序启动第一个页面即登录页面，用户登录完成后，系统会使用wx.navigateTo函数跳转到导航栏界面如图4-2所示，wx.navigateTo函数如下wx.navigateTo({url:'/pages/welcome/welcome?uid='+e.deta.value.uid+'&pwd='+e.deta.value.pwd})图4-2导航栏页面 点击开始使用后页面就会跳转到其他功能模块，该模块从上到下依次是，校园风景图，空教室查询，图书馆座位预约，浴室查询，电费查询，成绩查询，校园通讯录，定位签到等服务模块如图4.3所示图4-３其他模块页面 校园风景图的循环播放是通过调用小程序的swiper组件，图片的URL路径就会循环转换。代码如下所示。<swiper

class="swiper"

indicator-dots="true"

autoplay="true"

interval="5000"

duration="1000"><block

wx:for="{{swiperPic}}"

wx:key="index">

<swiper-item><image

src="{{item.url}}"

class="slide-image"

mode="aspectFill"

/>

</swiper-item>

</block></swiper>它借助在JS的data里定义的grids结构体数组（包括name：功能模块名称、navurl：跳转的页面、gridIcon：图的路径），再通过设计CSS的block组件来排列的。navigator组件访问url连接的pages路径。代码如下。<block

wx:for="{{grids}}"

wx:key="*this"><navigator

url="{{item.navurl}}"

bindtap='{{item.event}}'

class="weui-grid"

hover-class="weui-grid_active"><image

class="weui-grid__icon"

src="{{item.gridIcon}}"

/><view

class="weui-grid__label">{{}}</view>

</navigator></block>定义在grids数据的图片路径组如下swiperPic:

[{url:

'/images/1.jpg'

},{

url:

'/images/2.jpg'

},{

url:

'/images/3.jpg'

},{url:

'/images/4jpg'},图书查询模块点击图书按钮，跳转到图书查询页面，用户可以浏览常见图书信息与根据关键字搜索本小节将介绍图书查询功能的具体细节。4.2.1图书关键字查询方式本系统图书查询方式分为两种，一种是在搜索栏中选择关键字之一进行查询，如图4-4所示图4-4关键字搜索界面wx.request()函数使用post方法与后台进行网络连接并相互传递数据，后台对图书馆的数据库进行查询操作将结果反馈到前端，利用success:function()函数通过GET方法获取用并通过wxss文件显示出结果。如果没有查询到此书，便会调用JavaScript文件wx.redirecTo()函数跳转到弹出提示窗的页面，路径为pages/error/queryerror，表示查无此书。具体代码如下

wx.request({

url:

'/wechat/wxapp/api/'

+

this.data.SearchType

+

'Search.php?keyword='

+

e.detail.value,

success:

function(res)

{

that.setData({keywordStr:

res.data,})

console.log(res.data);wx.hideToast()if

(res.data[0].title

==

"图书馆系统无响应"){x.navigateTo({

url:

'/pages/error/queryerror?ErrorTips='

+

"图书馆查询系统无响应"

})}if

(res.data

==

'空的，查无此书')

{wx.showToast({title:

'本馆暂无此书',

image:

'/images/info.png',icon:

'none',duration:

2000});}

else

{

wx.navigateTo({

url:

'../bookSearch/bookInfo/bookList?keyword='

+

e.detail.value

+

'&SearchType='

+

that.data.SearchType,})

}

}

})4.2.2ISBN码查询方式 ISBN码是专门为识别图书等文献而设计的国际编号，输入相应的书号或者直接扫码完成图书的查询，如图4-5所示。输入的ISBN码后，系统会调用ISBNInput：function()方法进行匹配，手机摄像头所扫描的ISBN码标识则会调用scan：function()方法，如果码正确，就会通过navigateTo方法转换到该书的详细信息，否则会显示“ISBN码错误”字样的信息。图4-5ISBN界面课程模块点击个人课表，系统会根据用户的账号和密码，匹配到相应的课程表，然后导入到个人课程，用户就可以查看本学期所学习的课程信息。设置一个二维数组classesStr,将某个星期某节课存入，例如周一第一节是计算机网络，则classesStr1][2]=计算机网络，用for循环遍历，然后依据页面效果展示出来，其核心的代码如下。wx.request({url:'/wechat/wxapp/api/ClassTest1.java?uid='+app.globalData.uid+'&pwd='+app.globalData.pwd,success:function(res){that.setData({classesStr:res.data,remind:"完成",})}其他功能模块其他模块是系统的主要功能的集合，为用户提高大部分校园生活服务，本小节就具体介绍其功能的实现原理，页面效果和核心代码4.4.1图书馆座位预约和签到用户通过选择图书馆的馆区、楼层和自习室，点击确定跳转到座位选择页面上，然后进行选择点击预约按钮，成功预约后弹出预约成功提示如图4-64-7所示图4-6预约选择界面图4-7预约成功界面参照学校的图书馆座位预约软件的签到功能，理想状态实现局域网内签到技术[10]。根据申请的百度app个人定位密钥ak和经纬度算法实现学生需要在连接局域网状态下才能在完成50米以内的签到局域网签到技术原理就是设置一个WIFI热点保存在服务器中[11]，用户连接后才能访问服务器，服务器匹配连接该网络的用户姓名和学号与预约信息，验证成功后用户才能打开签到页面，否则点击无反应。借助百度地图API的密钥和经纬度定位算法可以精准的算出签到距离[12]，密钥会实时提高我们所在位置的经纬度，再搜查一下学校图书馆的经纬度(纬度是指某点与地球球心的连线和地球赤道面所成的线面角,经度是地球上一个地点离一条被称为本初子午线的南北方向走线以东或以西的度数。本初子午线的经度是0°)，我们可以将用户的纬经度定义为lat1、lng1,图书馆的纬经度定义为lat2、lng2，再利用三角函数关系可以得出两点空间坐标系，再根据数学公式：（4.1）求出相对应的值，与50相比较，小于50则签到成功，反之失败如图4-8。代码如下： getDistance:function(lat1,lng1,lat2,lng2){varR=6378.137;varradLat1=this.Rad(lat1);varradLat2=this.Rad(lat2);vara=radLat1-radLat2;varb=this.Rad(lng1)-this.Rad(lng2);vars=2*Math.asin(Math.sqrt(Math.pow(Math.sin(a/2),2)+Math.cos(radLat1)*Math.cos(radLat2)*Math.pow(Math.sin(b/2),2)));s=s*R;s=s*1000;s=s.toFixed(2)//保留两位小数console.log('经纬度计算的距离:'+s)returns图4-8签到界面4.4.2空教室查询除了图书馆可供学生学习，空教室也是一个不错的学习位置，系统根据用户选择校区、星期和节数筛选出空教室。由于选择节数时可能会选到许多节，所以就需要算法上的优化，首先对空教师进行建模分析，将导入的空教室数据进行排列组合，使用数学归纳法进行贪婪选择的证明，以达成贪婪策略的目的，然后将结果反应给用户。核心代码如下：vara=0varflag=0for(leti=0;i<room.data.length;i++){if(room.data[i].view==view[1]){flag=1answer[a]=room.data[i]a++} 遍历数组room.data,只要flag不为0，则说明查询有结果，否则弹出查询无果的提示。4.4.3电费查询在电费查询模块中，用户选择自己寝室的楼栋号，输入寝室编号进行绑定，便可以查询当前宿舍剩余电量、昨日用电量、已使用电量。并且可以进行分享。由于本人能力有限，无法设计宿舍管理系统，因此均为模拟状态下的数据。如图4-9为电费查询界面。 图4-9电费查询界面4.4.4空浴室查询用户可以通过此模块查看浴室使用人数情况，通过选择校区和浴室号，得到当前浴室剩余位置，如果用户觉得当前浴室位置较为紧张，可以点击预测查看未来的一段时间的使用人数情况[13]，然后根据自身情况合理安排洗浴时间。空浴室查询的界面如图4-10所示图4-10浴室查询页面本模块的特别之处就是利用数据分析[14]来进行科学预测未来一段时间内的流量，将数据存入在二维数组[15]里收集一段时间的某浴室的使用情况，然后根据时间人数来绘制折线图，以此作为参考方便用户选择心仪的时间安排洗浴。一般浴室的营业时间一般在11点到23点，那么可以以小时为单位，总共有12个时间点，然后将每个时间段的总人数存在二维数组count[x][y]中，其中x代表周几，y代表时间段。基于上周七天在各个时间段的总数，最终显示出来就是在用户查询相同时间段的平均数。如图4-11所示图4-11未来预测空位图4.4.5校园出行导航每逢周末、节假日和寒暑假，就会有大量学生都会离校或，所以面对这种实际现象，便设计了校园出行导航模块。此功能模块调用腾讯地图的接口，所以借用地图软件可以为用户提供许多出行方案。校园出行导航页面如图4-11图4-12校园出行导航界面该模块调用openLocationFun()方法达到通过微信的内置地图查看位置，首先从网上下载citys.js文件并导入到小程序的utils文件夹中，然后设置出发地的经纬度例如此:this.openLocationFun(31.748720000,

117.22940100000,

28,

"合肥师范学院",

""),还有缩放比例和出发点名称。并用categories定义查看周边框显示周边地址信息，与citys.js文件的数据相互配对确定其坐标，然后再通过wx.request()函数请求相应的数据接口跳转到腾讯地图或者百度地图这两款软件。以下是调用腾讯地图APP的核心代码wx.request({url:'/'+app.globalData.subDomain+'/cms/category/list',success:function(res){varcategories=[];for(vari=0;i<res.data.data.length;i++) categories.push(res.data.data[i]);})}4.4.6校园通讯录校园通讯录的界面如图4-12所示，学校各单位的联系电话收集在一起，方便用户与部门取得联系。由于座机号码可能太长不方便用户记忆，所以该模块添加了点击号码直接拨打、长按号码可复制到粘贴板等功能。同时通讯录可以分享的功能，方便学校师生使用。图4-13校园通讯录界面长按号码就会触发小程序的API里的copyItd的wx.setClipboarData函数来实现复制到粘贴板功能，用户可以再通过本系统中的onShareAppMessage()函数来响应分享功能。具体代码如下。wx.setClipboarData({ data:event.target.id})4.4.7校历校历是学校一年内工作和学生的日程安排，用来规划学校一年的整体工作部署，鲜明地标出本学期的教学、复习和放假时间方便师生的在校日常作息安排。故此本系统添加校历的功能模块，如图4-12所示由于校历图片储存在云数据库中，所以用下面代码调用此图片，用来显示在小程序的界面上。具体代码如下：preview:function(){wx.previewImage({current:'https://cloud1/wechat/wxapp/images/xiaoli.jpg',urls:['https://cloud1/wechat/wxapp/images/xiaoli.jpg']}图4-14校历界面因为微信小程序是轻量级的应用程序，自身的代码和数据容量不允许超过2M，所以在代码的占有比重的同时，几张看似占有空间不大的图片就有可能造成小程序的内存溢出，这样是不能在真机上使用。调用的步骤为首先将在自己的服务器上存放系统需要用到的图片，访问图片时系统就会调用小程序的preview方法中提供的wx.previewImage()函数进行网络请求，再根据服务器提供的路径，在云端直接调用。通过这种方式来实现小程序的轻量化的产品特性，从而真正做到几乎不占用用户手机空间就可以被使用。界面图4-12所示4.4.8意见留言每一个软件产品基本上都会保留意见留言的功能模块，使用者通过意见留言表达出自己对产品新的要求,开发者则获取需求从而改善系统。所以本系统同样也有这个功能模块，达到收集广大师生对于本系统的提出的建设性意见的作用，在广大师生的不断使用中不断完善该系统，开发出更多的功能模块。意见留言如图4-13所示本系统调用微信小程序的生命周期函数onLoad()来监听用户意见留言面的加载，再调用wx.hideToast()函数实现数据传输通信。图4-15意见留言界面5总结5.1系统设计中完成的工作与总结本工作完成了系统的需求分析、系统的详细设计和系统功能的实现的介绍工作，对系统从设计到实现的所运用到技术进行讲解。完成的功能模块有：登录模块、图书查询模块、课表模块、