让 ChatGPT 更智能,Tauri 带你实现 AI 对话应用

背景

Tauri 和 Electron 都是用于开发跨平台桌面应用程序的工具,因为最近使用ChatGPT在国内环境的确不够友好,又没有一个比较轻量简洁的工具可用,如是想自己造个轻量点的轮子,力争做到代码轻量,界面美观简洁,打出的安装包小,请求ChatGPT速度快,会话安全,不被封号。

ChatGPT box

主要实现功能:

  • 管理会话的能力
  • 可以和ChatGPT实现多轮次对话
  • 使用代理功能,方便没有梯子的童鞋
  • 自定义主题,避免视觉疲劳
  • 流式响应,这样可以很快速的得到响应,不用等太久
  • 会话存储本地,避免丢失
  • 代码着色功能

那么,既然决定要搞一个轻量版本的桌面端App,势必就需要做一些选型对比,目前开发桌面端大家可能比较熟悉的跨平台方案是Electron,但实际上,近年也出现了一个Tauri,隐隐有取Electron而代之的趋势,我们不妨来看看两者的优劣势,前期做好选型,在动手开始实施也不迟。

以下是 Tauri 和 Electron 的优劣势对比:

Tauri 的优势

  1. 更轻量级:相较于 Electron 更小巧,更快速,启动时间更短,占用资源更少。
  2. 安全性高:使用 Rust 语言编写程序,拥有内存安全、线程安全等多项安全保障措施。
  3. 可配置性强:Tauri 支持自定义界面和操作方式,开发者可以根据需要进行任意定制。
  4. 支持多窗口管理:Tauri 具有完善的多窗口管理机制,可以方便地创建、控制多个窗口。
  5. 跨平台支持广泛:Tauri 支持在 Linux、Windows 和 macOS 等主流操作系统下运行。

Tauri 的劣势

  1. 生态还不够完善:相比于 Electron,Tauri 目前还是一个较新的框架,其社区和生态还在逐步建设中。
  2. 开发学习曲线相对较陡:由于 Tauri 基于 Rust 编写,因此开发者需要具备一定的 Rust 编程基础才能上手开发,但是如果不设计到过多的和操作系统交互的话,基本不用管Rust

Electron 的优势

  1. 生态完善:Electron 有着非常庞大的社区,具备许多成熟、稳定的插件和库,可以快速构建应用。
  2. 学习曲线相对较平缓:相比于 Tauri,基于 JavaScript / TypeScript 语言编写的 Electron 让开发者更容易上手,便于迭代和更新。
  3. 调试方便:Electron 具备调试工具和插件,可以方便地进行调试、性能优化等操作。
  4. 开发者资源丰富:由于 Electron 应用广泛,因此可以接触到更多的开发者和资源。

Electron 的劣势

  1. 性能问题:由于 Electron 本质上是一个浏览器环境,因此在性能方面存在一定程度的局限性。
  2. 安全性存疑:由于 Electron 基于 Chromium 核心,可能存在某些漏洞和安全问题,你编译的代码对别人来说是透明的,不同于Rust,你可以将不便于透露的或者设计商业机密的代码打包到二进制文件中,在通过一些安全手段加密,防止被别人轻而易举拿到你的实现细节
  3. 内存占用较高:由于 Electron 运行时需要加载 Chromium 内核和其他依赖项,因此占用内存较高。

因此,我们可以看出,Tauri 的轻量、安全、可定制、跨平台支持是其优势,虽然Rust学习曲线陡峭,但是我们实现的ChatGPT聊天工具基本上不太涉及与操作系统的过多交互,充其量,我们的会话保存可以在Rust上实现,存储在sqlite 中,我保证这部分代码非常易懂,只需要了解最最基础的Rust语法就可以明白。

功能效果展示

如下图所示,我们可以在这个对话App中直接问ChatGPT相关问题,有代码着色功能,在设置中:可以配置

  • 主题
  • 代理
  • API key
  • 是否使用流式响应

实现细节

流式响应实现

