基于JAVA+SpringBoot+Vue+uni-app的前后端分离的微信小程序校友交流平台

一、项目背景介绍：

开发背景介绍：

随着社交媒体的普及和移动互联网的快速发展，校友之间的交流和联系变得越来越便捷。然而，传统的社交平台往往缺乏专注于校友之间交流的特点，无法提供更加个性化和专业化的功能。

因此，我们基于JAVA+SpringBoot+Vue+uni-app技术栈，开发了一款面向微信小程序的校友交流平台。该平台旨在为校友们提供一个便捷、高效、安全的交流平台，促进校友之间的互动和合作。

该平台具有以下主要特点和功能：

1. 微信小程序端：通过微信小程序作为客户端，提供了便捷的登录和使用体验，用户可以通过微信账号直接登录平台。

2. 前后端分离架构：采用前后端分离架构，前端使用Vue和uni-app框架实现，后端使用SpringBoot框架提供强大的后台支持，实现了前后端分离开发，提高了系统的扩展性和可维护性。

3. 校友信息管理：用户可以在平台上完善个人信息，包括学校、专业、毕业年份等，方便其他校友查找和联系。

4. 动态发布和浏览：用户可以发布自己的动态，分享自己的校园经历、工作成果等，其他校友可以浏览和评论，促进信息共享和交流。

5. 校友圈子和群组：平台支持创建校友圈子和群组，校友们可以根据不同的兴趣、专业或地域等因素加入相应的圈子和群组，方便校友之间的交流和互助。

6. 消息通知和私信功能：平台支持消息通知和私信功能，校友们可以及时接收到系统通知和其他校友的私信，方便交流和沟通。

通过这个校友交流平台，我们希望能够打破时空限制，让校友们可以更加便捷地找到自己的同窗好友，分享彼此的成长和经验，促进校友之间的合作和发展。

二、项目技术简介：

1. JAVA：Java是一门面向对象编程语言，不仅吸收了C++语言的各种优点，还摒弃了C++里难以理解的多继承、指针等概念，因此Java语言具有功能强大和简单易用两个特征。Java语言作为静态面向对象编程语言的代表，极好地实现了面向对象理论，允许程序员以优雅的思维方式进行复杂的编程。

2. Vue：Vue (发音为 /vjuː/，类似 view) 是一款用于构建用户界面的JavaScript框架。它基于标准HTML、CSS和JavaScript构建，并提供了一套声明式的、组件化的编程模型，帮助开发者高效地开发用户界面。

Vue是一个独立的社区驱动的项目，它是由尤雨溪在2014年作为其个人项目创建， 是一个成熟的、经历了无数实战考验的框架，它是目前生产环境中使用最广泛的JavaScript框架之一，可以轻松处理大多数web应用的场景，并且几乎不需要手动优化，并且Vue完全有能力处理大规模的应用。

3. Element-UI：Element，一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的桌面端组件库。

4. SpringBoot：Spring Boot是由Pivotal团队提供的全新框架，其设计目的是用来简化新Spring应用的初始搭建以及开发过程。该框架使用了特定的方式来进行配置，从而使开发人员不再需要定义样板化的配置。通过这种方式，Spring Boot致力于在蓬勃发展的快速应用开发领域(rapid application development)成为领导者。

5. Mybatis-Plus：MyBatis-Plus（简称 MP）是一个 MyBatis的增强工具，在 MyBatis 的基础上只做增强不做改变，为 简化开发、提高效率而生。

6. smart：微信小程序，小程序的一种，英文名Wechat Mini Program，是一种不需要下载安装即可使用的应用，它实现了应用“触手可及”的梦想，用户扫一扫或搜一下即可打开应用。

全面开放申请后，主体类型为企业、政府、媒体、其他组织或个人的开发者，均可申请注册小程序。微信小程序、微信订阅号、微信服务号、微信企业号是并行的体系。

微信小程序是一种不用下载就能使用的应用，也是一项创新，经过将近两年的发展，已经构造了新的微信小程序开发环境和开发者生态。微信小程序也是这么多年来中国IT行业里一个真正能够影响到普通程序员的创新成果，已经有超过150万的开发者加入到了微信小程序的开发，与我们一起共同发力推动微信小程序的发展，微信小程序应用数量超过了一百万，覆盖200多个细分的行业，日活用户达到两个亿，微信小程序还在许多城市实现了支持地铁、公交服务。微信小程序发展带来更多的就业机会，2017年小程序带动就业104万人，社会效应不断提升。

