简介这是一份面向计算机专业毕业设计与课程作业的智能笔记管理系统项目压缩包帮助学习者从需求分析、界面设计到模块实现获得完整参考。压缩包共54个文件以35个vue前端页面、8个ts逻辑封装为主体另含png图标、json配置、html入口、css样式、gitignore、README说明等整体约203KBsrc目录下views、router、assets等结构清晰适合VueTypeScript技术栈的项目实训与二次开发。该项目将人工智能理念融入笔记场景覆盖笔记创建编辑、标签分类、全文搜索及共享协作并涉及智能推荐、自动摘要、语音识别等扩展思路。目前已有163人学习下载源码、依赖锁定文件与工程配置齐备既可用于快速启动演示也能支撑毕业设计说明书的撰写与答辩准备。 收到一个「智能笔记管理系统.zip」大部分人的第一反应是解压、打开、双击然后被一串红色报错劝退。这类 zip 最常见的真身是一套 Java Web 全栈工程后端提供用户登录、笔记增删改查、分类和搜索接口前端是 Vue 页面数据落在 MySQL。它能解决的是「课程设计或毕业设计里如何把这样一套系统跑起来并讲清楚原理」适合正在赶毕设、做课程作业或者想快速掌握 SSM/Spring Boot Vue 项目结构的人。下面按我自己落地这类项目的顺序走先备环境再灌数据库跑通前后端最后说高频故障和能加分的验证思路照着做能少折腾好几天。2. 环境准备JDK8 与 MySQL 的 zip 安装和三个常翻车的地方2.1 从「智能笔记管理系统.zip」到本地目录解压的编码坑和路径规矩拿到 zip 先别急着双击先用命令看压缩包里是什么结构。常见课程作业工程要么是后端 Maven 工程加前端 Vue 目录的混合包要么是一个完整的 Spring Boot 单工程再加一个 database.sql。直接双击解压没问题但如果你在 Linux 服务器上干活unzip 对中文文件名很容易乱码因为 Windows 下压缩时默认用了 GBK 编码。# 先看压缩包内容再决定怎么解压 unzip -l xxxx_智能笔记管理系统.zip | head -20 # Linux 下用 GBK 编码解压避免中文文件名乱码 unzip -O GBK xxxx_智能笔记管理系统.zip -d ~/projects/note-system # 改完代码后重新打包交付时排除依赖目录体积小很多 cd ~/projects zip -r note-system-backup.zip note-system \ -x */node_modules/* -x */target/*第一行只查看文件列表不实际解压能确认是前后端分离还是单工程结构。第二行的-O GBK参数在 unzip 5.52 以上版本才有macOS 自带的 unzip 不支持这个参数遇到中文乱码可以用 7-Zip 或直接用 Windows 资源管理器解压它默认按系统语言处理。第三行是我养成的一个习惯每次交付前用zip -r重新打包-x排除node_modules和target这两目录加起来动辄几百 MB带着它们发给别人完全没必要而且对方解压时还可能因为路径过长报错。解压路径的规矩比想象中重要。我一般把项目放在D:\projects\note-system这种纯英文、无空格的路径下不会放到「桌面」或带中文的目录。后端读application.yml里的相对路径时、前端 webpack 打包时中文路径和空格偶尔会触发一些诡异问题你说不清是代码问题还是环境问题索性一开始就避开。2.2 MySQL 的 zip 安装初始化、注册服务与 my.ini课程作业的 MySQL 版本集中在 5.7 和 8.0。官方提供的 zip 包类似 notepad 那种绿色版解压即用但不是双击就能跑必须做四步写 my.ini、初始化数据目录、注册 Windows 服务、改 root 密码。[mysqld] basedirD:/tools/mysql datadirD:/tools/mysql/data port3306 character-set-serverutf8mb4 collation-serverutf8mb4_general_ci default-storage-engineInnoDB max_connections200 [client] port3306 default-character-setutf8mb4这几个参数里basedir和datadir必须写成你自己的绝对路径。datadir指向的目录必须不存在或者为空MySQL 初始化时会往里面写系统库。character-set-serverutf8mb4是中文笔记内容不乱码的第一道保险很多系统表结构是 utf8但 utf8 在 MySQL 里不是真正的全量 Unicodeemoji 和生僻字会存不进去所以课程作业我直接建议 utf8mb4。初始化这一步是血泪经验重灾区。如果执行mysqld --initialize会生成一个随机临时 root 密码写在data目录下的.err日志里很多同学找不到这个文件或者复制密码时把特殊字符看错后面连半天连不上。我一般用--initialize-insecure它生成一个无密码的 root省去这层麻烦。# 在 mysql 解压目录下执行生成 data 目录 mysqld --initialize-insecure # 注册 Windows 服务并启动 mysqld --install MySQL --defaults-fileD:/tools/mysql/my.ini net start MySQLmysqld --install后面的MySQL是服务名可以自己改遇到本机已经装过 MySQL 服务时换个名字能避免冲突。启动后立刻改密码ALTER USER rootlocalhost IDENTIFIED BY 123456;MySQL 8.0 里ALTER USER直接IDENTIFIED BY就行别再用老版本的PASSWORD()函数会直接报语法错误。改完密码后顺手执行FLUSH PRIVILEGES;虽然其实用不到但算是给自己加一层心理安慰。2.3 JDK8 的 zip 压缩包与 Maven 的取舍这门课的版本玄学课程作业工程的 Java 版本几乎清一色是 JDK8。不是说 JDK17 不行而是这些工程大多基于 Spring Boot 2.x 或更老的 SSM 配置JDK17 下javax包名、反射权限、CGLIB 代理都可能出兼容问题你花一下午升级答辩分数不会因此多一分。JDK8 的 zip 压缩包下载后解压到纯英文目录然后配环境变量。Windows 下在系统属性里新建JAVA_HOME指向 JDK 解压目录再在Path里加%JAVA_HOME%\bin。Linux 下更简单export JAVA_HOME/opt/jdk1.8.0_xxx export PATH$JAVA_HOME/bin:$PATH java -version输出里看到1.8.0_xxx就说明生效了。这里有一个隐藏翻车点电脑里可能已经装了其他版本 JDKPath里后加的路径优先级可能不够高导致终端里敲java -version看到的还是旧版本。解决办法是检查环境变量列表里有没有其他C:\Program Files\Java\jdk-17\bin之类的条目有的话先挪到后面或直接删掉。Maven 同样下载 zip 解压即用不需要安装向导。但国内网络环境下中央仓库下载依赖经常卡死这是另一个黑匣子。我习惯下载压缩包后先改conf/settings.xml加阿里云镜像避免mvn clean install拉依赖拉到一半报Connection timed out。版本选择上Maven 3.6.x 配合 JDK8 是这门课里最稳的组合3.9.x 也能用但没必要追新。如果你用 IDEA 打开工程后直接点启动IDEA 会用自己的内置 Maven 配置和命令行的settings.xml是两套注意保持一致否则可能出现「命令行能编译、IDEA 里全是红叉」的奇观。3. 数据库初始化与后端配置笔记表结构和 4 个必调参数3.1 先读表结构再导入 database.sql解压后你会看到一个.sql文件名字多半叫database.sql或note.sql。别直接一把梭导入先打开看一遍建表语句。常见工程至少有三张表用户表、分类表、笔记表。笔记表是整个系统的核心字段设计大致是这样表名核心字段用途sys_userid, username, password, nickname, create_time登录认证和用户信息note_categoryid, user_id, name, sort笔记分类按用户隔离noteid, user_id, category_id, title, content, tags, is_delete, create_time, update_time笔记主体内容我特别关注两点一是字符集是不是 utf8mb4二是有没有is_delete逻辑删除字段。前者决定中文笔记能不能正常存取后者影响搜索时要不要加过滤条件。很多工程的搜索接口只写了WHERE title LIKE ...忘了过滤is_delete 0结果删除的笔记还能被搜出来答辩时被老师一问就露馅。# 命令行导入 SQL 文件 mysql -u root -p123456 --default-character-setutf8mb4 database.sql # 如果要进入 mysql 交互环境手动执行 mysql -u root -p123456 mysql SET NAMES utf8mb4; mysql SOURCE D:/projects/note-system/database.sql;--default-character-setutf8mb4很关键SQL 文件本身如果是 UTF-8 编码而客户端和服务器字符集不一致导入过程中中文字段值比如预设的分类名「工作」「学习」就会变成乱码。SOURCE是 mysql 交互环境里导入文件的命令它读取的是客户端本地文件注意路径用正斜杠Windows 下反斜杠会被当成转义字符。导入成功后执行SHOW TABLES;确认表都存在再看一眼SHOW CREATE TABLE note\G确认CHARSETutf8mb4。这一步做到位后面所有「中文乱码」问题基本都能从源头上排除一半。3.2 application.yml 里最容易漏的 4 个参数后端配置文件的文件名可能是application.yml或application.properties内容大同小异。这里是翻车率最高的区域因为课程作业的配置经常是在某台能跑的机器上拷贝出来的数据库账号密码和你本地对不上驱动版本也可能不同。server: port: 8080 spring: datasource: url: jdbc:mysql://localhost:3306/note_db?useSSLfalseserverTimezoneAsia/ShanghaicharacterEncodingutf8allowPublicKeyRetrievaltrue username: root password: 123456 driver-class-name: com.mysql.cj.jdbc.Drivercom.mysql.cj.jdbc.Driver是 MySQL 8.0 的驱动类5.7 时代常用com.mysql.jdbc.Driver。如果你本地是 MySQL 8.0配置文件里写的却是旧驱动名启动会直接报ClassNotFoundException。serverTimezoneAsia/Shanghai不配的话时间字段会差 8 个小时插入一条笔记列表里显示的 create_time 是昨天。useSSLfalse是让驱动别去做 SSL 握手本地开发完全没必要加密还能省一点启动时间。最后一个allowPublicKeyRetrievaltrue是 MySQL 8.0 的专属问题。MySQL 8.0 默认认证插件是caching_sha2_passwordJDBC 驱动第一次连接时需要获取服务器公钥某些驱动版本默认不允许这个行为于是抛Public Key Retrieval is not allowed。这个报错在第 5 章展开说现在先记住URL 里加上它就少一个坑。密码字段我加上了引号因为123456是纯数字YAML 解析时有可能被当成数字类型如果后端框架做了严格类型转换可能出幺蛾子。字符串加引号是 YAML 的规范写法能避免这种边界情况。3.3 启动后端端口占用和第一次运行日志怎么看配置改完就可以启动后端了。如果你用 IDEA直接打开工程找到主类类名一般是NoteApplication或Application右键运行。想验证命令行能不能跑用 Maven 命令更快mvn clean install -DskipTests java -jar target/note-system-0.0.1-SNAPSHOT.jar第一次跑mvn clean install会下载大量依赖如果你配置了阿里云镜像几分钟能完成没配镜像的话可能卡在某个 jar 的下载上长达半小时。-DskipTests是跳过测试代码编译后的执行课程作业里若有写得很糙的单测运行时会因为连不上数据库直接失败先跳过是务实的选择。日志看到这一行基本就成功了Tomcat started on port(s): 8080 (http) Started NoteApplication in 12.345 seconds如果端口被占Tomcat 会报Port 8080 was already in use。我习惯直接改配置文件里的server.port: 8081比去杀进程快得多反正是课程作业端口不影响功能。启动成功后先别急着高兴打开浏览器访问http://localhost:8080/api/health之类的接口或者直接访问登录接口试一下。如果这个环节就 404多半是context-path或server.servlet.context-path配了额外前缀后续前端联调的时候要把它拼进去。4. 前端工程与接口联调Vue 项目跑通笔记列表的完整链路4.1 npm install 与 node_modules 这个黑匣子前端工程在压缩包里一般是独立目录里面是 Vue 源码没有node_modules。这是正常的任何交付源码的 zip 都不可能带依赖目录。你需要先看package.json确认 Vue 版本和启动脚本。课程作业最常见的是 Vue 2 vue-cli 工程scripts里写的是npm run serve如果是 Vue 3 Vite 工程则是npm run dev。# 先确认 npm 镜像源国内直接换淘宝镜像 npm config get registry npm config set registry https://registry.npmmirror.com # 安装依赖 npm install # 启动开发服务器 npm run serve # 或者 npm run devnpm install是前端第一个黑匣子它输出几百行日志但真正重要的只有最后几行看到added 1234 packages就算成功。中途报node-gyp或node-sass相关错误是最典型的翻车现场node-sass是原生模块需要针对当前 Node 版本重新编译课程作业里常见 Node 14 或 16 配node-sass4.14如果你本机装的是 Node 18/20大概率编译失败。我的建议是按工程里.nvmrc或 package.json 的engines字段提示安装对应 Node 版本而不是硬着头皮换sass依赖因为项目代码里写法可能是scss deep 选择器换 dart-sass 后语法兼容性又是一堆坑。实在不想装多个 Node 版本就用.browserslistrc里给出的版本区间判断大方向但我知道这条路不好走。# 装完依赖还报错时先删干净重来 rm -rf node_modules package-lock.json npm install这是「后悔药」把node_modules当黑匣子的处理方式不是去查里面的文件而是整个删掉重装。我见过太多人花两小时在 node_modules 里翻找某个包的版本问题最后发现是安装过程中断导致的文件不完整删掉重装五分钟解决。4.2 配置 devServer 代理把跨域问题兜住前后端分离项目最大的联调障碍是跨域前端跑在http://localhost:3000或 8081后端跑在http://localhost:8080端口不同浏览器会拦截前端发出的 AJAX 请求。课程作业里最省事的方案不是在后端写CrossOrigin而是在前端开发服务器配代理让浏览器以为所有请求都发给了同源地址。// vue.config.jsVue 2 vue-cli 工程 module.exports { devServer: { port: 3000, proxy: { /api: { target: http://localhost:8080, changeOrigin: true, pathRewrite: { ^/api: } } } } }这个配置的意思是前端所有以/api开头的请求都会被开发服务器转发到http://localhost:8080转发时把/api前缀去掉。changeOrigin: true是让转发请求的Host头变成目标地址的域名很多后端框架会校验这个头不写可能返回 403。pathRewrite是路径重写如果后端接口本身不带/api就必须有这一步如果后端接口本来就带/api前缀那pathRewrite留空注释掉。一个常见误用有人在前端的 axios 配置里把baseURL直接写成http://localhost:8080。这样确实能通但属于绕过了代理而且后端如果配了context-path或将来部署到服务器换域名代码里写死的地址全要改。我一般把 axios 的baseURL设为/api配合代理这样浏览器控制台看到的请求 URL 是干净的相对路径部署时只要改代理配置不动代码。4.3 从「笔记列表」到「新增笔记」接口联调的最小闭环配置完代理开始验证接口链路。前端工程里一般会有一个src/api目录把请求集中封装。课程作业的代码结构各异但核心思路是把所有接口调用收敛到一个模块里方便统一管理 baseURL 和 token。// src/api/index.js 常见的封装方式 import axios from axios; const http axios.create({ baseURL: /api, timeout: 10000 }); // 请求拦截器带上登录后的 token http.interceptors.request.use(config { const token localStorage.getItem(token); if (token) { config.headers[Authorization] token; } return config; }); export function login(username, password) { return http.post(/user/login, { username, password }); } export function getNoteList(params) { return http.get(/note/list, { params }); } export function createNote(data) { return http.post(/note/save, data); }baseURL: /api配合第 4.2 节的代理配置是这一套的标配。timeout建议设 10 秒很多时候接口报错不是后端挂了而是后端启动太慢前端等 30 秒后浏览器超时你会以为是自己代码问题。请求拦截器从localStorage取 token是前后端分离最常见的做法登录成功后后端返回 token前端存起来后续每次请求自动带上。联调验证的步骤我按这个顺序走第一打开前端页面跳过登录注册一个账号。第二在页面里新建一条笔记标题写「测试笔记」内容写一段中文。第三刷新列表看这条笔记是否出现。第四打开浏览器开发者工具的 Network 面板看请求地址是不是http://localhost:3000/api/note/save状态码是不是 200。如果看到 404检查代理配置里的路径和后端接口路径是否一致看到 500去后端控制台看异常堆栈多半是数据库字段映射问题请求根本没发出那要检查拦截器是不是报错了。这套验证路径跑通整个项目的主干功能就算立住了后面填其他页面都是体力活。5. 避坑专项智能笔记项目跑不起来的 5 个高频原因5.1 解压后没有 target 和 node_modulesIDEA 里全是红叉现象解压后工程目录里只有源码pom.xml旁边没有target文件夹Vue 目录里没有node_modulesIDEA 打开所有类都飘红。原因交付的 zip 是源码包依赖不会打进压缩包。这是正常的不是文件损坏。你从网上下载的「毕设全套源码.zip」基本都是这样。解决后端工程确认是 Maven 工程后执行mvn clean install -DskipTests让 Maven 根据pom.xml下载依赖并编译前端执行npm install。IDEA 里如果还红右键pom.xml选择「Add as Maven Project」前端目录则要等待npm install完成后 IDE 自动索引。判断工程是 Maven 还是 Gradle 看根目录有没有pom.xml或build.gradle不要凭感觉。5.2 后端启动报 Public Key Retrieval is not allowed现象Spring Boot 启动过程中数据源初始化失败控制台报Public Key Retrieval is not allowed关键字是caching_sha2_password。原因MySQL 8.0 默认认证插件改为caching_sha2_passwordJDBC 驱动连接时会向服务器请求公钥做 RSA 加密传输密码。部分驱动版本出于安全考虑默认不允许这种公钥检索于是直接中断连接。解决在 JDBC URL 上加allowPublicKeyRetrievaltrueuseSSLfalse完整 URL 见 3.2 节。如果改完还不行检查驱动版本是否过旧升级到mysql-connector-java8.0.20 以上。另一个治本方案是把 MySQL 用户的认证插件改回老格式ALTER USER rootlocalhost IDENTIFIED WITH mysql_native_password BY 123456;但这样在 MySQL 8.0 里属于向后兼容新装环境建议直接加参数。5.3 前端页面能打开接口却 404 或网络错误现象浏览器能显示登录页但点击登录后 Network 面板里请求标红要么 404要么ERR_CONNECTION_REFUSED后端控制台没有任何日志。原因axios 的baseURL写死了后端地址如http://localhost:8080而后端实际端口或路径前缀对不上或者端口对得上但后端设置了context-path接口实际路径比前端请求的多了个前缀。ERR_CONNECTION_REFUSED一般是后端没启动或端口不对。解决先看 Network 面板里请求的完整 URL跟后端接口实际路径做对比。统一改成第 4.2 节的代理方案前端baseURL用/api后端保持接口路径干净。如果后端必须配context-path把代理配置里的pathRewrite改掉即可但课程作业我建议后端不要加这个前缀越简单越不容易翻车。5.4 保存的笔记中文乱码搜索「考研」返回空列表现象新建笔记时输入中文列表页显示成「???」或一堆乱码搜索中文关键词永远搜不到但搜索英文和数字正常。原因三个环节任何一个出问题都会这样。第一JDBC URL 没配characterEncodingutf8连接建立后字符集不对第二数据库表本身字符集是latin1或utf8中文存进去变乱码第三LIKE查询条件拼写错误比如直接写LIKE %{keyword}%而 MyBatis 没做字符串拼接。解决按顺序排查。先执行SHOW CREATE TABLE note\G确认默认字符集是utf8mb4不是就ALTER TABLE note CONVERT TO CHARACTER SET utf8mb4;。再检查 JDBC URL补上characterEncodingutf8。最后看 Mapper XML 里的搜索语句正确写法是select idsearchNotes resultTypeNote SELECT * FROM note WHERE user_id #{userId} AND is_delete 0 AND (title LIKE CONCAT(%, #{keyword}, %) OR content LIKE CONCAT(%, #{keyword}, %)) /selectCONCAT(%, #{keyword}, %)是 MyBatis 里做模糊搜索的标准写法。#{}占位符外拼%是无效的因为#{}会被编译成预编译语句的参数%必须作为字符串的一部分传入用CONCAT在 SQL 里拼接最直观。5.5 MySQL 服务起不来3306 端口被占用现象执行net start MySQL提示服务启动失败或者后端启动时报Connection refused但 MySQL 服务明明显示已启动。用netstat -ano查看3306 端口被某个进程占用。原因本机之前装过 MySQL旧服务还占着 3306或者另一个端口冲突。这类问题在机房电脑和二手笔记本上特别常见。解决# 查看 3306 端口被哪个进程占用 netstat -ano | findstr 3306 # 找到 PID 后在任务管理器里结束进程或命令行杀掉 taskkill /PID 1234 /F杀进程前先确认那个 PID 到底是不是 MySQL有些机器上 3306 被其他数据库占用。如果不想杀改当前 MySQL 实例的端口修改my.ini里的port3307然后重启服务同时把后端 JDBC URL 也改成 3307。我一般推荐后者因为可以保留本机其他软件的服务不动课程作业环境少折腾为妙。6. 从交作业到能答辩给笔记系统加「智能」的进阶验证技巧6.1 搜索是「智能」的命门给笔记表加全文索引系统叫「智能笔记管理系统」但我的经验里大部分交付版本只是 CRUD 加一个LIKE搜索。如果想让答辩老师觉得这个名字有说服力最便宜的一步是把笔记搜索从LIKE升级为 MySQL 全文索引。数据量几百条时LIKE还能忍但笔记内容会越来越多全表扫描会越来越慢全文索引是 MySQL 原生支持、不需要引入额外组件的升级路线。ALTER TABLE note ADD FULLTEXT INDEX ft_note_title_content (title, content) WITH PARSER ngram; SELECT id, title, content FROM note WHERE MATCH(title, content) AGAINST(考研 笔记 IN NATURAL LANGUAGE MODE) AND is_delete 0;MySQL 5.7 之后支持中文全文索引但必须用ngram解析器否则中文分词完全不工作。WITH PARSER ngram是关键字少了它索引对中文搜索等于没加。IN NATURAL LANGUAGE MODE是最自然的匹配模式按相关度排序返回。这一步做完搜索体验从「精确匹配子串」直接变成「按关键词相关度排序」效果上的差别是肉眼可见的。6.2 答辩演示脚本一条闭环路径真到答辩时别一上来就点「登录 — 退出」重复三遍。老师想看的是系统能完成一件完整的事。我给自己定的演示路径是注册新账号 → 新建两个分类「工作」「读书」 → 不同分类下各写三条笔记 → 用全文搜索关键词 → 编辑其中一条 → 删除一条 → 在列表中确认删除后不再出现 → 重新登录确认数据还在。# 演示前用一个请求快速验证后端存活 curl -X POST http://localhost:3000/api/user/login \ -H Content-Type: application/json \ -d {username:demo, password:123456}这条命令里的localhost:3000是前端代理地址能看到 200 和返回的 token 就说明前后端链路是通的。如果这里通了但页面里操作失败问题定位在前端代码如果这里就不通说明要先回头修后端。这个顺序能帮你把「环境问题」和「代码问题」快速切开不在黑匣子里瞎猜。我自己的教训是任何改动哪怕只是改了一个 SQL 条件都要先走一遍「新增一条含中文的内容 → 列表刷新 → 搜索命中」三步闭环再上演示环境。环境折腾了一周最后因为一个反向的LIKE参数现场翻车这种体验一次就够。把这套系统当成你将来的工具来验证而不是当成交差作业来应付它的「智能」属性才有机会在答辩现场放光。希望帮到你。本文还有配套的精品资源点击获取