【小程序】聊天功能

文章目录

    • 聊天功能
      • 实现功能
      • 实现思路
      • 后端
      • 前端
      • 效果展示

聊天功能

实现功能

要实现一个聊天机器人，它能够解答用户疑问，并且能够识别到用户聊天的主题，涉及到饮食方面时，会自动决定是否要去数据库中读取用户的相关喜好信息，以实现自动化。同时，还要支持重新生成、复制回答、同时生成两条文本让用户选择以优化模型回复。同时还要对每次的会话进行管理。

实现思路

主要思路就是要将用户输入传给模型，模型予以解答。

主要实现的功能和解决的问题：

  1. 需要维护一个history来存储聊天记录。
  2. 实现打字机效果。
  3. 消息正在生成时，发送按钮变成灰色图片并禁止点击。
  4. 解决输入法弹起后输入框自动调整高度以避免被遮挡问题。
  5. 解决输入法弹起后，顶部导航栏不会上移。
  6. 实现文本的复制功能。
  7. 实现重新生成功能，如果不是最后一条消息，则要删掉该会话中要重新生成的消息后面的所有消息。
  8. 实现同时生成两种回答，让用户选择更喜欢哪种回答。然后选择后，后续回答风格会按照用户选择的那条来回答。
  9. 解决如果用户没有选择哪种回答，就进行发送下一条消息、切换页面、切换会话等操作，则会自动选择详细版的哪种风格。
  10. 实现会话的增加，要求当前会话没有聊天记录时，不会创建会话，只有发送了至少一条聊天记录，才会新增到数据库。同时，当前会话没有聊天记录时，前端会话新增按钮要禁用，即不能再次创建一个新的会话窗口。
  11. 实现会话的删除，使用滑动框，左滑删除。弹出提示框，询问是否删除。并且要解决uview滑动框组件的bug，即删除一个后，该删除状态不会自动消失，还是打开的状态。
  12. 会话列表要实现按照今天、昨天和更早以前进行分组。

后端

由于后端代码很多，只截取片段展示。

def chat_response(query, user_info, session_id=None, history=None, is_chat=None, response_type=None):if user_info is None:return "无法找到用户信息，请检查用户ID是否正确。"if session_id is None and is_chat == "1":session_id = create_session(user_info['user_id'])if is_chat == "1":is_food_topic = is_food_related_topics(query)print("用户输入是否是食物相关主题：" + is_food_topic)if is_food_topic == "true":emotions = get_user_emotions(user_info['user_id'])emotions_str = ", ".join([f"{e['emotion']}{e['food']}" for e in emotions])user_info_str = f"疾病: {user_info['diseases']}, 喜好的食物: {user_info['likes']}, 忌口的食物: {user_info['dislikes']}, 其他喜恶: {emotions_str}"personalized_prompt = f"{query}\n用户信息: {user_info_str}"print("\n============= info_prompt ===============\n")print(personalized_prompt)# 提取用户对食物的情感，并存到数据库中extract_emotions_about_food(query, user_info)else:personalized_prompt = f"{query}"print("\n============= no_info_prompt ===============\n")print(personalized_prompt)store_message(session_id, 'user', query)# 检查用户提问的数量messages = get_session_messages(session_id)user_messages = [msg for msg in messages if msg['role'] == 'user']if len(user_messages) == 3:# 获取前三条用户提问生成标题summary_prompt = "\n".join([msg['content'] for msg in user_messages])title, _ = p_model.chat(tokenizer, f"请总结以下对话主题，不超过10个字，只输出一行，不要有换行：\n{summary_prompt}", top_p=1, temperature=0.01)title = title.strip()update_session_title(session_id, title)print("history\n")print(history)if response_type == "detailed":prompt = f"详细（100字以上）回答：\n{personalized_prompt}"elif response_type == "concise":prompt = f"简洁（50字以内）回答：\n{personalized_prompt}"else:prompt = personalized_promptelse:prompt = f"{query}"print("\n============= not_chat_prompt ===============\n")print(prompt)response, _ = p_model.chat(tokenizer, prompt, history=history, top_p=1, temperature=0.01)if is_chat == "1":message_id = store_message(session_id, 'system', response)  # 存储消息并返回消息IDreturn response, session_id, message_idreturn response

前端

由于前端代码太多，只截取部分代码展示。

