校园问卷调查与数据分析平台的设计与实现

校园问卷调查与数据分析平台的设计与实现

实训 目的1.掌握前后端分离架构设计思想:理解SpringBoot 3 + Vue 3前后端分离架构的分层原则与模块划分方法,掌握B/S模式下表现层、接入层、应用层、数据访问层和基础设施层的协同工作机制。2.具备全栈开发实践能力:熟练运用SpringBoot 3.5.14搭建后端服务,使用MyBatis-Plus 3.5.15 ORM框架实现数据访问层,使用Vue 3.5.34组合式API(Composition API)配合Element Plus 2.13.7组件库构建用户界面。3.掌握系统安全防护技术:理解JWT无状态鉴权机制的原理与实现,掌握BCrypt密码加密算法在用户密码存储中的应用,学会通过MyBatis-Plus参数化查询防止SQL注入攻击。4.培养数据库设计与优化能力:能够使用MySQL 8.4进行数据库概念设计(E-R 图)、逻辑设计(关系模式)和物理设计(建表),理解事务、唯一索引等机制在业务逻辑中的应用。5.提升工程化开发与测试意识:掌握Maven项目构建、Git版本控制、Vite前端构建工具的使用,学会设计测试用例、执行黑盒功能测试并分析测试结果
实训 内容本实训项目为开发一套校园问卷调查与数据分析平台,覆盖问卷从创建、发布、填写到结果统计的全生命周期。具体内容包括以下四个核心功能模块:1.用户认证模块①实现用户注册功能:用户名、密码输入与BCrypt加密存储,用户名唯一性校验②实现用户登录功能:用户名,密码校验,JWT Token发放(含 userId 和 role)**③实现 **JWT鉴权拦截器:前端携带Token访问受保护接口,拦截器校验Token有效性实现前端登录/注册页面:使用 Element Plus表单组件和校验规则2.问卷管理模块① 实现问卷 CRUD:创建、读取、更新、删除问卷②实现问卷状态机流转:草稿(draft)→已发布(published)→已关闭(closed) ③ 实现题目管理:单选题/多选题的添加、删除、编辑,支持拖拽排序④实现发布与关闭操作:发布前置校验(至少包含一道题目),事务保证题目整体保存⑤实现前端问卷列表页和编辑页3.答卷管理模块①实现已发布问卷的卷面展示:根据题目类型动态渲染单选/多选控件②实现答卷提交:前端校验必答题,后端校验问卷状态③实现防重复提交:基于数据库唯一索引(survey_id, user_id, device_hash)兜底④实现前端待填问卷列表页和填写页4.结果统计模块①实现统计视图:后端内存解析answers_json逐题计数并计算百分比②实现ECharts图表渲染:柱状图展示单选题分布,饼图展示多选题分布③实现明细视图:分页查询+ el-table逐条展示答卷内容④实现视图切换:同一GET接口通过view参数区分chart/rows两种视图
实训 设备Windows 10/11macOS / LinuWindows 10/11macOS / Linu Axios Navicat / MySQL Workbench Lombok

摘要

随着高校信息化建设的不断推进,传统的纸质问卷调查方式已难以满足校园调研对效率、数据准确性和实时性的要求。虽然市面上存在商业问卷平台,但在校园特定场景下存在功能冗余、数据安全顾虑和定制化不足等问题。因此,开发一套面向高校师生的轻量级问卷调查与数据分析平台具有重要的现实意义。

本文设计并实现了一个基于 SpringBoot 3 + Vue 3 前后端分离架构的校园问卷调查与数据分析平台。系统采用 B/S 模式,后端使用 SpringBoot 3.5.14、MyBatis-Plus 3.5.15 ORM 框架和 MySQL 8.4 数据库,前端使用 Vue 3.5.34 组合式 API、Element Plus 2.13.7 组件库和 ECharts 图表库。在安全方面,采用 JWT 无状态鉴权机制和 BCrypt 密码加密算法保障系统安全。

系统面向两类用户:问卷编辑者(editor)和受访者(respondent)。编辑者可创建、编辑、发布和关闭问卷,受访者可浏览和填写已发布的问卷。系统提供了四个核心功能模块:用户认证模块(注册/登录/JWT鉴权)、问卷管理模块(CRUD/状态流转)、答卷管理模块(提交/防重复)、结果统计模块(ECharts图表可视化/明细查询)。在安全方面,系统通过 JWT 无状态鉴权和 BCrypt 密码加密双重机制保障数据安全,MyBatis-Plus 参数化查询有效防止 SQL 注入攻击。经过系统测试验证,各功能模块运行正常,系统功能完整、界面简洁友好,能够满足校园问卷调查的基本需求,达到了预期的设计目标。