三、系统功能模块介绍：

四、数据库设计：

1：'管理员'（admins）

| 字段名 | 类型 | 默认值 | 列注释 |

| --------- | ------------- | ------ | ------ |

| id | bigint | NULL | 管理员编号 |

| ad_name | varchar | NULL | 昵称 |

| ad_username | varchar | NULL | 账号 |

| ad_password | varchar | NULL | 密码 |

| ad_header | varchar | NULL | 头像 |

2：'贴吧评论表'（comments）

| 字段名 | 类型 | 默认值 | 列注释 |

| --------- | ------------- | ------ | ------ |

| id | bigint | NULL | 贴吧编号 |

| from_stu_id | bigint | NULL | 评论学生编号 |

| content | text | NULL | 评论内容 |

| to_stu_id | bigint | NULL | 回复人编号 |

| parent_id | bigint | NULL | 父级评论编号 |

| img_list | text | NULL | 图片列表 |

| create_time | datetime | NULL | 评论时间 |

| type | int | NULL | 类型 |

3：'反馈表'（feedback）

| 字段名 | 类型 | 默认值 | 列注释 |

| --------- | ------------- | ------ | ------ |

| id | bigint | NULL | 反馈编号 |

| tree_status | int | NULL | 树木状态[0:已种植,1:发芽阶段,2:苗期阶段,3:成长阶段,4:植物阶段,5:开发阶段,6:生殖阶段] |

| apply_id | bigint | NULL | 申请编号 |

| tree_img | varchar | NULL | 树木图片 |

| info | varchar | NULL | 备注信息 |

| create_time | datetime | NULL | 反馈时间 |

| user_id | bigint | NULL | 用户ID |

| tree_id | bigint | NULL | 树木ID |

4：likes（likes）

| 字段名 | 类型 | 默认值 | 列注释 |

| --------- | ------------- | ------ | ------ |

| id | bigint | NULL | 主键ID |

| user_id | bigint | NULL | 用户ID |

| common_id | bigint | NULL | 评论ID |

| create_time | datetime | NULL | 创建时间 |

5：'树木申请'（tree_apply）

| 字段名 | 类型 | 默认值 | 列注释 |

| --------- | ------------- | ------ | ------ |

| id | bigint | NULL | 申请编号 |

| user_id | bigint | NULL | 用户ID |

| tree_id | bigint | NULL | 树木编号 |

| create_time | datetime | NULL | 申请时间 |

6：'树木分类'（tree_type）

| 字段名 | 类型 | 默认值 | 列注释 |

| --------- | ------------- | ------ | ------ |

| id | bigint | NULL | 分类编号 |

| type_name | varchar | NULL | 分类名称 |

| create_time | datetime | NULL | 创建时间 |

7：'树木'（trees）

| 字段名 | 类型 | 默认值 | 列注释 |

| --------- | ------------- | ------ | ------ |

| id | bigint | NULL | 树木编号 |

| tree_name | varchar | NULL | 树木名称 |

| tree_img | varchar | NULL | 树木图片 |

| tree_info | text | NULL | 树木简介 |

| tree_location | varchar | NULL | 种植地点 |

| tree_conserve | varchar | NULL | 养护机构 |

| tree_score | int | NULL | 所需积分 |

| tree_img_list | text | NULL | 图片列表 |

| tree_type_id | bigint | NULL | 所属分类 |

| status | int | NULL | 状态[0:上架,1:下架] |

| create_time | datetime | NULL | 创建时间 |

8：'校友信息'（users）

| 字段名 | 类型 | 默认值 | 列注释 |

| --------- | ------------- | ------ | ------ |

| id | bigint | NULL | 用户编号 |

| name | varchar | NULL | 姓名 |

| head_img | varchar | NULL | 头像 |

| age | int | NULL | 年龄 |

| sex | int | NULL | 性别[0:男,1:女] |

| graduate_time | date | NULL | 毕业时间 |

| info | varchar | NULL | 个人简介 |

| username | varchar | NULL | 账号 |

| password | varchar | NULL | 密码 |

| score | int | NULL | 当前积分 |

