作者主页：毕业设计精选
作者简介：9年JAVA全栈开发经验，专注JAVA技术、系统定制、远程指导，致力于企业数字化转型，CSDN博客专家
摘 要
随着人类生存质量的提升以及生活模式的改变, 越来越多的人在闲暇之余饲养宠物，来满足精神上的需求 。从而 使得宠物服务行业也得到了繁荣发展 。 由于宠物饲养的主体包括宠物和宠物主人，涉及的宠物业务包括许多方面,为进 一步提高宠物业务的服务品质与效益，该文构建了一种基于 SpringBoot 和Vue 技术的宠物服务平台 。其目标是服务广大宠物及宠物主人，使得宠物服务更加信息化、网络化以及智能化。
关键词：宠物服务；SpringBoot；MyBatis；Java；MySQL。
0 引言
《2022 年中国宠物消费报告》中提到，2022 年城镇 宠物（犬猫）主7043 万人，较2021 年增长2.9%，2022 年 城镇宠物（犬猫）消费市场规模为2706 亿元，较2021 年 增长 8.7%。可见养宠人数在不断增长，且报告中指出 饲养异宠的人群中主要以 95 后宠物主为主 ，占比 33.7%。学历主要集中在本科，占比 52.2%。这群人更 愿意以互联网为媒介获取准确、快捷、方便的宠物相关 知识及分享萌宠与主人之间的快乐日常等，故相应的 宠物服务也需要顺应这种潮流，以互联网为载体使宠 物服务更加智能化和信息化[1] 。因此，构建一款互联网 背景下的宠物服务平台是非常有必要的，借助互联网 的便捷性可以给宠物主带来更优质的服务。
1 相关知识及技术
宠物服务平台采用基于 Vue 和 SpringBoot 前后端 分离的开发模式[2]，将前端和后端的项目业务进行分 离，可以做到更好解耦合 。前端项目和后端项目运行 在不同服务器上，前端和后端的服务器之间通过通信 获取数据，此项目前端采用 Vue，运行在 Nginx 服务器 上 。后端项目使用 SpringBoot，运行在 Tomcat 服务器 上，其中前后端进行通信采用 Vue 中的 Axios 技术，是 对 Ajax 的一个封装增强 。综上所述前端职责为向后 端服务器接口发送 Ajax 请求并获取数据，使用 Vue 框 架将数据渲染在页面上 。后端职责为编写 API 接口， 接受前端请求，将查询出来的数据封装起来返回给前端 服 务 器[3], 技 术 方 面 使 用 到 高 级 框 架 SpringBoot、 Spring 及 MyBatis 。前后端分离开发模式如图 1 所示。
图 1 前后端分离开发模式
1.1 Vue
Vue 是一款流行的前端 JavaScript 框架，它采用 MVVM 模式，通过双向数据绑定将视图与数据模型关 联起来 。Vue 主要特点是易学易用，具有高效的性能 和扩展性，支持组件化开发，提供了丰富的指令和插 件，能够快速构建交互丰富的 Web 应用程序 。Vue 的 核心是响应式系统，它能够自动追踪数据变化并更新 视图 。通过使用指令和组件，Vue 提供了丰富的功能， 例如条件渲染 、循环渲染 、事件处理 、样式绑定等 。 Vue 还提供了一套完整的路由和状态管理机制，可以 帮助开发者更好地组织代码和管理状态。
1.2 Spring
Spring 是一款流行的 Java 企业级开发框架，它提 供了一系列的工具和特性，使得 Java 应用程序的开发 变得更加容易和高效 。Spring 框架的核心是 IoC（控制 反转）和 AOP（面向切面编程）两个概念 。IoC 模式通 过将对象的创建和依赖关系的管理转交给 Spring 容器来实现，从而解耦了应用程序中的各个组件 。AOP 模式则通过在应用程序中插入切面来实现横向切面 的关注点分离，提高了代码的可复用性和可维护性。
1.3 SpringBoot
SpringBoot是一款流行的基于Spring框架的开发框 架，它旨在简化Spring 应用程序的开发和部署。Spring⁃ Boot 提供了自动配置、快速开发、无代码生成和微服务 等特性，使得开发者可以更加快速地搭建 Web 应用程 序。SpringBoot 采用约定优于配置的方式，通过自动配 置和自动装配来减少应用程序的代码量[4] 。SpringBoot 支持多种部署方式，例如嵌入式Web 容器、Docker 容器 等，使得应用程序的部署变得更加灵活和方便。
1.4 MyBatis
MyBatis 是一款流行的持久层框架，它支持自定 义 SQL、存储过程和高级映射等特性，使得 Java 应用 程序的数据访问变得更加容易和高效 。MyBatis 会把 数据库表映射成 Java 对象，使得开发者可以更加方便 地操作数据库 。MyBatis 还提供了一些常用的特性， 例如缓存、批量操作、动态 SQL 等，使得 Java 应用程序 的数据访问性能得到了提升 。另外，MyBatis 还支持 多种数据库，例如 MySQL、Oracle、SQL Server 等，使得 开发者可以根据自己的需求选择最适合的数据库。
2 系统需求分析
近年来，养宠的人数急剧增大，如何正确养宠物 以及与宠物相关的知识不断成为人们话题的焦点 。 基于 SpringBoot+Vue 前后端分离的宠物服务系统提供 了与宠物有关的服务，比如日常分享模块，即宠主可 登录本系统发布自己宠物的日常，查看与宠物有关的 知识详情，从而使得宠物主人可以快速了解到养宠知 识，比如公共场合的养宠文明，规范自身和宠物行为。 此系统主要有二类参与者，分别是萌宠用户和管理 员，其中萌宠用户包含未注册用户与注册用户,管理员 主要是对系统信息的维护 。根据用户对系统的需求， 画出用户的用例图如图 2 所示。
图2 系统用例图
3 系统总体设计
基于对市面上现有宠物服务系统分析研究，本系 统是基于传统的 B/S 架构，系统开发语言采用 Java，为 目前使用最为广泛的编程语言之一，其特性有面向对 象、平台无关性、简单、解释执行、对线程、分布式、健 壮性、高性能等 。此系统使用 IDEA 开发平台进行后 端代码的编写，Web 服务器使用 Apache Tomcat8.0,并 配 置 JDK1.8 环 境 ，数 据 库 使 用 轻 量 级 数 据 库 MySQL5.6 。技术上使用了 SpringBoot 和 Vue 作为系统 的基本骨架[5] 。宠物服务系统的使用者可以登录本系 统发布自己的宠秀信息，系统把发布的信息存入后台 的数据库中，方便用户实现随时地对自己发布的信息 进行修改和删除，以及实时展示 。系统共分为五层， 视图层、控制层、业务逻辑层、数据访问层和数据库 层[6]，系 统 架 构 图 如 图 3 所 示 ，并 对 各 层 进 行 详 细 解说。
图3 系统架构图
视图层(View) ：本层有两部分组成，分别是萌宠 用户视图和系统管理员视图 。萌宠用户视图主要包 含了用户登录注册和宠秀信息的发布、修改、查看、删 除，同时用户还可对个人的萌宠信息进行管理、发布 养宠经验、查看个人信息、AI 动物识别以及信息反馈。 系统管理员视图主要为对用户、宠物、影片等信息进 行管理 。从概念上解说此层展示了一个友好的人机 交互页面，结构上隔离了底层原理，技术方面使用前 端基本语法 html5、css3 及 JavaScript 完成页面的布局， 同时还使用到前端高级框架，比如 Vue、bootstrap、La⁃ yui 等[7]。
控制层(Controller)：本层主要职责为接受前端发 来的请求，调用业务逻辑层的服务，将业务逻辑层返 回的数据传给前端，同时传回的数据利用@Reponse⁃ Body 注解可将 Java 对象转为 Json 数据，可更好地将数 据渲染在前端页面。
业务逻辑层(Service) ：本层主要是对视图层的功 能进行具体的实现，其中包含用户登录时的账户信息 判断、基本信息的管理以及 AI 动物识别等 。从概念上 解读此层对业务逻辑进行封装，组合数据持久层中的基本功能，形成复杂的业务逻辑功能，此层采用轻量 级框架 Spring 简化开发。
数据访问层(Dao) :系统通过 Dao 层实现与数据库 的交互，系统开发采用轻量级框架 MyBatis，提升了数 据访问的性能和稳定性。
数据库层：存储系统数据的地方，使用MySQL5.0数 据库，同时为了提高访问速度，采用缓存Redis，其数据 留在内存当中，有持久化的特点，主要用作备份恢复。
3 系统组成及实现
3.1 宠物服务系统界面组成
将宠物有关服务进行整合建立了基于 Vue 和 SpringBoot 前后端分离的宠物服务平台，该平台主要 由两部分组成，分别是前台页面和后台页面 。前台是 萌宠用户所使用的功能界面，包括主界面、宠秀专区、 宠窝专区、生活服务以及个人中心 。后台是管理员所 使用的功能界面，主要是对系统信息的维护 。系统组 成详细信息如图 4 所示。
图4 系统组成
1)前台主界面
宠物服务平台采用 B/S 模式，用户直接在浏览器 输入地址即可直接访问，进入宠物服务平台的登录界 面 。首先开始浏览网站，进行用户注册登录成功后， 便可以进行微型的调查问卷填写，收集用户现在的情 况，比如是否是第一次养宠物、对宠物的一些看法和 养宠物的生活小常识等问题，最后后台根据所做的调 查问卷，分析出用户的爱心程度（是否真心养宠物，有 着一个爱宠物之心），每个注册的用户都会有一次问 卷调查，填写问卷调查后，会有一个是否合格养宠物 证书（分数在 0~100) ，由此进入主界面如图 5 所示。
图5 前台主界面
AI 动物识别，用户可上传自己萌宠的网络或本地 照片，根据用户上传的照片，识别图片中动物的品种 名称（可识别 180 个犬类和 40 余个猫类品种识别，标 注品种详细信息），同时可配合其他识图能力对识别 的结果进一步细化，根据识别结果，给你的爱宠建立 档案，如图 6 所示，识别你的爱宠的品种为美国短毛 猫 。技术上使用 Java 语言连接百度 AI 开放平台的接 口实现动物识别，用户上传宠物图片，系统自动识别 图片中动物的名称，可配合其他识图能力对识别的结 果进一步细化，提升用户体验。
图6 AI 动物识别
2)宠秀专区
宠秀信息的发布与查看是此模块的核心功能，用 户可查看来自各地的宠友发布的宠物动态，并对其进 行评论、点赞等操作 。用户可发布自己宠物的生活动 态（萌照、趣图、私密照）及萌宠与主人之间的趣事，并 且查看自己发布的所有宠秀 。其中宠秀专区细分为： 编辑推荐、人气最高、最新萌宠、语音涂鸦、我的喜爱。
3)宠窝专区
用户可查看养宠知识百科，并且可在宠窝留言专 区发表自己平时养宠物的经验 。其中养宠知识百科 主要分为以下方面：宠物品种大全、室内饲养、户外活 动和预防疾病。
4)生活服务
宠物电影展示：用户可查看与宠物有关的电影， 并在每个电影观看区下面有个用户评论区，用户可在 此评论区中输入自己的观后感及想法。
意见反馈：在前台提供一个用户反馈的输入框， 可对使用情况进行反馈，并且用户反馈的内容直接发 送给后台，后台根据用户反馈的内容对现阶段系统进 行调整。
关于我们：展示系统开发者的具体信息，便于维 护系统。
5)个人中心
个人和宠物信息的维护，以及我的养宠证书 。① 用户基本信息有昵称、头像实名身份认证、号码绑定 出生年月等 。②宠物信息主要包括基本资料（名字、 性别、年龄、绝育）和养成日常（打疫苗、体外驱虫、体 内驱虫、狂犬疫苗）。
3.2 宠物服务系统后台
管理员用户通过登录身份验 证，可进入到宠物服务后台管理 系统的主界面，主要包含用户管 理、宠物信息管理、宠秀和宠窝信 息管理、影片信息管理及用户反 馈这五大部分。
用户管理：管理员可查看宠 物服务平台用户的登录信息，设 置用户账号的状态，即禁用或启 用，还提供索引功能，即管理员可 通过关键词搜索到对应的用户 信息。
宠物信息管理：管理员可查看每个萌宠用户所养 宠物的信息。
宠秀和宠窝信息管理：管理员可查看信息基本情 况，同时还可以进行批量导入和导出，比如宠秀分为 编辑推荐、人气最高、最新萌宠、语音涂鸦、我的喜爱 这五个分区，管理员可根据分类，将宠秀信息导入某 个分区，或者将某个分区中的数据导出，生成一个 Ex⁃ cel 文件，并在浏览器上弹出文件下载的对话框。
影片信息管理：管理员可对影片信息进行维护 操作。
用户反馈：管理员可查看前台用户反馈的信息。
从后台用户、服务器以及数据库方面对后台管理 系统架构做了分析设计，根据用户需求及业务逻辑对 后台管理系统中的主要功能做了详细设计及页面设 计 。其主界面如图 7 所示。
4 结束语
此项目的宗旨是给养宠的人群以及宠物提供更 好的服务，即养宠人群可在此平台上分享自己宠物的 趣事趣照、了解到一些养宠小知识等一系列服务 。在 此设计一款基于 SpringBoot+Vue 前后端分离的宠物服 务平台，宠物服务系统主要采用目前流行的轻量级 SpringBoot 和 Vue 框架，极大地简化了编程工作，同时提高了代码的扩展性和维护性。最后对此系统进行 测试，其宠物服务系统的测试环境：Window10操作系 统，运行环境 IDEA,数据库 MySQL5.0，经过测试此系 统可正常运行，且现阶段基本实现了预期的功能和目 标且试运行良好。