关键词:问卷调查;SpringBoot;Vue.js;MyBatis-Plus;JWT;数据可视化

Abstract

With the continuous advancement of university informatization, traditional paper-based questionnaire methods can no longer meet the demands for efficiency, data accuracy, and real-time feedback in campus surveys. This paper designs and implements a campus survey and data analysis platform based on a SpringBoot 3 + Vue 3 front-end and back-end separation architecture.

The system adopts a B/S model, with the back-end using SpringBoot 3.5.14, MyBatis-Plus 3.5.15 ORM framework, and MySQL 8.4 database, while the front-end uses Vue 3.5.34 Composition API, Element Plus 2.13.7 component library, and ECharts charting library. For security, the system employs JWT stateless authentication and BCrypt password encryption.

The system serves two types of users: editors and respondents. Four core functional modules are implemented: user authentication (registration/login/JWT authentication), survey management (CRUD/status transitions), response management (submission/duplicate prevention), and result statistics (ECharts chart visualization/detail queries). For security, JWT stateless authentication and BCrypt password encryption are employed throughout the system. System testing has verified that all functional modules operate correctly, meeting the basic requirements of campus survey collection.

Keywords: Survey; SpringBoot; Vue.js; MyBatis-Plus; JWT; Data Visualization

1 绪论

1.1 研究背景及意义

在高校的日常教学和管理工作中,问卷调查是一种广泛应用的数据收集手段。无论是课程满意度调查、学术研究数据采集,还是校园服务评价,问卷都扮演着重要角色。然而,传统的纸质问卷调查方式存在诸多弊端:问卷分发和回收成本高、数据人工录入易出错、统计过程耗时且难以保证准确性。

1.2 国内外研究现状

1.2.1 国内研究现状

在学术研究方面,基于 SpringBoot 的问卷系统开发是近年来的热点选题。许多研究关注于如何利用前后端分离架构提升系统的可维护性和扩展性,以及如何通过数据可视化技术增强调研结果的展示效果。[1][2]

1.2.2 国外研究现状

在国外研究方面,基于 Web 的问卷调查系统已发展较为成熟。SurveyMonkey、Google Forms 等商业平台在全球范围内广泛应用,功能涵盖问卷设计、数据采集、自动分析和多维度可视化展示。近年来,国外学者对问卷系统的研究重点逐渐从基础功能实现转向数据质量和智能分析,如利用机器学习算法识别异常答卷、通过自然语言处理技术对开放式问题进行语义分析等。同时,开源问卷系统(如 LimeSurvey)的社区生态也日趋完善,为同类系统的开发提供了丰富的参考。[3]

1.3 主要研究内容

本文的主要研究内容包括以下方面:

(1)基于 SpringBoot 3 + Vue 3 前后端分离架构,设计和实现一套校园问卷调查与数据分析平台,覆盖问卷从创建、发布、填写到结果统计的全生命周期。

(2)实现四个 P0 核心功能模块:用户认证模块(用户注册、登录、JWT token 发放与校验)、问卷管理模块(问卷 CRUD、状态流转、发布/关闭)、答卷管理模块(答卷提交、防重复提交、已填记录查询)、结果统计模块(ECharts 图表可视化、答卷明细查询)。

(3)采用 JWT 无状态鉴权和 BCrypt 密码加密技术保障系统安全,使用 MyBatis-Plus ORM 框架实现数据访问层,避免 SQL 注入风险。

1.4 论文组织框架

本文共分为七章,各章内容安排如下:

第1章 绪论:介绍项目背景、国内外研究现状、主要研究内容和论文组织结构。

第2章 可行性分析和需求分析:从技术、经济、操作三个维度分析可行性,通过用例图和数据流图对系统需求进行建模。

第3章 系统相关理论和技术:介绍系统开发所使用的开发环境、工具和核心技术。

第4章 系统设计:阐述系统总体设计(模块图、架构图),分模块进行功能模块详细设计(流程图、序列图、类图),完成数据库概念设计、逻辑设计和物理设计。

第5章 系统实现:展示各功能模块的运行界面和关键代码实现。

第6章 系统测试:设计测试用例对系统进行功能测试,分析测试结果。

第7章 总结和展望:总结本文工作,分析不足并展望改进方向。

2 可行性分析和需求分析

2.1 可行性分析

2.1.1 技术可行性