async sendMessage() {if (this.userInput.trim() !== '' && !this.isTyping) {// 检查是否需要自动选择详细版if (this.showChoice) {await this.autoChooseDetailed(); // 等待自动选择详细版完成}this.messageList.push({role: 'user',content: this.userInput,avatar: 'https://xxx/avatar.png'});const query = this.userInput;this.userInput = '';// 添加ChatGPT的占位消息const loadingMessage = {role: 'chatgpt',content: '',avatar: 'https://xxx/chatai-avatar.png',isLoading: true};this.messageList.push(loadingMessage);this.handleScrollTop(); // 确保视图滚动到底部let that = this;this.isTyping = true;uni.request({url: 'https://xxx/chat',method: 'POST',data: { query, history: this.history, user_id: this.userId, session_id: this.currentSessionId },header: {'Content-Type': 'application/json',},success: function (resp) {that.currentSessionId = resp.data.session_id;const index = that.messageList.indexOf(loadingMessage);if (index !== -1) {that.messageList.splice(index, 1); // 删除占位消息if (resp.data.detailed_response && resp.data.concise_response) {// 第四次对话，展示两个回答框that.conciseResponse = resp.data.concise_response;that.detailedResponse = resp.data.detailed_response;that.showChoice = true; // 设置 showChoice 为 trueconsole.log("showChoice")console.log(that.showChoice)// 插入提示语that.messageList.push({role: 'system',content: '请选择您更喜欢哪种回答？',avatar: '',isTypingComplete: true,responseType: 'prompt'});// 分别为精简版和详细版添加打字机效果that.addTypingEffect('ChatGLM3-6B', resp.data.concise_response, resp.data.concise_message_id, 'concise', true);that.addTypingEffect('ChatGLM3-6B', resp.data.detailed_response, resp.data.detailed_message_id, 'detailed', false);} else {that.addTypingEffect('ChatGLM3-6B', resp.data.response, resp.data.message_id);}}that.history.push({ role: 'user', content: query });if (that.history.filter(msg => msg.role === 'user').length === 1 || that.history.filter(msg => msg.role === 'user').length === 3) {that.refreshSessionList();}},fail: function (error) {console.error('Error sending message:', error);},complete: function() {that.isTyping = false;}});}},addTypingEffect(user, text, messageId, responseType = null, showAvatar = true) {if (!text) {console.error('Error: text is undefined or empty');return;}let index = 0;const message = { role: 'chatgpt',content: '',avatar: showAvatar ? 'https://xxx/chatai-avatar.png' : 'https://xxx/0b46f21fbe096b63d30f4b590d338744ebf8aca0.png',id: messageId,isLoading: false,isTypingComplete: false, // 新变量，初始化为 falseresponseType: responseType // 添加 responseType};this.messageList.push(message);const typing = setInterval(() => {if (index < text.length) {message.content += text[index];index++;this.handleScrollTop().catch((error) => {console.warn('Error while scrolling:', error);});} else {clearInterval(typing);this.history.push({ role: 'assistant', content: text });message.isLoading = false; // 设置为不再加载this.$set(message, 'isTypingComplete', true); // 打字机效果完成后设置为 truethis.handleScrollTop().catch((error) => {console.warn('Error while scrolling:', error);}); // 确保滚动到最底部}}, this.typingInterval);},

效果展示

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/pingmian/34722.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

【ARM】MDK自动备份源文件

【ARM】MDK自动备份源文件

【更多软件使用问题请点击亿道电子官方网站】 1、 文档目标 解决MDK在编写文档的时候需要找回上一版代码的问题。 2、 问题场景 目前大部分情况下对于源代码的管理都是使用的Git等第三方的代码管理平台。这样的第三方代码管理平台都是针对与代码的版本更新进行管理。对于本地…
阅读更多...
2024年6月上半月30篇大语言模型的论文推荐

2024年6月上半月30篇大语言模型的论文推荐

大语言模型&#xff08;LLMs&#xff09;在近年来取得了快速发展。本文总结了2024年6月上半月发布的一些最重要的LLM论文&#xff0c;可以让你及时了解最新进展。 LLM进展与基准测试 1、WildBench: Benchmarking LLMs with Challenging Tasks from Real Users in the Wild Wi…
阅读更多...
数字心动+华为运动健康服务 使用体验指导

数字心动+华为运动健康服务 使用体验指导

一、应用介绍 “数字心动”是一个体育生态平台APP&#xff0c;践行“体育大健康娱乐数字营销”模式&#xff0c;打造深度融合体育平台。APP集跑步运动记录、赛事活动报名、成绩/大众等级证书查询等多功能于一体&#xff0c;采取“线上线下”模式&#xff0c;结合协会、行业、品…
阅读更多...
【CT】LeetCode手撕—56. 合并区间

【CT】LeetCode手撕—56. 合并区间

目录 题目1- 思路2- 实现⭐56. 合并区间——题解思路 3- ACM 实现 题目 原题连接&#xff1a;56. 合并区间 1- 思路 模式识别&#xff1a;合并区间 ——> 数组先排序 思路 1.先对数组内容进行排序 ——> 定义 left、right 根据排序后的结果&#xff0c;更新 right2.遍…
阅读更多...
高性能的多媒体播放器（提供补帧功能）

高性能的多媒体播放器（提供补帧功能）

一、简介 1、一款高性能的多媒体播放器&#xff0c;支持几乎所有主流和部分罕见的音视频格式。无需额外安装coder插件&#xff0c;即可顺利播放各种媒体文件。此外&#xff0c;它还提供补帧功能&#xff0c;显著提升了视频播放的流畅性和视觉效果 二、下载 1、文末有下载链接,不…
阅读更多...
Shopee API接口：一键获取商品买家评论数据，赋能电商运营新智慧

Shopee API接口：一键获取商品买家评论数据，赋能电商运营新智慧

一、核心功能介绍——一键获取商品买家评论数据 在电商领域&#xff0c;买家评论是反映商品质量和市场反馈的重要指标。为了帮助商家更好地了解买家需求&#xff0c;优化产品和服务&#xff0c;Shopee接口特别推出了获取商品买家评论数据的功能。以下是该功能的核心介绍&#…
阅读更多...
数据库设计文档编写

数据库设计文档编写

PS&#xff1a;建议使用第三种方法 方法1&#xff1a;使用 Navicat 生成数据库设计文档 效果 先看简单的效果图&#xff0c;如果效果合适&#xff0c;大家在进行测试使用&#xff0c;不合适直接撤退&#xff0c;也不浪费时间。 随后在docx文档中生成目标字段的表格&#xf…
阅读更多...
人工智能赋能数据资产分析：借助先进的人工智能技术，优化数据处理流程，显著提升数据资产分析的准确性和效率，为企业决策提供强大支撑，推动业务快速发展

人工智能赋能数据资产分析：借助先进的人工智能技术，优化数据处理流程，显著提升数据资产分析的准确性和效率，为企业决策提供强大支撑，推动业务快速发展

一、引言 在数字化浪潮席卷全球的今天&#xff0c;数据已经成为企业最宝贵的资产之一。如何有效地分析这些数据&#xff0c;挖掘其中的价值&#xff0c;为企业决策提供有力支持&#xff0c;是每个企业都面临的挑战。近年来&#xff0c;人工智能技术的快速发展&#xff0c;为数…
阅读更多...
【面试干货】Java中的++操作符与线程安全性

【面试干货】Java中的++操作符与线程安全性

【面试干货】Java中的操作符与线程安全性 1、什么是线程安全性&#xff1f;2、 操作符的工作原理3、 操作符与线程安全性4、如何确保线程安全&#xff1f;5、 结论 &#x1f496;The Begin&#x1f496;点点关注&#xff0c;收藏不迷路&#x1f496; 在Java编程中&#xff0c;操…
阅读更多...
Java 8新特性全面解读

Java 8新特性全面解读

Java 8新特性全面解读 大家好&#xff0c;我是免费搭建查券返利机器人省钱赚佣金就用微赚淘客系统3.0的小编&#xff0c;也是冬天不穿秋裤&#xff0c;天冷也要风度的程序猿&#xff01; Java 8引入了许多令人兴奋的新特性&#xff0c;为开发者提供了更强大的工具和更高效的编…
阅读更多...
非遗！四川省21市非遗大师工作室申报认定条件程序和认定补贴经费支持（管理办法）

非遗！四川省21市非遗大师工作室申报认定条件程序和认定补贴经费支持（管理办法）

第一章总则 第一条贯彻落实中共中央办公厅、国务院办公厅《关于进一步加强非物质文化遗产保护工作的意见》&#xff08;厅字〔2021〕31号&#xff09;、四川省文化和旅游厅等12部门《关于进一步加强非物质文化遗产保护工作的实施意见》&#xff08;川文旅发〔2022〕25号&#…
阅读更多...
SpringCloud是什么？它解决了什么问题？

SpringCloud是什么？它解决了什么问题？

Spring Cloud是一个基于Spring Boot提供的一系列框架的集合&#xff0c;它利用Spring Boot的开发便利性简化了分布式系统&#xff08;例如微服务架构下的应用程序&#xff09;的开发。Spring Cloud为开发者提供了在分布式系统中快速实现和采用模式&#xff08;pattern&#xff…
阅读更多...
Kendryte K210 固件烧录

Kendryte K210 固件烧录

本章将为读者介绍 Kendryte K210 的固件烧录&#xff0c;以及 Kendryte K210 外部 NOR Flash 的空间 分布。 本章分为如下几个小节&#xff1a; 6.1 外部 NOR Flash 的空间分布 6.2 Ubuntu 下的固件烧录 6.3 Windows 下的固件烧录 外部 NOR Flash 的空间分布 Kendryte K210 的…
阅读更多...
Python信息处理问题精选及参考答案

Python信息处理问题精选及参考答案

目录 使用MATLAB或Python实现一个简单的FIR滤波器&#xff0c;并测试其性能。 介绍一个常用的信号处理库&#xff08;如SciPy, OpenCV等&#xff09;&#xff0c;并演示其在特定问题上的应用。 使用Simulink搭建一个数字通信系统的模型&#xff0c;并分析其性能指标。 实现…
阅读更多...
mac 常用工具快捷键集合

mac 常用工具快捷键集合

一、vim 快捷键 1、移动光标 h j k l 左 下 上 右 箭头上 上移一行 箭头下 下移一行 0 跳至行首&#xff0c;不管有无缩进&#xff0c;就是跳到第0个字符 ^ 跳至行首的第一个字符 $ 跳至行尾 gg 跳至文首 G 调至文尾 5gg/5G 调至第5行w 跳到下一个字首&#xff0c;按标点或…
阅读更多...
51单片机最火型号大比拼：性能、应用与选型指南

51单片机最火型号大比拼：性能、应用与选型指南

51单片机作为经典的微控制器架构&#xff0c;凭借其易于学习、价格低廉、应用广泛等优势&#xff0c;一直活跃在嵌入式开发领域。面对市场上琳琅满目的51单片机型号&#xff0c;初学者和开发者常常感到眼花缭乱。本文将对几款最火的51单片机型号进行深度剖析&#xff0c;从性能…
阅读更多...
蓝牙透传芯片TD5322A，低功耗ble芯片，蓝牙电表通信方案介绍—拓达半导体

蓝牙透传芯片TD5322A，低功耗ble芯片，蓝牙电表通信方案介绍—拓达半导体

蓝牙透传芯片TD5322A芯片是一款支持蓝牙BLE的纯数传芯片&#xff0c; 蓝牙5.1版本。芯片的亮点在尺寸小&#xff08; SOP-8封装&#xff09;、主从切换、性能强、 性价比高。以及简单明了的透传和串口 AT 控制功能。大大降低了嵌入蓝牙在其它产品的开发难度和成本。 蓝牙透传芯…
阅读更多...
中国 AGI 市场—4543 亿市场下的新机会

中国 AGI 市场—4543 亿市场下的新机会

前言 我们正站在一个全新智能纪元的路口&#xff0c;围绕通用人工智能&#xff08;AGI&#xff09;&#xff0c;在学术界、科技界、产业界的讨论中&#xff0c;一部分 AGI 的神秘面纱已被揭开&#xff0c;但这面纱之后还有更多的未知等待着我们。 InfoQ 研究中心在此背景下&a…
阅读更多...
LabVIEW高精度电能质量监测系统

LabVIEW高精度电能质量监测系统

LabVIEW和研华采集卡的高精度电能质量监测系统利用虚拟仪器技术&#xff0c;实时监测电能质量的关键指标&#xff0c;如三相电压、频率和谐波。通过提高监测精度和效率&#xff0c;改善电网的电能质量。系 一、系统背景 电能作为现代社会的关键能源&#xff0c;其质量直接影响…
阅读更多...
Casaos之qittorrent设置（没有账号密码）

Casaos之qittorrent设置（没有账号密码）

点击安装只有没有账号密码&#xff0c;只能从运行日志中找密码&#xff1a; # 查看container docker ps -a # 查看container日志 docker logs ae15cb90afbd 进入系统 最下方&#xff0c;保存。
阅读更多...
最新文章

Copyright @ 2022~2023