| create_time | datetime | NULL | 创建时间 |

| status | int | NULL | 状态 |

| graduate_img | varchar | NULL | 毕业证书 |

五、功能模块：

• 用户端小程序-校友登录/注册(登录获取积分):通过注册新账户可以登录小程序,登录会获取一定的积分,在积分达到一定量的时候可申请植树

  

  

• 用户端小程序-个人中心:在个人中心中可以修改自己的个人信息,并且还能联系系统管理员对系统提出自己的看法

  

• 用户端小程序-个人信息管理:在个人信息管理界面用户可以管理自己的个人信息

  

• 用户端小程序-联系我们:联系系统管理员对系统提出自己的看法

• 用户端小程序-林内贴吧详情:在林贴吧中用户可以发布自己的动态，分享自己的校园经历、工作成果等，其他校友可以浏览和评论，促进信息共享和交流

• 用户端小程序-植树排行榜:

• 用户端小程序-树木详情:

  

• 用户端小程序-植树反馈

• 用户端小程序-校友林:

• 用户端小程序-树木列表:

  

• PC端后台管理-树木申请管理:管理员在后台管理系统中可以管理小程序端校友申请的种植的树木信息

• PC端后台管理-树木分类管理:管理员在后台管理系统中可以管理小程序中用户搜索和查询的树木分类,在这里设置的树木分类也会间接影响树木管理,因为每个树木都应该有属于自己的分类

• PC端后台管理-树木管理:管理员在后台管理系统中可以管理小程序内校友可以种植与查看的树木

• PC端后台管理-校友信息管理:管理员在后台管理系统中可以管理小程序校友的基本信息

• PC端后台管理-贴吧信息管理:管理员在后台管理系统中可以管理小程序内的贴吧信息

• PC端后台管理-反馈管理:管理员在后台管理系统中可以管理小程序内校友提出的反馈信息

• PC端后台管理-管理员信息管理:管理员在后台管理系统中可以管理小程序的后端管理员的基本信息

  

六、代码示例：

/**

生成验证码

 */

@GetMapping(/captchaImage)

public AjaxResult getCode(HttpServletResponse response) throws IOException

{

 AjaxResult ajax = AjaxResult.success();

 boolean captchaEnabled = configService.selectCaptchaEnabled();

 ajax.put(captchaEnabled, captchaEnabled);

 if (!captchaEnabled)

 {

 return ajax;

 } // 保存验证码信息

 String uuid = IdUtils.simpleUUID();

 String verifyKey = CacheConstants.CAPTCHA_CODE_KEY + uuid;

 String capStr = null, code = null;

 BufferedImage image = null;

 // 生成验证码

 String captchaType = RuoYiConfig.getCaptchaType();

 if (math.equals(captchaType))

 {

 String capText = captchaProducerMath.createText();

 capStr = capText.substring(0, capText.lastIndexOf(@));

 code = capText.substring(capText.lastIndexOf(@) + 1);

 image = captchaProducerMath.createImage(capStr);

 }

 else if (char.equals(captchaType))

 {

 capStr = code = captchaProducer.createText();

 image = captchaProducer.createImage(capStr);

 }

 redisCache.setCacheObject(verifyKey, code, Constants.CAPTCHA_EXPIRATION, TimeUnit.MINUTES);

 // 转换流信息写出

 FastByteArrayOutputStream os = new FastByteArrayOutputStream();

 try

 {

 ImageIO.write(image, jpg, os);

 }

 catch (IOException e)

 {

 return AjaxResult.error(e.getMessage());

 }

 ajax.put(uuid, uuid);

 ajax.put(img, Base64.encode(os.toByteArray()));

 return ajax;



}

/**

通用的本地文件上传

@param multipartFile 文件对象@return 文件访问链接URL

 */

@PostMapping(/file)

public SimpleResponse uploadImg(@RequestParam(file) MultipartFile file) {

 // 文件后缀

 String suffix = file.getOriginalFilename().substring(file.getOriginalFilename().lastIndexOf(.) + 1);

 File savePathFile = new File(newTomcatFolder);

 if (!savePathFile.exists()) {

 // 若不存在该目录，则创建目录

 savePathFile.mkdir();

 }

 // 通过UUID生成唯一文件名

 String filename = UUID.randomUUID() + . + suffix;

 try {

 // 将文件保存指定目录

 file.transferTo(new File(newTomcatFolder + filename));

 } catch (Exception e) {

 e.printStackTrace();

 return SimpleResponse.error(保存文件异常);

 }

 // 返回访问链接

 return SimpleResponse.success(newTomcatHost + filename);

}