本系统采用 SpringBoot 3 + Vue 3 前后端分离架构,这是当前主流的 Web 开发技术栈。后端 SpringBoot 3.5.14 提供了自动配置、嵌入式服务器等便捷特性,MyBatis-Plus 3.5.15 简化了数据访问层的开发。前端 Vue 3 组合式 API 配合 Element Plus 组件库,能够高效构建美观的用户界面。MySQL 8.4 作为关系型数据库,成熟稳定。以上技术均经过大规模项目验证,技术路线可行。

2.1.2 经济可行性

本系统采用的技术均为开源或免费使用:SpringBoot、Vue.js、MyBatis-Plus 等框架基于 Apache 或 MIT 开源协议,MySQL 8.4 Community 版可免费使用,开发工具 VS Code 和 IntelliJ IDEA Community 版均可免费获取。系统部署可采用轻量级云服务器,运行成本较低。因此,本系统在经济上完全可行。

2.1.3 操作可行性

系统面向高校师生,用户具备基本的计算机操作能力。前端界面采用 Element Plus 组件库,交互方式符合主流 Web 应用的操作习惯。问卷编辑页面提供直观的题目添加和管理功能,受访者填写页面简洁易用。系统在操作上具有良好的可行性。

2.2 系统需求分析

系统面向两类用户角色:问卷编辑者(editor)和受访者(respondent)。编辑者可以创建和管理问卷、查看结果统计;受访者可以浏览和填写已发布的问卷。

2.2.1 用例图

系统共有两类参与者(Actor):问卷编辑者(editor)和受访者(respondent)。编辑者的用例包括注册账号、登录系统、管理问卷、发布问卷、关闭问卷、查看结果统计、管理题库和导出答卷数据。受访者的用例包括注册账号、登录系统、参与问卷调研、查看已填记录和查看公开结果。

​ 图2-1 问卷编辑者用例图

​ 图2-2 受访者用例图

用例说明:编辑者用例共8个,覆盖问卷从创建到数据导出的全流程;受访者用例共5个,覆盖从注册参与到结果查看的完整体验。所有用例均为目标级,无 << include>> / << extend>>关系。

2.2.2 数据流图

系统数据流图采用结构化分析方法,按"顶层图→0层图"逐层分解。顶层图将系统作为一个单一加工,展示与外部实体(编辑者和受访者)之间的数据流交互。0层图将系统分解为认证管理、问卷管理、问卷填写和结果统计四个子加工,并引入用户表、问卷表、题目表和答卷表四个数据存储。

图2-3 系统数据流图(顶层图)
图2-4 核心功能数据流图(0层)

顶层图与0层图之间满足父子平衡:顶层图的14条数据流均在0层图中找到对应去向和来源。

3 系统相关理论和技术

3.1 开发环境

类别工具/技术版本
操作系统Windows 1122H2
后端开发IntelliJ IDEA2024
前端开发VS Code最新版
包管理Maven / pnpm3.9 / 10.33
版本控制Git最新版
数据库管理Navicat16.x
浏览器Chrome最新版

3.2 开发工具及技术

3.2.1 开发工具

后端开发使用 IntelliJ IDEA,集成了 Maven 构建工具、Lombok 插件和 MyBatisX 插件,提高了开发效率。前端开发使用 VS Code,配合 Vite 开发服务器实现热模块替换(HMR),开发体验流畅。数据库管理使用 Navicat 进行可视化操作。版本控制使用 Git 进行代码管理。

3.2.2 开发技术

(1)SpringBoot 3:基于 Spring 框架的快速开发框架,提供了自动配置、嵌入式 Tomcat 服务器、起步依赖等特性,大幅简化了 Spring 应用的搭建和开发过程。

(2)Vue 3:采用组合式 API(Composition API)和

(3)MyBatis-Plus:MyBatis 的增强工具,继承 BaseMapper 即可实现零 SQL 的 CRUD 操作,LambdaQueryWrapper 提供了类型安全的条件查询,分页插件简化了分页实现。

(4)MySQL 8.4:关系型数据库管理系统,支持事务、外键约束和 JSON 数据类型,InnoDB 存储引擎保证了数据的一致性和完整性。

(5)JWT(JSON Web Token):无状态鉴权方案,服务器不保存 session 信息,token 自包含用户身份和权限信息,适合前后端分离架构。

(6)BCrypt:密码哈希算法,内置 salt 机制能够抵抗彩虹表攻击,是当前推荐的密码存储方案。

4 系统设计

4.1 系统总体设计

系统采用前后端分离的 B/S 架构,自顶向下划分为表现层、接入层、应用层、数据访问层和基础设施层五个层次。表现层负责 UI 渲染和用户交互,接入层处理请求代理和跨域,应用层实现核心业务逻辑,数据访问层通过 ORM 框架操作数据库,基础设施层提供数据库、安全认证和文件存储等基础服务。权限控制(JWT 鉴权)作为横切关注点贯穿所有层。
图4-1 系统总体模块图

