社区管理系统的设计与实现

沈东旭 白建 姚嘉明 张晶

摘要：现如今随着互联网的深入发展，移动营销、移动服务已经逐渐成为主流。随着生活水平的提高，人们对社区的活动和管理也越来越注重。为了更好地提供社区服务，在注重社区服务的同时，针对社区的服务系统的要求也有所提高，社区管理系统的设计与开发是必要的。快节奏的数据信息时代，移动终端的手机成为每个人接收信息的载体，而微信则是人们使用最多的App之一，且微信目前也是移动端网站最好的载体。选用微信小程序平台作为开发平台，对社区管理系统进行分析和设计，在此基础上研究社区用户需求及与社区用户相关政策的实时更新，使得社区服务不断完善，从而设计出更符合市场、用户需求的社区管理系统。

关键词：微信;小程序;App;社区管理

中图分类号：TP393 文献标识码：A

文章编号：1009-3044（2020115-0126-02

随着互联网的深入发展，移动技术的投入数据增长得特别快，远远的高于其他平台的增长，微信目前是移动端网站最好的载体，微信小程序已经完全融入移动服务技术的发展趋势。由于智能移动设备在中国大面积普及，移动设备的App成为多数人的首选，但由于App需要在移动端下载及注册，且开发成本相对于微信小程序来说偏高，因此微信小程序成为微信用户最主要的使用功能之一。通过微信可以大大增加网站的访问人口，如朋友圈与好友直接分享链接、二维码、微信公众号、微信小程序等等。那么基于微信小程序平台的社区管理系统，让社区管理及服务更加简单、方便。

微信是眼下国内最热门的通讯App，社区管理系统使用微信小程序平台，让社区服务更加简单、便捷，以微信小程序作为人口，用户可以通过微信账号自动注册，且登录过程用户可以一键登录，避免注册的烦琐。同时，为了用户的使用体验更好，利用微信小程序收集数据进行分析，为用户提供更贴心的社区服务。

微信小程序开发采用JavaScript、WXML、WXSS技术进行，JavaScript技术是其代码在微信App中运行，而不是在浏览器里运行，因此微信App需要提供对应的APl支持。WXML类似于HTML语言，WXML（WeiXin Markup Language）是框架设计的一套标签语言，结合基础组件、事件系统，可以构建出页面的结构。WXML是基于XML语法开发的微信的语言，具有数据绑定、列表渲染、条件渲染、模板、事件、引用等能力。WXSS（weiXin Style Sheets）是一套样式语言，用于描述WXML的组件样式，具有CSS的大部分特性，用来决定WXML的组件应该怎么显示。微信的架构，是数据驱动的架构模式，页面的更新都需要通过对数据更新来实现，uI和数据是分离的。

微信小程序分为webview和appService。uI主要通过web-view来展现，appService是用来处理数据、业务和调用接口。运行过程中，通過系统层JSBridge进行通信，实现uI的渲染以及时间的处理等。

该设计涵盖了目前主流金融App的主要功能，包括社区福利，社区新闻等功能，并对其进行改进与创新。

1可行性分析

作为社区管理App，在安全性和实时性稳定的基础上，设计的目的是提高用户的体验，使软件的操作更为简捷。基于微信小程序开发平台，省去App烦琐的下载，通过搜索和扫一扫就可以打开，更容易宣传和获取用户信息。与App开发成本相对比，微信小程序开发成本较低，且微信小程序有原生的内置组件，对于web的扩展能力更强大，体验更好，减轻对webview的渲染工作，可以绕过setData数据通信和重渲染流程，且微信小程序基于Exparser框架，在JS环境中运行，支持自定义组件，性能更好。安卓系统可以添加到移动端桌面，与原生Aop基本相同，微信自己拥有严格的审查流程，为用户提供良好的安全保障。

2系统需求分析

基于微信小程序的社区管理系统的使用者基本为社区用户，程序在功能上应具备一些App的主流功能，并且可以实时将最新政策更新至社区新闻。本社区用户能够注册和登录该系统，社区新闻应实时随着每天的政策第一时间更新。通过每个界面的搜索信息能搜索到社区用户需求的相关界面的信息，并且巧用微信的搜索功能来抢排位。社区互动里通过咸鱼商场来推动国家提倡物品的二次利用。与附近的有相同兴趣爱好的社区用户可以相约一起交流，使社区生活更加融洽。通过附近娱乐展现附近的小程序领取各种优惠券等，小程序自动展现给周边5km内的微信用户，所有符合条件的小程序能被免费曝光。做一个小程序，相当于给店铺增加10倍曝光的机会。同时还需开发针对管理员的后台管理系统，主要用于发布新闻、用户管理、热门新闻推送和订单管理等。如图1所示。

3社区管理系统的功能及设计

社区管理系统的功能包括：登录及验证、社区新闻、搜索、咸鱼商城、附近娱乐、约友。

微信小程序的登录及验证，点击“我的”即可进入该页面，该页面显示社区用户的注册个人信息，包括头像、用户名、所属地区和性别等，这些信息均是通过微信获取。用户在尚未登录的情况下可使用该小程序。用户进行注册时，小程序端wx log-in获取code并wx request提交code给服务器，用WX～login获取登录凭证code。服务器提交Appid、appSecret、code到微信方服务器，获取session_key&openid。服务器根据session_key&ope-nid生成3rd_sessio，并返回3rd_session到小程序端。小程序端wx getUserInfo获取用户信息和wx.getStorage获取3rd_session数据，根据这两项参数获取到注册用户的基本信息，服务器SQL用户会将数据信息更新，自动注册并保存在数据库中。如图2所示。

社区管理系统微信小程序的首页为搜索和社区新闻界面，内容主要有搜索框。通过顶部的搜索框可以搜索社区用户需求的相关信息，然后进入信息详情页面。社区新闻设置在搜索框下面，首先显示的是社区要闻，要闻下面是一个轮播图，主要显示当日头条，图片会自动切换，也可以通过滑动屏幕切换。点击图片可以进入新闻详情页。轮播图下方是社区实时新闻列表，下拉可以加载更多关于社区的新闻。

社区互动内容主要有搜索框，tab标签。通过顶部的搜索框可以搜索到社区用户需求的相关信息，然后进入信息详情页面。点击tab标签可以对社区互动进行分类，可以分为咸鱼商城、附近娱乐、约友。可以通过搜索框来搜索二手物品，附近的娱乐场所及约友信息等，每个界面能搜索到社区用户需求的相关信息，并且巧用微信的搜索功能来抢排位，设置标题时标题不能太短，建议使用长尾标题，关键词描述优化。

4系统测试

在社区管理系统完成之后需要对整个系统的各个功能模块进行测试，来验证其是否能正常运行。为了系统的完整性与用户体验，首先要测试的是前端页面的功能逻辑是否正常，然后对数据的提交，后端数据的处理进行检验，确保没有严重的错误。

5总结

本系统基于微信小程序技术进行开发，采用Exparser框架作为实现框架，在Js环境中运行，支持自定义组件。基于安卓系统可以添加微信小程序到移动端桌面，与原生App基本相同，且微信自己拥有严格的审查流程，为用户提供良好的安全保障，除此之外还有更多的人性化服务。本系统拥有简洁和易于使用的特点，但是还是存在很多的不足之处，比如在很多关键点都没有设置一些提示信息，如防止用户操作错误的提示。虽然系统能够很好地满足实际应用，但是由于在设计时没有丰富的社区管理经验，因此对业务的理解和设计存在一定的差距。