/**用户登录

 */

@PostMapping(/login)

public ReturnMsg manageLogin(@RequestBody Map<String, String> param) {

 if (StrUtil.isEmpty(param.get(username)) || StrUtil.isEmpty(param.get(password))) {

 return ReturnMsg.error(用户名或密码错误!);

 }

 ManageDTO manageDTO = new ManageDTO();

 manageDTO.setUserName(param.get(username));

 manageDTO.setPassWord(param.get(password));

 QueryWrapper<ManageDTO> manageDTOQueryWrapper = new QueryWrapper<>(manageDTO);

 manageDTOQueryWrapper.last(limit 1);

 ManageDTO adminDTOS = manageService.getOne(manageDTOQueryWrapper);

 if (adminDTOS == null) return ReturnMsg.error(用户名或密码错误!);

 Map<String, Object> map = new HashMap<>();

 map.put(avatar, StrUtil.isNotBlank(adminDTOS.getPhotoImg()) ? adminDTOS.getPhotoImg() : https://wpimg.wallstcn.com/f778738c-e4f8-4870-b634-56703b4acafe.gif);

 map.put(introduction, adminDTOS.getName() + ,你好!);

 map.put(name, adminDTOS.getName());

 map.put(roles, Arrays.asList(admin));

 map.put(type, adminDTOS.getStatus());

 Map<String, String> returnMap = new HashMap<>();

 String uuid = UUID.randomUUID().toString();

 returnMap.put(token, uuid);

 userInfoMap.put(uuid, JSON.toJSONString(map));

 return ReturnMsg.ok(returnMap);

}

七、项目总结：

通过对基于JAVA+SpringBoot+Vue+uni-app的前后端分离的微信小程序校友交流平台的开发，让我深刻明白开发一个程序软件需要经历的流程，当确定要开发一个基于JAVA+SpringBoot+Vue+uni-app的前后端分离的微信小程序校友交流平台的程序时，

我在开发期间，对其功能进行合理的需求分析，然后才是程序软件的功能的框架设计，数据库的实体与数据表设计，

程序软件的功能详细界面实现，以及程序的功能测试等进行全方位的细致考虑，虽然在此过程中，各个环节都遇到了大大小小的困难，但是通过对这些问题进行反复的分析，深入的思考，

借助各种相关文献资料提供的方法与解决思路成功解决面临的各个问题，最后成功的让我开发的基于JAVA+SpringBoot+Vue+uni-app的前后端分离的微信小程序校友交流平台得以正常运行。

基于JAVA+SpringBoot+Vue+uni-app的前后端分离的微信小程序校友交流平台在功能上面是基本可以满足用户对系统的操作，但是这个程序软件也有许多方面是不足的，因此，在下一个时间阶段，有几点需要改进的地方需要提出来，它们分别是：

（1）操作页面可以满足用户简易操作的要求，但是在页面多样化设计层面上需要把一些比较丰富的设计结构考虑进来。

（2）程序软件的总体安全性能需要优化，例如程序的退出安全性，以及程序的并发性等问题都需要进行安全性升级，让开发的基于JAVA+SpringBoot+Vue+uni-app的前后端分离的微信小程序校友交流平台中的相关网站更贴合。

（3）需要对程序的数据结构方面，程序的代码方面等进行优化，让运行起来的程序可以保持稳定运行，也让程序能够保证短时间内处理相关事务，节省处理事务的时间，提高事务处理的效率，

  同时对服务器上资源占用的比例进行降低。

基于JAVA+SpringBoot+Vue+uni-app的前后端分离的微信小程序校友交流平台的开发一方面是对自身专业知识技能进行最终考核，另一方面也是让自己学会独立解决程序开发过程中所遇到的问题，掌握将理论知识运用于程序开发实践的方法。

基于JAVA+SpringBoot+Vue+uni-app的前后端分离的微信小程序校友交流平台的开发最终目标就是让系统更具人性化，同时在逻辑设计上，让系统能够更加的严谨。