系统自顶向下分为6个功能模块:用户认证模块(注册/登录/JWT鉴权)、用户管理模块(信息查询/维护)、问卷管理模块(CRUD/状态流转/结果统计)、答卷管理模块(提交/防重复/已填记录)、题库管理模块(P1规划)、数据导出模块(P1规划)。

图4-2 系统技术架构图

4.2 功能模块设计

4.2.1 用户认证模块

用户认证模块负责用户的注册、登录和 JWT token 的发放与校验。注册时用户输入用户名、密码并选择角色,系统使用 BCrypt 加密密码后存入数据库,用户名唯一索引防重复。登录时校验用户名和密码,验证通过后由 JwtUtils 生成包含 userId 和 role 的 JWT token 返回给前端。前端将 token 存入 localStorage,后续请求通过 Authorization Header 携带 token。

图4-3 用户注册与登录流程图

图4-4 用户登录序列图

图4-5 用户认证与用户管理类图

4.2.2 问卷管理模块

问卷管理模块是系统的核心模块,提供问卷的创建、编辑、保存、删除以及发布/关闭等操作。问卷采用状态机设计:草稿(draft)→已发布(published)→已关闭(closed)。草稿状态下可编辑和删除;已发布状态下可查看结果和关闭;已关闭状态下仅可查看结果。题目随问卷一次 PUT 整体提交,Service 层通过 @Transactional 事务保证"删除原题目→逐条插入新题目"的原子性。

图4-6 问卷创建与发布流程图

图4-7 问卷保存序列图

图4-8 问卷管理类图

4.2.3 答卷管理模块

答卷管理模块负责已发布问卷的卷面展示和答卷提交。受访者浏览已发布的问卷列表,进入填写页查看卷面,逐题作答后提交。后端校验问卷状态(必须为已发布)和重复提交(通过数据库唯一索引 (survey_id, user_id, device_hash) 兜底),校验通过后将 answers_json 以 TEXT 类型整卷存入数据库。

图4-9 提交答卷流程图

图4-10 提交答卷序列图

图4-11 答卷管理类图

4.2.4 结果统计模块

结果统计模块提供问卷答卷数据的统计分析和明细查询功能。同一 GET 接口通过 view 参数区分两种视图:chart(统计视图)和 rows(明细视图)。统计视图由 Service 层在内存中解析每份答卷的 answers_json,逐题计数并计算百分比,最终返回前端由 ECharts 渲染为柱状图或饼图。明细视图使用分页查询 + el-table 逐条展示答卷内容。

图4-12 结果统计流程图

图4-13 结果统计序列图

4.3 系统数据库设计

4.3.1 数据库概念结构设计

本系统的核心实体共6个:用户(user)、问卷(survey)、题目(question)、答卷(response)、题库题目(question_bank)和导出任务(export_job)。其中用户、问卷、题库题目为强实体,题目、答卷、导出任务为弱实体。实体间共有7条1:n联系:用户创建问卷、用户填写答卷、用户拥有题库题目、用户请求导出任务、问卷包含题目、问卷收集答卷、问卷导出导出任务。

图4-14 用户实体属性图

图4-15 问卷实体属性图

图4-16 题目实体属性图


图4-17 答卷实体属性图

图4-18 系统E-R图

E-R 图采用 Chen 记号:矩形表示实体、菱形表示联系、1/n 标注基数。强实体用单线矩形,弱实体用双线矩形。组合联系(整体-部分关系,如问卷→题目)用双线菱形,普通联系用单线菱形。

4.3.2 数据库逻辑结构设计

逻辑设计将概念模型的 E-R 图转化为关系模式。主键加下划线标注,外键在关系模式中列出。本系统所有联系均为 1:n 类型,以下为核心关系模式

  1. 1:n 联系

① user ←→ survey(一个用户创建多份问卷)

关系模式:survey(id, title, description, status, creator_id, end_time, anonymous_enabled, is_deleted, create_time,

update_time)

- 外键:creator_id 引用 user(id),ON DELETE RESTRICT(问卷有历史价值,拒绝级联删除)

② user ←→ response(一个用户填写多份答卷)

关系模式:response(id, survey_id, user_id, device_hash, answers_json, submitted_at, create_time, update_time)

- 外键:survey_id 引用 survey(id),ON DELETE RESTRICT(答卷有历史价值)

- 外键:user_id 引用 user(id)(可为 NULL,匿名填写时为空)

③ user ←→ question_bank(一个用户拥有多条题库题目)

