m0_74672734的博客

由于要将同事做的前端设计导入到vue项目中，只用一个文件不是很方便，所以，要将其拆分成store、api、vue、css、util中。但目前仍存在一些小bug，需要修改，后期将会进行新的修改。

这样的按钮会显得更加高级，简洁。

从前端来看目前还缺少复制功能，可以实现对AI助手生成的话已将一键复制的功能：所以为此，进行相应复制功能的实现：首先是template区域，添加复制图标：然后在方法里实现复制功能：即可实现复制功能。

1.后端无法接收前端传来的附件，所以需要将postmapping里的信息表明要接收多媒体的内容。CORS预检机制：浏览器对跨域请求自动发送OPTIONS预检请求，检测服务器是否允许实际请求。框架限制：部分Spring版本需手动配置CORS，否则不会自动响应OPTIONS请求。路由缺失：后端未显式定义OPTIONS方法的路由，或全局CORS配置未覆盖该路径。3.保存附件时遇到fie_type不匹配的错误：刚开始设计的数据库是enum类型。因此需要添加crossorigin，允许前端端口进行响应。

至于前端功能则是将文件信息保存并且传回到后端即可，同时要注意的是，如果在此次消息对话中用户没有上传附件，那也应该支持回答：

同时在附件表存储对应附件信息（如果有的话）至此，后端附件上传代码功能完成。

问答功能仍需应对若用户上传附件（比如jpg\png\word\xlsx\xls\pdf等文件的类型），所以需要新建一个附件表，对attchment表的设计目前如下：

首先需要获取当前对话ID，这是为了传给后端，响应请求。准备消息历史（排除上次的AI回复）

之后将新的AI回复保存到Message表里，并且进行将内容返回前端。不满意AI生成答案？

, request: XMLHttpRequest, …在编写完前后端代码之后，当尝试在页面进行相应时，在控制台出现下列问题。也就是说前端应用无法调用后端API，因为后端没有正确设置CORS，解决重命名历史对话功能后端无法获取前端请求bug。为前端端口指定相应的cors即可。

如果后端返回状态码200，将重命名的标题更新到前端，则重命名成功。前端部分功能编写完成。

在chatController类中，添加重命名的方法，大体思路是前端传入当前历史对话的convId。,通过该convId，在数据库找到该行，然后修改标题以及更新时间，最后保存即可。

(匿名) @ ChatTest.vue:185 Promise.catch deleteConversation @ ChatTest.vue:184 onClick @ ChatTest.vue:22。数据库设置了外键约束：不能在有消息关联时删除 conversation，所以出现删除失败的错误。因此需要先删除message里对应的convid里的消息，然后再从conversation表中删除对应的id信息即可。要删除这一个名为“这是一个新标题”的历史对话。

前篇文章介绍了删除历史对话的后端开发，本篇将介绍如何在前端实现一个完整的对话删除功能，包括用户确认、API调用、状态管理和错误处理等关键环节。

因为有外键操作，所以首先需要先删除对应的消息列表，然后再删除对话。

刚开始设置的是这样的，感觉非常不美观：所以想重新调整一下，参考的是Kimi的导航栏设计：这一块功能的修改主要是依赖于css样式的设计，当然也需要把这两个按钮放在同一容器里：

在当前发现页面发现用户和大模型的对话是在一侧的，这不利于进行区分和不符合常理，所以将样式进行了一下小修改，分布在两侧即可。

在原代码中存在一个bug：当前对话的标题不是现有对话的用户的第一段的前几个字，而是历史对话的第一段的前几个字。当改成size()-1即可。

今天晚上在队长的带领下学习了一下前端vue的基础知识。

本次功能的实现主要集中在后端，前端代码不用改变：

后端：在conversationDTO功能构造方法添加title。本次完善了历史对话的查看功能，可以让其正常显示标题。前端：在历时会话按钮添加标题title即可。

在经过艰难的改bug之后，终于能在前端界面查看历史消息对话。

在开发中医知识问答历史对话查看功能的时候，出现了前后端信息获取异同的问题，在经过非常非常非常艰难的查询之后终于解决了这一问题，而这一问题的罪魁祸首就是后端没有setter和getter方法！在找了很久很久很久的bug之后发现是ConversationDTO的问题，没有加上gettter和setter方法，这就导致在后端最后返回的时候没有将信息传到前端。后端能够获取到，但是前端不能获取。加入之后，问题解决！