直接使用浏览器fetch API来请求,注意,不要使用axios来请求,该库不支持浏览器上的流式响应,但是支持node端流式响应,可能有人会问会不会跨域,我按照一些参考文章上介绍的配置src-tauri/tauri.conf.json

 "tauri": {"allowlist": {"all": true,"http": {"scope": ["http://**", "https://**"]},"shell": {"all": false,"open": true}},

复制

这样的方式,发现没有跨域。支持流式响应的主要逻辑就是

fetch(url, {headers,method: "POST",body: JSON.stringify(data),}).then((response) => {if (response.ok) {const reader = response.body!.getReader();pump(reader);}});let finalResult = "";function pump(reader: any) {reader.read().then(({ value, done }: ReadResult) => {if (done) {return;}const text = decoder.decode(value);const lines = text.split("\n");for (const line of lines) {if (line.length > 0) {//去掉前面的 data: 和后面的换行符const json = line.substring(6).trim();if (json === "[DONE]") {onResponse(finalResult);break;}const result: openai.CreateChatCompletionDeltaResponse =JSON.parse(json);finalResult += result.choices[0]?.delta.content || "";onData(finalResult);}}pump(reader);});}} catch (err: any) {onError(new Error(err));}

复制

这样做的主要目的就是为了可以快速看到响应,而不是等ChatGPT全部生成完毕才看到回答结果,ChatGPT就是一个生成式大预言模型,这个机制决定了他的答案是一部分一部分生成的,如果不选择流式响应,需要等待很久才可以看到完整答复。

会话记录存储

会话记录存储在sqlite当中,做么做的目的主要是先拿Rust练练手,得到的好处是性能会比较好点,会话存储读取速度都比较快,实现细节在src-tauri/src/session.rs 文件中,其实代码不难理解。你会发现无非就是SQL语句的Rust封装而已,增删改查逻辑做完之后,就可以通过main.rs 中的 #[tauri::command],暴露给到js去调用了。

fn main() {let db = Database::new("database.db").expect("Unable to create database connection");let app_state = AppState::new(Mutex::new(db));tauri::Builder::default().invoke_handler(tauri::generate_handler![greet,create_session,get_all_sessions,delete_session,update_session,add_message,delete_message,get_all_messages]).manage(app_state).run(tauri::generate_context!()).expect("error while running tauri application");
}

复制

这里是暴露的一些方法。在js中调用,我使用了repository封装去交互,尽量不要让页面耦合这些逻辑。可以看看src/repository/session.ts里面的实现。如添加一个新的会话

// 添加一个新会话async createSession(name: string): Promise<Session> {// Learn more about Tauri commands at https://tauri.app/v1/guides/features/commandconst result: Session = await invoke("create_session", {name,});return result;}

复制

可以通过DB Browser for SQLite工具来查看数据,也可以在里面写sql去查询。

配置页面

UI 组件库

界面整体UI使用vuetifyjs实现的。

Vuetify — A Vue Component Framework 是一个基于 Vue.js 的 Material Design 组件框架,它提供了一系列高质量、易用的 UI 组件,包括按钮、卡片、表格、表单、图标等,可以帮助开发者快速构建出美观、高效的 Web 应用程序。关键是在移动设备上也有很好的兼容性。

与其他的组件框架相比,Vuetify.js 更加注重对 Material Design 概念的实现,通过在组件之间保持一致的视觉设计和交互方式,让 Vue.js 开发者可以更加方便地使用 Material Design 风格的UI组件。同时,Vuetify.js 还提供了丰富的主题定制选项,可以根据自己的需求进行风格定制。

Material Design 是我选择这个组件库的主要原因,太省心了,基本上拼凑一下就可以完成一个页面,而我们只需要关注业务逻辑部分。

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

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

相关文章

[AI达人特训营第三期] 使用Lora技术用Dreambooth训练国潮风格模型

★★★ 本文源自AlStudio社区精品项目&#xff0c;【点击此处】查看更多精品内容 >>> DreamBooth 介绍 DreamBooth: Fine Tuning Text-to-Image Diffusion Models for Subject-Driven Generation是一种新的文本生成图像(text2image)的“个性化”&#xff08;可适应用…

【社群运营】AI智能对话,打造自动化社群

人工智能大背景下&#xff0c;各行各业都在往智能化发展&#xff0c;无论是办公产品&#xff0c;还是生产器械都选择接入了更加智能的AI来提高生产效率。那么&#xff0c;在日常的社群管理工作中&#xff0c;我们又能否跟上这一波热度&#xff0c;让社群自动化高效运营&#xf…

夏杰语音麦克精灵:智能语音交互升级新体验

对于很多人来说&#xff0c;通过语音声控电视、空调等家电已经不再陌生。 “你好小智&#xff0c;我想听音乐”、“你好小智&#xff0c;播放深圳卫视”……近几年&#xff0c;“小智”逐渐被人认识。是的&#xff0c;它是夏杰语音旗下的一款智能精灵——麦克精灵。它不仅可以…

跟着我学 AI丨ChatGPT 详解

随着人工智能的发展&#xff0c;聊天机器人成为了一个备受关注的领域。而ChatGPT作为其中的佼佼者&#xff0c;其功能和技术水平也越来越受到人们的关注。那么&#xff0c;什么是ChatGPT&#xff1f;它又有哪些优点和限制呢&#xff1f; ChatGPT是一款基于自然语言处理技术开发…

小红书内容种草,曝光渠道分析总结

这是一个内容为王的时代&#xff0c;也是一个内容爆炸的时代。想要在以分享特色的小红书平台&#xff0c;实现内容种草&#xff0c;迅速出圈。今天来马文化传媒就从实操的角度&#xff0c;为大家带来小红书内容种草&#xff0c;曝光渠道分析总结的各种干货&#xff01; 一、什…

小红书达人账号数据分析

文章目录 一、项目背景二、数据预处理1、查看数据2、数据清洗2.1对达人列表进行清洗2.2对涨分榜进行清洗2.3对MCN列表进行清洗2.4对定性变量&#xff08;分类变量&#xff09;进行处理 3、表格处理3.1合并达人列表和涨粉榜 三、分析与数据可视化1、对达人列表进行相关性分析2、…

小红书账号分析丨千瓜指数高的小红书账号是否真的优质?

关键词&#xff1a;千瓜指数、小红书数据、小红书账号分析 达人账号质量是否优质从多个维度衡量&#xff0c;千瓜指数能够客观综合评价达人账号的质量&#xff0c;给到小红书达人一定的参考价值。 那么千瓜指数能够帮助达人什么&#xff1f; 品牌筛选达人会选择更优质的&#x…

GPT逆向:高效解读小红书文案生成器的内部逻辑

文章目录 前言一、什么是小红书文案生成器二、具体步骤总结 前言 关注我的很多同学都会写爬虫。但如果想把爬虫写得好&#xff0c;那一定要掌握一些逆向技术&#xff0c;对网页的JavaScript和安卓App进行逆向&#xff0c;从而突破签名或者绕过反爬虫限制。 最近半年&#xff…

小红书爆款笔记运营攻略

小红书爆款笔记运营攻略 2020-04-14 挖塘人 来源 审核中 修改 现在可以看到很多人手机里有款叫小红书的软件&#xff0c;它致力于打造聚焦生活方式的内容社区&#xff0c;并且凭借“万物皆可种草”红极一时&#xff0c;吸引着一大批年轻用户。 根据官方数据&#xff0c;截…

小红书近期发展动态---预言专家

总结为5件大事情&#xff1a; 事件1&#xff1a;为期三个月打击侵权行动----6月持续到9月 双月计划----清扫爬虫 事件2&#xff1a;APP接口风控提高-----持续 事件3&#xff1a;web端进行摸排升级改版-----7月 事件4&#xff1a;APP增加unidbg|unicorn检测对抗 ----最近一个月内…

教培行业如何在小红书推广 教育机构红书推广上海氖天

品牌打造在教育机构营销中占有重要地位。提升小红书中品牌知名度&#xff0c;需尽量彰显教育机构独特魅力与卓越实力。小红书给教育行业带来新的推广途径&#xff0c;可以把品牌打造的更形象、更简洁&#xff0c;另外用户粘性大、转化率高。接下来&#xff0c;这篇文章就来具体…

小红书4大主要人群的消费特征,你占了几个?

数据显示90%的小红书用户在购买前有过搜索小红书的行为。社交媒体时代&#xff0c;人货场被重新定义&#xff0c;更加多元的消费需求涌现&#xff0c;通过洞察“人”&#xff0c;我们找到了小红书4大主要人群的消费特征&#xff0c;供大家参考。 TA洞察 重塑“人货场” 传统…

小红书话题笔记是什么意思?小红书话题的形式有哪些?

相信很多小红书用户总会看到别人发布小红书话题笔记&#xff0c;或者自己也经常参与其中&#xff0c;但究竟小红书话题笔记是什么意思&#xff1f;今天让我们为大家分享一下。 一&#xff0e;小红书话题笔记是什么意思 小红书话题笔记是平台开发的一种内容创作功能&#xff0c…

小红书账号分析丨小红书kol速成干货分享

导语&#xff1a;很多萌新小白在刚运营小红书时动力满满&#xff0c;坚持一段时间后&#xff0c;开始愁选题愁数据&#xff0c;最后不了了之。普通人和专业博主&#xff0c;差距真的很大吗&#xff1f;NO&#xff01;只要持续不断地努力输出专业运营知识的学习&#xff0c;从素…

小红书7W粉丝美女大V被盗号了,前来咨询乔戈里,封面就是她

众所周知&#xff0c;乔戈里分手了&#xff0c;现在重心放到公众号上&#xff08;说得好像你有女朋友给你放重心似的呢&#xff09;&#xff0c;对于粉丝的求助会尽量尽力去帮助大家&#xff0c;这位粉丝是乔戈里的知识星球的球友&#xff0c;毕竟乔哥时间有限&#xff0c;对于…

Beyond One-Model-Fits-All: A Survey of Domain Specialization for Large Language Models

大模型系列文章&#xff0c;针对《Beyond One-Model-Fits-All: A Survey of Domain Specialization for Large Language Models》的翻译。 超越一个模型适合所有&#xff1a;大型语言模型领域专业化综述 摘要1 引言1.1 相关综述 2 领域专业的分类2.1 背景2.2 领域专业的技术分…

“欠缺逻辑”的诺奖得主:我有更好的直觉

文 | 孙滔 王兆昱 作为乔治帕里西&#xff08;Giorgio Parisi&#xff09;的第一个博士生&#xff0c;张翼成至今也无法跟上导师的思维&#xff0c;尽管他自1981年跟随帕里西学习和工作有累计达8年的时间。 74岁的帕里西因发现了从原子到行星尺度的物理系统紊乱和波动的相互作用…

推特爆火!揭晓大模型的未来何去何从

文 | 智商掉了一地 巨大挑战 or 发展契机&#xff0c;ChatGPT 和 GPT-4 出现后&#xff0c;大模型的未来方向该何去何从&#xff1f; 近期&#xff0c;自然语言处理领域的快速发展引起了广泛的关注&#xff0c;尤其是大型语言模型&#xff08;LLM&#xff09;的兴起已经推动了该…

8个超好用的 AI 科研写作工具

近年来人工智能语言模型快速发展&#xff0c;尤其是当美国人工智能研究实验室 OpenAI 于2022年11月发布了聊天机器人ChatGPT&#xff0c;随之更是引爆了全世界的舆论&#xff0c;人们惊呼一个新的人工智能时代已经到来&#xff0c;很多工作都将被这类机器人取代。本文暂不讨论这…

最新研究:人类道德判断可能会受ChatGPT的影响

根据《科学报告》发表的一项研究&#xff0c;人类对道德困境的反应可能会受到人工智能对话机器人ChatGPT所写陈述的影响。这一研究表明&#xff0c;用户可能低估了自己的道德判断受ChatGPT影响的程度。 德国英戈尔施塔特应用科学大学科学家让ChatGPT&#xff08;由人工智能语言…