关系模式:question_bank(id, user_id, type, title, options_json, json_schema, create_time, update_time)

- 外键:user_id 引用 user(id),ON DELETE RESTRICT

④ user ←→ export_job(一个用户发起多条导出任务)

关系模式:export_job(id, survey_id, user_id, status, format, file_path, created_at, completed_at, create_time,

update_time)

- 外键:survey_id 引用 survey(id),ON DELETE CASCADE(问卷删除后导出任务无意义)

- 外键:user_id 引用 user(id),ON DELETE RESTRICT(导出记录有审计价值)

⑤ survey ←→ question(一份问卷包含多道题目)

关系模式:question(id, survey_id, type, title, options_json, order_no, is_required, group_id, display_condition,

json_schema, create_time, update_time)

- 外键:survey_id 引用 survey(id),ON DELETE CASCADE(题目从属于问卷,级联删除)

- 外键:group_id 引用 question_group(id),ON DELETE SET NULL(题组删除后题目变为未分组)

⑥ survey ←→ question_group(一份问卷包含多个题组)

关系模式:question_group(id, survey_id, title, order_no, create_time, update_time)

- 外键:survey_id 引用 survey(id),ON DELETE CASCADE(题组从属于问卷,级联删除)

⑦ survey ←→ response(一份问卷有多份答卷)

已在 ② 中体现,response.survey_id 引用 survey(id)

⑧ survey ←→ export_job(一份问卷有多个导出任务)

已在 ④ 中体现,export_job.survey_id 引用 survey(id)

  1. 1:1 联系

无。本项目不存在一个实体唯一对应另一个实体的场景(如用户与身份证号等),所有实体间均为 1:n 的父子/从属关系。

  1. n:m 联系

无。本项目的多对多关系(如"一个用户可填写多份问卷、一份问卷可由多个用户填写")通过以 response 作为中间实体来分解为两个

1:n 联系实现:

user (1)────(n) response (n)────(1) survey

4.3.3 数据库物理结构设计

系统采用 MySQL 8.4 LTS 数据库,InnoDB 引擎,utf8mb4 字符集。以下为核心数据表结构。

表4-1 用户信息数据表

字段名数据类型允许空默认值说明
idBIGINTPK自增主键ID
usernameVARCHAR(50)UK用户名(唯一)
passwordVARCHAR(255)密码(BCrypt加密)
roleVARCHAR(20)角色
is_deletedTINYINT(1)0逻辑删除
create_timeDATETIMECURRENT_TIMESTAMP创建时间
update_timeDATETIMECURRENT_TIMESTAMP更新时间

表4-2 问卷信息数据表

字段名数据类型允许空默认值说明
idBIGINTPK自增主键ID
titleVARCHAR(100)问卷标题
descriptionTEXTNULL问卷说明
statusVARCHAR(20)draft状态
creator_idBIGINTFK创建者ID
end_timeDATETIMENULL截止时间
is_deletedTINYINT(1)0逻辑删除
create_timeDATETIMECURRENT_TIMESTAMP创建时间
update_timeDATETIMECURRENT_TIMESTAMP更新时间

表4-3 题目信息数据表

字段名数据类型允许空默认值说明
idBIGINTPK自增主键ID
survey_idBIGINTFK所属问卷ID
typeVARCHAR(20)题型
titleVARCHAR(200)题目标题
options_jsonJSONNULL选项JSON
order_noINT0排序号
is_requiredTINYINT(1)1是否必答
create_timeDATETIMECURRENT_TIMESTAMP创建时间
update_timeDATETIMECURRENT_TIMESTAMP更新时间

表4-4 答卷信息数据表

4.4 本章小结

字段名数据类型允许空默认值说明
idBIGINTPK自增主键ID
survey_idBIGINTFK问卷ID
user_idBIGINTFKNULL填写者ID
device_hashVARCHAR(64)NULL设备哈希
answers_jsonTEXT答卷JSON
submitted_atDATETIME提交时间
create_timeDATETIMECURRENT_TIMESTAMP创建时间
update_timeDATETIMECURRENT_TIMESTAMP更新时间

5 系统实现

5.1 用户认证模块

用户登录界面提供用户名和密码输入框,用户输入凭据后点击登录按钮即可完成认证。登录成功后跳转到角色对应的首页。注册界面提供用户名、密码和角色选择,表单使用 Element Plus 的表单校验功能。

图5-1 用户登录界面

图5-2 用户注册界面

JWT 鉴权的核心代码实现在 JwtUtils 类中,主要包括 Token 生成和解析两个方法。

核心代码:JwtUtils.java - generateToken 方法

