手搓一个ChatUI须要分几步

只关注项目代码的同学可以直接跳转目录中的正文部门，查看项目仓库和功能先容。
引言

Chatbot的UI界面设计，是和传统软件不同的：都是当面一个简便的对话框，框里预备着热乎的工具，可以随时更新。

像我这样做工的牛马，午休傍晚下了班，每每花几个token，问一两句弱智吧的问题，——这是一年多前的事，如今一个问题都得设计个COT，——不用登录，在主页改改prompt，测完了就发群里刷一下存在感。
倘肯多费点心思，便可以问问3.11和3.9谁大，大概让姥姥念CD-Key哄你睡，姑且看成谈资了。如果充点真金白金，那就能获得一个API-Key，但我们这些牛马，多是白嫖党，大抵没有这样阔绰。只有公司报销的范畴专家，才能点进绑定支付方式的页面里，买这买那的，写个脚本直接调用API渐渐跑着测。

我从毕业起，就在IT通信行业当店员，父母和掌柜都说，不是e人，怕侍候不了VIP客户，就在组里开发开发后端。
公司内的stackholder，固然轻易说话，但是唠唠叨叨缠夹不清的也很不少。他们往往要亲眼看着代码跑起来，看过消息交互的抓包格式对了没有，又亲看将服务器整到shutdown，还能定时恢复，然后放心：在这严肃监督之下，出一点小问题也很为难。
所以过了几天，掌柜说这些活太简朴了，让去看看AI。幸亏大学里有点底子，也算对口，便改为既要开发后端，又要设计前端，还要兼顾AI算法和应用场景的奇怪职务了。

我从此便天天挂在Github上，看看有什么可以拿来用的App做个Demo。固然没什么失职，但是总觉有些单调。
有些App太臃肿，npm install跑完就带上了百口；
有些太简朴，没法适配微信群里一天更新三回的模子和后端框架。
只有最后狠下心来自己悄悄写一个，取个名就叫Chat-UI，算是勉强满意，所以来说说。
https://github.com/AI-QL/chat-ui

https://github.com/AI-QL/chat-ui
Chat-UI是不须要npm install和run time就能运行的，只需唯一的html单文件。
它身材很小巧；蓝白配色，底部夹杂着一些mdi图标；只有简朴的light主题。
用的固然是VUE，可是只用CDN引入了JS库，简朴快捷，而且都是latest版本，好像不用更新，也不用安装。

1.     <script src="https://cdn.jsdelivr.org/npm/vue/dist/vue.global.prod.min.js"></script>
2.     <script src="https://cdn.jsdelivr.org/npm/vuetify/dist/vuetify.js"></script>
3.     <link href="https://cdn.jsdelivr.org/npm/vuetify/dist/vuetify.css" rel="stylesheet">

复制代码

LLM对人说话，总是满口markdown，教人半懂不懂的。又由于我自己前端开发履历不外关，便直接引入了md-editor-v3，替我可视化markdown。

fetch回来的JSON body刚收到，全部的组件就都看着它笑，有的叫道，
“OpenAI，你又增加新的限制区域了！”它不回复，只是吐出一行，“Fail to fetch XXX”便不再多言。
他们又故意的高声嚷道，“Nidia NIM 都免费提供 Llama 405B 了！”

OpenAI睁大眼睛说，“哪有什么免费的...”
“就是免费的，只要注册时间额外申请一下免费token就行了，恣意用。”
OpenAI便涨红了脸，额上的青筋条条绽出，争辩道，“那也是有数量上限的，而且不支持跨域，跨域你懂吗？”接连便是难明的话，什么“CORS”， 什么“Allow Headers”之类，
引得众后端都哄笑起来：那我再开发一个Proxy不就搞定了吗，workflow内充满了开源的空气。
简朴小巧的OpenAI API访问：一键部署，轻松上手-CSDN博客文章浏览阅读1.6k次，点赞62次，收藏16次。OpenAI Proxy Docker项目不仅简朴小巧，而且易于上手。通过利用最新的Bun运行时，你可以在保持高性能的同时，得到可靠的代理服务解决方案。

https://blog.csdn.net/aiqlcom/article/details/144684140
听人家背地里谈论，OpenAI原来也免费送过5刀的token，但没有境外手机号，又不会绑境外信用卡；于是愈用愈少，弄到将要过期了。幸而开源vllm跑得一手好模子，便换一个模子当后端用用。
可惜OpenAI又感染的一样坏性情，就是API版本控制。坐不到几天，便连JSON和界说，一齐更新了。如是频频，没有办法，便免不了再开发一个API UI，偶然查看一下最新格式。
https://api-ui.aiql.com/ 第一次登陆比较慢，可以下载html修改CDN

https://api-ui.aiql.com/
但是OpenAI在我们这里，操行比别家都好，格式支持的最全，报错最详细；固然间或没有在文档里更新，临时记在Issue里，但不出一月，定然修复，从Issue里done掉了名字。

OpenAI融了几次资，涨红的股价渐渐走了高，旁人便又问道，“OpenAI，AGI当真有出路么”，OpenAI看着问他的人，显出不屑置辩的神情。
他们便接着说道，“你怎的连半个开源的模子也没有呢?”OpenAI立即显出颓唐不安模样，脸上笼上了一层灰色，嘴里说些话；这回可是全是金鍂鑫