Vue+Flask实现一个最基础的LLM请求响应以及渲染

后端请求 后端封装 from abc import ABC, abstractmethod from openai import OpenAI import config class BaseAIService(ABC): """AI服务的抽象基类""" @abstractmethod def get_stream_completion(self, messages): """获取流式响应""" pass @abstractmethod async def process_stream_response(self, response): """处理流式响应""" pass class HuoShanAIService(BaseAIService): """火山引擎 AI 服务实现""" def __init__(self): self.config = config.HUO_SHAN_COMPLETION_CONFIG self.client = OpenAI( api_key=self.config["api_key"], base_url=self.config["base_url"] ) def get_stream_completion(self, messages): """获取流式响应""" return self.client.chat.completions.create( model=self.config["fast_llm"], messages=messages, temperature=0.3, top_p=1, max_tokens=8192, stream=True ) async def process_stream_response(self, response): """处理流式响应""" reasoning_content = "" answer_content = "" is_answering = False try: for chunk in response: try: if not chunk.choices or not chunk.choices[0].delta: continue delta = chunk.choices[0].delta # 处理思考过程 if hasattr(delta, 'reasoning_content') and delta.reasoning_content: reasoning_text = delta.reasoning_content print(reasoning_text, end='', flush=True) reasoning_content += reasoning_text yield f"__r__{reasoning_text}".encode('utf-8', errors='ignore') # 处理回复内容 elif hasattr(delta, 'content') and delta.content: if not is_answering: print("\n" + "=" * 20 + "完整回复" + "=" * 20 + "\n") is_answering = True content_text = delta.content print(content_text, end='', flush=True) answer_content += content_text yield f"__a__{content_text}".encode('utf-8', errors='ignore') except UnicodeEncodeError as e: print(f"Encoding error: {e}") continue except Exception as e: print(f"Error processing chunk: {e}") yield f"__a__处理响应时发生错误: {str(e)}".encode('utf-8', errors='ignore') except Exception as e: print(f"Stream processing error: {e}") yield f"__a__处理流式响应时发生错误: {str(e)}".encode('utf-8', errors='ignore') def get_ai_service(provider="huoshan"): """工厂函数,根据提供商返回对应的 AI 服务实例""" providers = { "huoshan": HuoShanAIService, # 未来可以添加其他提供商 # "openai": OpenAIService, # "azure": AzureAIService, } service_class = providers.get(provider) if not service_class: raise ValueError(f"不支持的 AI 提供商: {provider}") return service_class() 调用并且返回值 ...

2025-03-28 · 3 min · 1209 words · Waite Wang

Vue 实现公历,农历日期选择效果

在开发过程中,我们经常需要实现日期选择功能,而有时用户可能希望使用农历日期进行选择。本文将介绍如何使用 Vue 实现一个支持公历和农历选择的日期选择器。 ...

2025-03-22 · 5 min · 2240 words · Waite Wang

单例模式以及事件管理器在 Cocos 中的应用

单例模式 单例模式是设计模式中最常用的模式之一,它确保一个类只有一个实例,并提供一个全局访问点。在游戏开发中,单例模式尤其有用,因为它能够有效地管理全局资源和状态。 ...

2025-03-13 · 3 min · 1110 words · Waite Wang

Cursor 无限续杯方案

参考地址: https://github.com/chengazhen/cursor-auto-free 在本篇文章开始之前,确保你已经安装好了 Cursor[https://www.cursor.com/] 本篇文章主要介绍 cursor-auto-free这个项目的使用。 源代码构建或者下载执行文件 我们可以通过 git clone 命令来下载源代码,或者直接在 Release 页面下载已经构建好的执行文件。 ...

2025-01-12 · 4 min · 1592 words · Waite Wang

博客迁移小记

前言 嘿,大家好!我一直觉得拥有一个个人博客是件很酷的事情。它不仅是一个记录学习心得和分享技术经验的地方,更是一个展示自我的平台。在这篇文章中,我想和大家分享一下我在博客迁移过程中的心路历程。从最初的 Hexo 到现在的 Hugo,中间我还尝试了 Typecho、VitePress、WordPress 和 Halo。每一次迁移都让我对博客系统有了更深的理解。 ...

2024-12-28 · 4 min · 1856 words · Waite Wang

使用Cursor+DevBox 从零创建一个 TodeList 网页应用

Devbox 地址:https://cloud.sealos.run/?uid=Kt1gH3_BTa Cursor 地址: https://www.cursor.com/settings Cursor 规则文档: https://cursorrules.cursorauto.me/ 创建数据库和初始项目 我们这里创建一个 MongoDB 数据库 ...

2024-12-27 · 3 min · 1497 words

Http 基础

HTTP [HTTP ](#http) 一 、基础概念 请求和响应报文 URL 二、HTTP 方法 GET HEAD POST PUT PATCH DELETE OPTIONS CONNECT TRACE 三、HTTP 状态码 1XX 信息 2XX 成功 3XX 重定向 4XX 客户端错误 5XX 服务器错误 四、HTTP 首部 ...

2024-10-23 · 20 min · 9816 words

静态文档 Github 自动同步服务器

Vuepress 或部分静态文档自动同步服务器 使用 Github action 加服务器 git commit hash 匹配 本文以 Vuepress 为例子, 其他同理 请确保 服务器 安装 git 环境, 本文不再赘述 Github Action 原理: 通过 Github Action 工作流把代码编译并且部署到 gh_pages 分支 ...

2024-06-28 · 4 min · 1620 words