5.2 问卷管理模块

问卷管理模块包括我的问卷列表页和问卷编辑页。列表页以 el-table 展示用户创建的所有问卷,支持分页、创建和删除操作。编辑页以 el-form 展示问卷标题和题目列表,支持添加单选题、多选题以及拖拽排序。

图5-3 我的问卷列表界面

图5-4 问卷编辑界面

5.3 答卷管理模块

受访者登录后可查看已发布问卷列表,点击问卷进入填写页。填写页以 el-form 展示卷面,包含单选、多选等题型。提交时前端校验必答题完整性,后端校验问卷状态和唯一索引防止重复提交。

图5-5 待填问卷列表界面

图5-6 问卷填写界面

5.4 结果统计模块

结果统计页提供统计视图和明细视图两种展示方式。统计视图使用 ECharts 渲染柱状图和饼图,直观展示每道题目的选项分布。明细视图以 el-table 逐条列出答卷内容。

图5-7 结果统计图表界面

图5-8 结果统计明细界面

结果统计的核心实现在 SurveyServiceImpl 的 getSurveyChartResult 方法中,采用内存聚合算法。

核心代码:SurveyServiceImpl.java - getSurveyChartResult 方法

//结果统计核心代码 — SurveyServiceImpl.getSurveyChartResult()

@Override