进行了部分的界面设计。

经过检查发现，对话与消息之间虽然能实现一对多的映射，但是每两个消息（AI和user的问答）就会开启一个新的对话，这与我刚开始的预想不容，我想实现的是一次对话中可以包含很多条消息，所以需要再进行修改。我大体的修改思路是，要有两种方式进行新对话的闯进，一用户可以手动要求创建新对话，二若三十分之后自动创建一个新对话（这个感觉不是很合理，后续应该还会进行修改）若用户要求创建新对话，则将conversation置为null，这样在后来的if判断中，可以为其创建新对话。

在之前的开发日志中提到数据库建表，所以在此刻需要用到两个表，conversation表和message表，这两者之间的关系是一个对话表里可以包含很多消息。在之前的功能开发中，已经成功将deepseekAPI接口接入到springboot+vue项目中，所以下一步的操作是将对话和消息记录保存到数据库中。然后保存message相关信息，因为是对话，所以保存消息时，需要同时保存用户的问题和AI的回复。

且因为前端设计部分非本人负责且还没有提交到github上，所以目前只能先编写一个简易的界面进行功能的测试。因为该阶段是前后端搭建阶段，所以没有进大模型的专项训练，所以先用老师给的deepseek接口进行代替。然后创建ChatController类，进行deepseek接口的测试。在经过一番修改和测试之后，deepseekAPI成功接入后端。首先进行创建model类。

后续可进行更进一步的功能开发。然后在前端创建vue。

根据数据库表生成对应的model类：

在本地部署完成前后端后，接下来进行数据库的连接，我们的创新实训项目使用mysql和MongoDB两种数据库。在idea直接导入设计好的表即可。

经过一番查找后，发现vite 命令未找到，通常是因为项目依赖未正确安装，因此通过安装项目依赖npm install命令，成功导入该包。文件中，显示找不到一些依赖项。所以在此进行最简单的重新加载项目得以解决，后端连接成功。基于队长搭建的springboot+vue框架，在本地进行测试搭建。查找后发现这个问题出现在 Maven 项目的。前端在本地部署也成功。

对中医知识问答模块数据库结构进行时序图相应设计，实现可视化介绍。

根据上篇博文对中医知识问答功能模块的数据库设计，为更好的进行理解与开发，所以进行了UML图设计，实现可视化介绍。

file_type ENUM('image','audio','video','file'), -- 文件类型。parent_msg_id VARCHAR(36), -- 父消息ID（用于修改记录）content_type ENUM('text','file'), -- 内容类型。msg_id VARCHAR(36) PRIMARY KEY, -- 消息ID。role ENUM('user','assistant'), -- 发送者身份。lang ENUM('zh','en'), -- 语言。

Reranker 模型是一种用于改进信息检索系统或推荐系统结果质量的模型。它通常在初步检索结果之后应用，通过对初步结果进行二次排序，从而提高相关性和准确性。1. Reranker 模型的工作原理初步检索首先，系统使用基础的检索算法（如 BM25、TF-IDF 或其他信息检索模型）从大型数据集中获取初步的候选结果。特征提取对初步检索出的候选结果进行特征提取，提取出与排序相关的多种特征。这些特征可以包括：文档与查询之间的相似性（如余弦相似度）。文档的质量（如点击率、阅读时间等）。

Embedding 将每个对象（如词、图像或用户）映射到一个固定维度的向量空间中，使得相似的对象在向量空间中更接近。在本次项目实训中因为需要用到embedding模型进行数据的处理，所以需要进行学习，通俗来说，embedding模型的作用是将文本转为向量的表达，在NLP领域应用非常广泛。：通过将高维稀疏数据转换为低维密集向量，Embedding 可以有效地减少数据的维度，同时保留重要的信息和关系。：在推荐系统中，通过用户的历史行为和物品的特征来生成用户和物品的向量表示，从而实现个性化推荐。

API是应用程序接口的缩写，他的作用其实就是实现不同软件应用程序和系统之间进行通信和数据交换。