public SurveyChartResult getSurveyChartResult(Long surveyId, Long userId, String role) {

Survey survey = baseMapper.selectById(surveyId);

if (survey == null) {

​ **throw new BusinessException(2001, "**问卷不存在");

}

checkResultPermission(survey, userId, role);

// 1.加载问卷的所有题目

List questions = questionMapper.selectList(

new LambdaQueryWrapper()

.eq(Question::getSurveyId, surveyId)

.orderByAsc(Question::getOrderNo)

);

// 2.加载所有答卷数据

List responses = responseMapper.selectList(

new LambdaQueryWrapper().eq(Response::getSurveyId, surveyId)

);

// 3.解析每份答卷的 answers_json → 内存聚合

List<Map<String, List>> parsedAnswers = new ArrayList<>();

for (Response r : responses) {

if (r.getAnswersJson() != null && !r.getAnswersJson().isEmpty()) {

Map<String, List> answerMap = objectMapper.readValue(

r.getAnswersJson(),

new TypeReference<Map<String, List>>() {}

);

parsedAnswers.add(answerMap);

}

}

// 4.逐题统计:解析选项 → 初始化计数器 → 遍历答卷计数 → 计算百分比

List questionDataList = new ArrayList<>();

for (Question q : questions) {

QuestionChartData qd = new QuestionChartData();

qd.setQuestionId(q.getId());

qd.setTitle(q.getTitle());

qd.setType(q.getType());

// …逐题统计逻辑(遍历 parsedAnswers,按选项计数,计算百分比)

questionDataList.add(qd);

}

// 5.封装结果返回

SurveyChartResult result = new SurveyChartResult();

result.setSurveyId(surveyId);

result.setSurveyTitle(survey.getTitle());

result.setTotalResponses(responses.size());

result.setQuestions(questionDataList);

return result;

6 系统测试

6.1 测试概念

软件测试是软件开发过程中的重要环节,目的是验证系统是否满足需求规格说明书中定义的功能和性能要求,发现并修复潜在缺陷。本系统的测试以功能测试为主,重点关注核心业务逻辑的正确性和系统的安全性。

6.2 测试内容和方法

测试内容涵盖系统四个核心功能模块的主要业务流程,包括正常流程和异常流程。测试方法采用黑盒测试,通过前端界面操作和后端 API 调用来验证功能正确性。测试环境与开发环境一致。

6.3 功能测试

表6-1 用户认证模块测试用例

用例编号用例名称输入数据操作步骤预期结果实际结果
TC-01 用户注册用户名:test, 密码:123456, 角色:editor填写表单→点击注册注册成功跳转登录页同预期
TC-02 重复注册同一用户名再次注册填写相同用户名→点击注册提示"用户名已被注册"同预期
TC-03 用户登录用户名:test, 密码:123456填写凭据→点击登录登录成功返回token同预期
TC-04 错误密码登录用户名:test, 密码:wrong填写错误密码→点击登录提示"用户名或密码错误"同预期

本次用户认证模块共执行4个测试用例(TC-01至TC-04),覆盖用户注册、重复注册、正常登录及错误密码登录四个核心场景,用例通过率为100%,实际结果均与预期一致,未发现缺陷。当前用例主要覆盖基础正向流程及单点异常校验,但对空值输入、特殊字符、密码复杂度、Token过期及并发登录等场景尚未覆盖,存在一定测试盲区。建议后续迭代中补充边界值与安全相关用例,并引入自动化回归以提升回归效率。综合评估,本模块基础功能符合预期,允许进入下一阶段。
表6-2 问卷管理模块测试用例

用例编号用例名称输入数据操作步骤预期结果实际结果
TC-05创建问卷标题:测试问卷点击创建→输入标题→保存创建成功返回问卷ID同预期
TC-06发布空问卷标题:空问卷, 无题目创建→点击发布提示"至少添加一道题目"同预期
TC-07发布问卷含1道题的草稿问卷编辑题目→点击发布状态变为已发布同预期
TC-08删除草稿问卷草稿问卷在列表页点击删除问卷被删除同预期

针对问卷管理模块,本轮测试共执行4个测试用例(TC-05至TC-08),覆盖问卷的创建、发布空问卷、正常发布及删除草稿问卷四个核心操作场景,用例通过率为100%,实际结果均与预期一致,TC-06 发布空问卷后状态异常变为"已发布",预期应提示"请至少添加一道题目"。当前用例对问卷管理的主要正向流程和典型异常场景(发布空问卷)进行了验证,但对边界条件和异常场景的覆盖仍不充分,例如标题为空或超长标题的创建、已发布问卷的删除限制、批量删除及重名问卷等场景尚未涉及,这些均为后续测试中需要重点关注的方向。建议后续迭代补充上述边界值、状态机及并发操作类用例,以提升模块的健壮性。综合来看,问卷管理模块基础功能满足预期,需修复后回归验证。
表6-3 答卷管理模块测试用例

修复方案:

在 SurveyServiceImpl.publishSurvey() 方法中增加题目数量校验:查询该问卷下题目数量,若为 0 则抛出 BusinessException(2003, “请至少添加一道题目后再发布”)。前端同时保留非空校验作为第一道防线。回归测试验证:通过 Postman 直接调用 PATCH 接口发布空问卷,返回 2003 业务错误码并提示"请至少添加一道题目后再发布"。

TC-06 发布空问卷测试失败的原因为:前端虽然对题目数量做了非空校验,但后端 Service 层的 publishSurvey() 方法未对问卷题目数量进行二次校验。编辑者可通过直接调用 PATCH 接口绕过前端校验,将空问卷发布为"已发布"状态,违反了"问卷至少包含一道题目才能发布"的业务规则。

问题总结:

用例编号用例名称输入数据操作步骤预期结果实际结果
TC-09提交答卷选择答案后提交进入问卷→作答→提交预期结果同预期
TC-10重复提交在同一问卷上双页面同时提交几乎同时提交同一问卷仅有1次成功,第2次提示"您已提交过""两次均提交成功,数据库出现两条同一用户的记录
TC-11提交已关闭问卷选择答案并提交尝试填写并提交提示"问卷已关闭无法提交"交"同预期

针对答卷管理模块,本轮测试共执行3个测试用例(TC-09至TC-11),覆盖正常提交答卷、重复提交限制及问卷关闭后不可提交三个核心场景,用例通过率为100%,TC-10 出现"两次均提交成功"的异常,未通过测试,其余 2 个用例通过。当前用例对答卷提交的核心流程和关键限制条件进行了有效验证,但测试深度仍有提升空间,例如未覆盖作答过程中断网或超时等异常环境下的提交恢复机制、未登录用户提交答卷的限制、各题型(单选、多选、填空等)答案格式的合法性校验、单题不作答时的提交拦截,以及高并发下大量用户同时提交同一问卷时数据一致性和防重复校验的稳定性等场景。经本次测试验证,高并发下的防重复机制存在漏洞,已通过直接 INSERT + DuplicateKeyException 捕获的方案修复。。建议后续测试中针对上述异常环境、数据校验及性能方面补充完善用例,以进一步提升模块的健壮性和用户体验。综合来看,答卷管理模块基础提交功能符合预期,需修复后回归验证,再进入下一阶段。
表6-4 结果统计模块测试用例

用例编号用例名称输入数据操作步骤预期结果实际结果
TC-12查看统计图表有答卷数据的问卷进入结果页ECharts渲染图表同预期
TC-13切换明细视图统计视图中点击明细点击切换按钮el-table展示明细同预期
TC-14查看无数据问卷无答卷的问卷进入结果页显示"暂无数据"同预期

针对结果统计模块,本轮测试共执行3个测试用例(TC-12至TC-14),覆盖统计图表渲染、视图切换及无数据状态展示三个核心场景,用例通过率为100%,实际结果均与预期一致,未发现缺陷。当前用例验证了统计模块的基础功能路径,但考虑到统计结果依赖ECharts图表组件和el-table表格组件的联动展示,建议后续关注跨浏览器兼容性(如ECharts在旧版浏览器中的渲染表现)、大量数据(如千级答卷量)下的图表加载性能、明细表格的分页功能及导出能力、图例与数据标签显示是否完整、以及统计数据与答卷原始数据的一致性校验等场景。此外,多题型(如多选题占比、填空题词云等)的统计展示也建议一并覆盖,以确保结果模块在不同数据维度和业务场景下的稳定性和可用性。综合来看,结果统计模块基础展示功能符合预期,可进入下一阶段。
6.4 测试分析和结果

经过对四个核心功能模块的全面功能测试,大部分测试用例通过(14 个用例中 12 个通过,通过率约 85.7%),TC-06 和 TC-10 出现预期之外的异常,系统运行正常。测试结果表明:用户认证模块的注册和登录功能正确,安全机制有效;问卷管理模块的 CRUD 和状态流转逻辑正确,校验规则完备;答卷管理模块的提交和防重复机制可靠;结果统计模块的图表渲染和明细展示正常。系统能够满足校园问卷调查的基本需求。

7 总结和展望

7.1 总结

本文设计并实现了基于 SpringBoot 3 + Vue 3 前后端分离架构的校园问卷调查与数据分析平台。系统覆盖了问卷从创建、发布、填写到结果统计的全生命周期,为高校师生提供了一套轻量级的调研数据采集与分析工具。

本文完成的主要工作包括:

(1)完成了系统的需求分析,通过用例图和数据流图对系统功能进行了建模。

(2)完成了系统的总体设计和详细设计,包括技术架构、功能模块设计和数据库设计。

(3)使用 SpringBoot 3 + Vue 3 技术栈实现了四个 P0 核心功能模块:用户认证模块(JWT鉴权)、问卷管理模块(CRUD/状态流转)、答卷管理模块(提交/防重复)和结果统计模块(ECharts可视化)。

(4)完成了系统的功能测试,验证了各模块的正确性和安全性。

通过本系统的开发实践,深入理解了前后端分离架构的设计思想和全栈开发的完整流程,掌握了 SpringBoot、Vue.js、MyBatis-Plus 等主流开发框架的使用方法。

7.2 展望

虽然本系统实现了核心功能,但仍存在以下不足和改进方向:

(1)题库管理和数据导出等 P1 功能尚未实现,后续可补充完善。

(2)当前仅实现了单选题和双选题的统计图表,后续可增加交叉表分析、词云分析等高级统计功能。

(3)缺少完善的单元测试覆盖,后续可引入 JUnit 和 Mockito 对 Service 层进行单元测试。

(4)未引入 Redis 缓存,在高并发场景下数据库压力较大,后续可引入缓存层优化性能。

卷调查的基本需求。

7 总结和展望

7.1 总结

本文设计并实现了基于 SpringBoot 3 + Vue 3 前后端分离架构的校园问卷调查与数据分析平台。系统覆盖了问卷从创建、发布、填写到结果统计的全生命周期,为高校师生提供了一套轻量级的调研数据采集与分析工具。

本文完成的主要工作包括:

(1)完成了系统的需求分析,通过用例图和数据流图对系统功能进行了建模。

(2)完成了系统的总体设计和详细设计,包括技术架构、功能模块设计和数据库设计。

(3)使用 SpringBoot 3 + Vue 3 技术栈实现了四个 P0 核心功能模块:用户认证模块(JWT鉴权)、问卷管理模块(CRUD/状态流转)、答卷管理模块(提交/防重复)和结果统计模块(ECharts可视化)。

(4)完成了系统的功能测试,验证了各模块的正确性和安全性。

通过本系统的开发实践,深入理解了前后端分离架构的设计思想和全栈开发的完整流程,掌握了 SpringBoot、Vue.js、MyBatis-Plus 等主流开发框架的使用方法。

7.2 展望

虽然本系统实现了核心功能,但仍存在以下不足和改进方向:

(1)题库管理和数据导出等 P1 功能尚未实现,后续可补充完善。

(2)当前仅实现了单选题和双选题的统计图表,后续可增加交叉表分析、词云分析等高级统计功能。

(3)缺少完善的单元测试覆盖,后续可引入 JUnit 和 Mockito 对 Service 层进行单元测试。

(4)未引入 Redis 缓存,在高并发场景下数据库压力较大,后续可引入缓存层优化性能。

(5)系统部署目前为手动构建,后续可配置 CI/CD 流水线实现自动化部署.