Chatbox AI|程序员救星!一个API调用GPT、Claude、deepseek等多个大模型!

Chatbox AI|程序员救星!一个API调用GPT、Claude、deepseek等多个大模型!
Chatbox AI 是一款 AI 客户端应用和智能助手,支持众多先进的 AI 模型和 API,可在 Windows、MacOS、Android、iOS、Linux 和网页版上使用。
Chatbox AI体验地址:全平台AI,办公学习的AI好助手
在这里插入图片描述


目录

Chatbox AI代码生成体验

对于一名开发人员来说,首先要体验Chatbox AI的功能就是代码生成。
博主对这个功能有两个方向期待,第一是代码生成的速度,第二个就是代码质量。

登录界面

最近博主正好想搭建一个小型后台管理系统,用的前端技术栈是Vue3+ElementPlus,
这里输入的内容是

prompt:使用vue3+elementplus,输出一则登录界面。
在这里插入图片描述


然后遵循着拿来即用的原则,出来的效果还是非常不错的,是博主想象中的效果,也至少比博主写的好,关键还写的快,还能给你完整代码以及实现过程。

在这里插入图片描述

审核流程

继续给Chatbox AI平台上难度。

再给我生成一个功能模块,关于审核流程的,能够动态设定审核节点和审核人

博主搭建的这个小型后台管理系统,希望能够有一个审核流程的模块功能,来看看Chatbox AI输出的效果。

在这里插入图片描述


输出的效果,显然是一段添加或者编辑审批流程的一个表单页面,此时,我们进一步再询问,让平台输出一个管理页面,点击界面的添加或者名称弹窗下面的表单。

在这里插入图片描述


在这里插入图片描述


短短几分钟就快速理解博主的意图,并生成了我觉得还不错的界面效果,有一点博主是可以肯定的,就是Chatbox AI至少对代码生成的理解程度会相对于其他通用型模型要高,我觉得应该是Chatbox AI本身有一定专项训练的原因有关,这也是Chatbox AI平台优势之一。

好了,体验体验了一把代码生成,下面就来逐一给大家介绍下Chatbox AI平台的功能吧。

一、Chatbox AI介绍

Chatbox AI体验地址:全平台AI,办公学习的AI好助手

1.1、基本信息

⼀款集多模型对话、AI绘画等功能于⼀体的全平台AI助⼿,功能非常的全,一个平台就能搞定和获得你想要的功能,再也不用到处切换平台了。

1.2、五大优势

下面列举的ChatboxAI五大优势就是通过ChatboAI平台进行优化后的Html效果。

在这里插入图片描述

1.集成主流模型
在⼀个应⽤⾥使⽤全部主流模型,如DeepSeek满⾎版、ChatGPT、Gemini、Claude、 Claude、grok等;

2.⽀持全平台
⽀持Windows、macOS、Linux以及移动平台,提供开箱即⽤的使⽤体验,⼀个 api ⽀持五个设备;

3.多功能集成
除了传统⽂本对话外,⽀持⽂档、图⽚、代码等多种类型的信息交互;

4.隐私与本地存储
⽤⼾数据主要存储在本地,确保个⼈隐私安全;

5.联⽹搜索与实时更新
集成联⽹搜索功能,帮助⽤⼾获取最新信息,满⾜办公、学习等场景的需求;

1.3、PC客户端

博主这里也下载了PC客户端体验,软件整体占的空间也不大,整个界面看着非常清爽,使用也非常简单和熟悉,也有实际例子,功能也非常全。

在这里插入图片描述

1.4、网页版

Chatbox AI同样支持网页版,非常方便,和客户端基本一样,博主比较建议下个客户端体验。

在这里插入图片描述

1.5、主要功能

以下是Chatbox主要功能的Markdown表格,包含功能名称、详细描述和对应的图标:

功能名称功能描述
与文档和图片聊天理解文档、图片和代码内容,提供智能响应以提高生产力和创造力
代码神器提供完整的编码辅助功能:
- 💡代码生成
- 👁️预览
- 🎨语法高亮
- 🔍代码审查
- 🔄重构
- 📚智能文档
- 🐞调试助手
- 🚀优化
- 🔒安全检查
实时联网搜索获取即时网络信息:
- 🌐联网搜索
- 📰最新新闻
- 📊即时数据
- 🔗URL分析
- 📑内容摘要
- ✓事实核查
图表可视化通过可视化工具阐明复杂概念、趋势和统计数据
AI图像生成将文字描述转化为图像:
- 无限创意
- 文本到图像转换
- 多种艺术风格
LaTeX/Markdown支持支持学术和技术内容创作:
- 📝学术写作
- ∑数学公式
- 🧬学术讨论
隐私与数据管理本地化数据存储方案:
- 🔒本地存储
- 💾数据备份
- 🔍历史搜索

二、

二、Chatbox AI功能体验

Chatbox AI提供文本对话和文生图两种类型模型选择,比如:

在这里插入图片描述


在这里插入图片描述

2.1、代码生成与预览

博主作为一名程序员,第一时间体验的功能就是代码生成了,毕竟这是和博主生活和工作息息相关的功能,博主有对比过好几个平台代码生成质量和速度,其实大多还不是很理想,这个应该是和他们客户端的输出有关,给我的感觉就是有点卡顿,这也是博主比较关心的一点,现在我们逐一体验下。

代码生成

输入基本信息,一键生成Html页面代码,比如:
从下图可以看出效果,响应效果直接就是秒出,输出的速度完全超出了我的期望,渲染效果也是非常流畅,看着就很舒服。

在这里插入图片描述

效果预览

博主这里是直接生成的Html代码,所以Chatbox平台是完全支持点击预览的,下面就是预览效果,这样可以提前查看效果。

如果没有达到自己想要的效果,那么是可以随时进行多轮询问,直到满意为主。

在这里插入图片描述

语法高亮

博主这里分别让Chatbox AI输出了一段Sql和C#代码,作为语法高亮的对比。
可能有些小伙伴对于语法高亮这个并没有太在意,其实这个语法高亮是非常有必要且能够快速让我们抓住重点以及系统关键词做一个很好的区分。

博主记得在刚开始的时候,自己有封装过一个前端框架,自己封装过一个代码高亮的插件,折腾了好一段时间,发现出来的效果并不理解,最后还是通过第三方插件来解决,所以,语法高亮这块,我觉得ChatboxAI的效果也非常可以了。

在这里插入图片描述


在这里插入图片描述

代码审查

博主提供了一段存在一定漏洞的代码,基本上都是秒分析,非常迅速的罗列代码潜在的问题,最后输出修正后的代码。

在这里插入图片描述


在这里插入图片描述

2.2、文档和图片理解

文档理解能力
上面主要功能Markdown格式就是通过文档理解功能输出。
响应速度和输出速度都比我预期的要好,输出非常流畅,其他平台我发现是一会一会的看着有点卡顿感觉,ChatboxAI整体输出是比较流畅的,这个也是客户端的优势吧,也可能是平台本身逻辑算法的优化的原因。

在这里插入图片描述


图片理解能力
图片理解轻轻松松,还能进行进一步提问总结输出。

在这里插入图片描述


在这里插入图片描述

2.3、实时联网搜索与查询

需要点击输入框里的联网图标,然后输入,比如:

输出10条,最近关于互联网的新闻
在这里插入图片描述

2.4、生成可视化图表与见解

博主这里直接使用Chatbox本身主要功能作为内容生成一份图表,看下效果。
说实在的,出来的效果把我震撼到了,太强大了,超出了我的预期效果。

在这里插入图片描述


那么,博主我是怎么使用的呢,很简单,首先我是把Chatbox AI主要功能文本放到txt文本文档里,比如

在这里插入图片描述


接着就是,直接使用Chatbox AI本身自带的做图表实例,已经帮我们设计好了Prompt提示词,直接就可以使用和输出图表。

在这里插入图片描述

2.5、AI驱动的图像生成

文生图,需要切换到新图像对话,然后输出文生图的描述,比如

帮我画一个公仔,偏向可爱形,类似小黄人风格,有自己专属的小天线
在这里插入图片描述
prompt:图片里含有“Chatbox AI”关键词

两个字,好强的理解能力。

我在其他平台体验过类似的功能,出来的效果会有偏差,还有可能是错误的内容。但是Chatbox AI出来的效果,就是字面的意思,所以我才发出开头的感慨,好强的理解能力。

在这里插入图片描述
prompt:再输出一张关于技术博客文章的封面图,要求炫酷科技感一点。
在这里插入图片描述

2.6、LaTeX和Markdown渲染

这个功能我觉得非常有必要,特别是需要输出一些数学相关的题目之类的。
格式渲染出来非常完美,这个博主深有体会,博主自己就开发过一个页面来展示这些公式,耗了好几天都没找到很好的解决方案去展示。
ChatboxAI渲染效果就非常不错,赞!

在这里插入图片描述

2.7、本地存储设置

博主在网页端和PC客户端切换,确实只有本地存储。

在这里插入图片描述

三、Chatbox AI开发俄罗斯方块游戏体验

博主通过简单的描述生成一份关于俄罗斯方块游戏的代码,并直接在线体验。

prompt提示词:生成俄罗斯方块游戏,方块颜色可以好点。

3.1、Prompt提示词

下面是运行效果
就简单一句话,就能快速生成经典游戏,同样也是超出我的预期效果,是不是很期待体验了呢。

不过有个建议,这里预览的时候,发现不能全屏,导致出现滚动条,游戏预览体验会有一定影响,但是直接使用代码运行完全没有问题。

在这里插入图片描述

3.2、完整代码

<!DOCTYPEhtml><html><head><title>彩色俄罗斯方块</title><style>body{display: flex;justify-content: center;align-items: center;height: 100vh;margin: 0;background: #f0f0f0;font-family: Arial, sans-serif;}#game-container{display: flex;gap: 20px;}#tetris{border: 2px solid #333;background: #111;}#side-panel{display: flex;flex-direction: column;gap: 20px;}#next-piece{border: 2px solid #333;background: #111;}#score-panel{padding: 10px;background: #333;color: white;border-radius: 5px;text-align: center;}.controls{margin-top: 20px;text-align: center;color: #333;}</style></head><body><divid="game-container"><canvasid="tetris"width="300"height="600"></canvas><divid="side-panel"><canvasid="next-piece"width="120"height="120"></canvas><divid="score-panel"><h3>分数: <spanid="score">0</span></h3><h3>等级: <spanid="level">1</span></h3><h3>行数: <spanid="lines">0</span></h3></div><divclass="controls"><p>← → : 移动</p><p>↑ : 旋转</p><p>↓ : 加速下落</p><p>空格 : 直接落下</p><p>P : 暂停</p></div></div></div><script>// 游戏常量constCOLS=10;constROWS=20;constBLOCK_SIZE=30;constCOLORS=[null,'#FF0D72',// I - 粉色'#0DC2FF',// J - 蓝色'#0DFF72',// L - 绿色'#F538FF',// O - 紫色'#FF8E0D',// S - 橙色'#FFE138',// T - 黄色'#3877FF'// Z - 深蓝];// 方块形状定义constSHAPES=[null,[[0,0,0,0],[1,1,1,1],[0,0,0,0],[0,0,0,0]],// I[[2,0,0],[2,2,2],[0,0,0]],// J[[0,0,3],[3,3,3],[0,0,0]],// L[[0,4,4],[0,4,4],[0,0,0]],// O[[0,5,5],[5,5,0],[0,0,0]],// S[[0,6,0],[6,6,6],[0,0,0]],// T[[7,7,0],[0,7,7],[0,0,0]]// Z];// 游戏变量let canvas = document.getElementById('tetris');let ctx = canvas.getContext('2d');let nextCanvas = document.getElementById('next-piece');let nextCtx = nextCanvas.getContext('2d');let scoreElement = document.getElementById('score');let levelElement = document.getElementById('level');let linesElement = document.getElementById('lines');// 缩放方块大小以适应画布 ctx.scale(BLOCK_SIZE,BLOCK_SIZE); nextCtx.scale(BLOCK_SIZE,BLOCK_SIZE);// 游戏状态let score =0;let level =1;let lines =0;let gameOver =false;let paused =false;let dropCounter =0;let dropInterval =1000;let lastTime =0;// 创建游戏板functioncreateMatrix(w, h){const matrix =[];while(h--){ matrix.push(newArray(w).fill(0));}return matrix;}let board =createMatrix(COLS,ROWS);let player ={pos:{x:0,y:0},matrix:null,score:0};// 创建方块functioncreatePiece(type){return{pos:{x: Math.floor(COLS/2)-1,y:0},matrix:SHAPES[type],type: type };}// 绘制矩阵functiondrawMatrix(matrix, offset, context){ matrix.forEach((row, y)=>{ row.forEach((value, x)=>{if(value !==0){ context.fillStyle =COLORS[value]; context.fillRect(x + offset.x, y + offset.y,1,1);// 添加方块边框效果 context.strokeStyle ='rgba(255, 255, 255, 0.2)'; context.lineWidth =0.1; context.strokeRect(x + offset.x, y + offset.y,1,1);}});});}// 绘制游戏状态functiondraw(){// 清空画布 ctx.fillStyle ='#111'; ctx.fillRect(0,0, canvas.width, canvas.height);// 绘制游戏板drawMatrix(board,{x:0,y:0}, ctx);// 绘制当前方块if(player.matrix){drawMatrix(player.matrix, player.pos, ctx);}// 绘制网格线 ctx.strokeStyle ='rgba(255, 255, 255, 0.05)'; ctx.lineWidth =0.02;for(let i =0; i <=COLS; i++){ ctx.beginPath(); ctx.moveTo(i,0); ctx.lineTo(i,ROWS); ctx.stroke();}for(let i =0; i <=ROWS; i++){ ctx.beginPath(); ctx.moveTo(0, i); ctx.lineTo(COLS, i); ctx.stroke();}}// 绘制下一个方块functiondrawNext(){ nextCtx.fillStyle ='#111'; nextCtx.fillRect(0,0, nextCanvas.width, nextCanvas.height);if(nextPiece){// 居中显示下一个方块const offsetX =(4- nextPiece.matrix[0].length)/2;const offsetY =(4- nextPiece.matrix.length)/2;drawMatrix(nextPiece.matrix,{x: offsetX,y: offsetY}, nextCtx);}}// 合并方块到游戏板functionmerge(){ player.matrix.forEach((row, y)=>{ row.forEach((value, x)=>{if(value !==0){ board[y + player.pos.y][x + player.pos.x]= value;}});});}// 碰撞检测functioncollide(){const[m, o]=[player.matrix, player.pos];for(let y =0; y < m.length;++y){for(let x =0; x < m[y].length;++x){if(m[y][x]!==0&&(board[y + o.y]===undefined|| board[y + o.y][x + o.x]===undefined|| board[y + o.y][x + o.x]!==0)){returntrue;}}}returnfalse;}// 旋转方块functionrotate(matrix){constN= matrix.length;const result =[];for(let i =0; i <N;++i){ result[i]=[];for(let j =0; j <N;++j){ result[i][j]= matrix[N- j -1][i];}}return result;}// 旋转玩家方块functionplayerRotate(){const pos = player.pos.x;let offset =1;const rotated =rotate(player.matrix); player.matrix = rotated;// 解决旋转后可能的碰撞while(collide()){ player.pos.x += offset; offset =-(offset +(offset >0?1:-1));if(offset > player.matrix[0].length){ player.matrix =rotate(rotated); player.pos.x = pos;return;}}}// 方块下落functionplayerDrop(){ player.pos.y++;if(collide()){ player.pos.y--;merge();playerReset();arenaSweep();updateScore();} dropCounter =0;}// 方块移动functionplayerMove(dir){ player.pos.x += dir;if(collide()){ player.pos.x -= dir;}}// 重置玩家方块functionplayerReset(){ player.matrix = nextPiece.matrix; player.pos.y =0; player.pos.x = Math.floor(COLS/2)- Math.floor(player.matrix[0].length /2); player.type = nextPiece.type;// 生成下一个方块 nextPiece =createPiece(Math.floor(Math.random()*7)+1);drawNext();// 检查游戏结束if(collide()){ gameOver =true;alert('游戏结束! 你的分数: '+ score);resetGame();}}// 清除完整的行functionarenaSweep(){let linesCleared =0;outer:for(let y = board.length -1; y >=0;--y){for(let x =0; x < board[y].length;++x){if(board[y][x]===0){continue outer;}}// 移除完整的行并在顶部添加新行const row = board.splice(y,1)[0].fill(0); board.unshift(row);++y; linesCleared++;}if(linesCleared >0){ lines += linesCleared;// 更新分数 (原始俄罗斯方块计分系统)switch(linesCleared){case1: score +=100* level;break;case2: score +=300* level;break;case3: score +=500* level;break;case4: score +=800* level;break;}// 每清除10行升一级if(Math.floor(lines /10)> level -1){ level = Math.floor(lines /10)+1; dropInterval = Math.max(100,1000-(level -1)*100);}}}// 更新分数显示functionupdateScore(){ scoreElement.textContent = score; levelElement.textContent = level; linesElement.textContent = lines;}// 重置游戏functionresetGame(){ board =createMatrix(COLS,ROWS); score =0; level =1; lines =0; gameOver =false;updateScore(); nextPiece =createPiece(Math.floor(Math.random()*7)+1);playerReset();}// 游戏更新functionupdate(time =0){if(gameOver || paused)return;const deltaTime = time - lastTime; lastTime = time; dropCounter += deltaTime;if(dropCounter > dropInterval){playerDrop();}draw();requestAnimationFrame(update);}// 键盘控制 document.addEventListener('keydown',event=>{if(gameOver)return;switch(event.keyCode){case37:// 左箭头playerMove(-1);break;case39:// 右箭头playerMove(1);break;case40:// 下箭头playerDrop();break;case38:// 上箭头playerRotate();break;case32:// 空格while(!collide()){ player.pos.y++;} player.pos.y--;playerDrop();break;case80:// P键 paused =!paused;if(!paused){ lastTime =0;update();}break;}});// 初始化游戏let nextPiece =createPiece(Math.floor(Math.random()*7)+1);playerReset();updateScore();drawNext();update();</script></body></html>

四、Chatbox AI选择DeepSeek模型体验

Chatbox AI平台同样支持DeepSeek模型的选择,对接也非常的简单。

4.1、申请Key

在DeepSeek官网申请好Key之后,直接复制到文本框即可,比如:

在这里插入图片描述

4.2、检查Key

复制Key到对应文本框后,点击检查,显示连接成功即可

在这里插入图片描述

4.3、体验

在选择模型下面,就可以看到DeepSeek下面的模型。
这里需要注意,是选择DeeoSeek下的模型,可能有些小伙伴会搞混淆,因为Chatbox AI本身也有对应DeepSeek模型。

在这里插入图片描述


在这里插入图片描述

4.4、其他模型

除了DeepSeek模型之外,ChatboxAI还提供了几乎主流的模型,比如,
所以,是不是能够感受到,Chatbox AI为什么叫全平台AI,给博主的感受就是,接入第三方api的功能都是免费的,购买chatbox官方的api是需要付费的。但官方api的好处是,出同样的钱可以一次性使用n个供应商的大模型,省去了多次购买的麻烦,性价比很高!

在这里插入图片描述

五、体验总结

博主通过实际体验和使用,能够深深高手到用 AI 提高效率,也是工作学习的最佳拍档。
一个简约强大的 AI 桌面客户端,支持最先进的多款大语言模型,让前沿的人工智能技术变成易于使用的生产力工具。

上面仅仅是博主体验主要功能,Chatbox AI平台更多功能等你来发现和体验。

Read more

4G模块应用,内网穿透,前端网页的制作第三讲(环境准备以及AI的快速开发)

4G模块应用,内网穿透,前端网页的制作第三讲(环境准备以及AI的快速开发)

注:其中使用的关键词可以直接提供给AI,如果操作有区别,请根据您使用的AI提供步骤为准 环境准备: 首先需要下载好cmake和node.js (建议 v14.0 以上)和python 其次需要您打开乐青映射https://www.locyanfrp.cn/的官网下载他的启动器kairo,或者您可以选择下载他的纯净版客户端Frpc,都是可以的 Web前端的开发和Node.js后端迅速开发,AI的快速应用(我使用的是gemini开发的) 注:不一定要使用gemini进行开发,您有多种选择例如codex,cursor等等都可以帮助您进行快速开发 gemini开发教程 第一步关键词说明(如果您使用的是codex,cursor这种有agent功能的ai会开发的更加快速) 我现在需要写一个智能头盔管理系统,框架采用前后端分离的结构,后端使用nodejs,所有的接口需要清晰分明,前端不采用任何框架,单纯使用html,js以及css需要单出生成文件,不要全部放在html里面,首先帮我实现第一步,搭建一个websocket服务器,前端可以自行设置服务器地址端口进行链接,服务器默认逻

Sentinel - 告警通知:通过 Webhook 接入企业微信/钉钉

Sentinel - 告警通知:通过 Webhook 接入企业微信/钉钉

👋 大家好,欢迎来到我的技术博客! 💻 作为一名热爱 Java 与软件开发的程序员,我始终相信:清晰的逻辑 + 持续的积累 = 稳健的成长。 📚 在这里,我会分享学习笔记、实战经验与技术思考,力求用简单的方式讲清楚复杂的问题。 🎯 本文将围绕Sentinel这个话题展开,希望能为你带来一些启发或实用的参考。 🌱 无论你是刚入门的新手,还是正在进阶的开发者,希望你都能有所收获! 文章目录 * Sentinel - 告警通知:通过 Webhook 接入企业微信/钉钉 📢 * 🌐 一、引言:为什么需要告警通知? * 1.1 微服务架构下的挑战 * 1.2 Sentinel 的核心价值与局限 * 1.3 告警通知的重要性 * 1.4 企业微信 & 钉钉的优势 * 🧠 二、核心概念与原理 * 2.1 Sentinel 告警机制

芯片制造行业如何通过WebUploader+PHP加密传输工程文件的分片数据?

《一个码农的奇幻外包漂流记》 需求分析会:当甲方爸爸说出"简单"二字时… 各位老铁们好!我是辽宁沈阳一名"资深"前端码农(资深=头发少)。刚接到个外包需求,看完后我直接表演了个东北式懵逼: 甲方需求翻译大赛: * “要支持20G文件” → “希望你电脑硬盘够大” * “兼容IE9” → “希望你心态够好” * “1000+文件的文件夹结构” → “希望你记忆力超群” * “预算100元含3年维护” → “希望你家里有矿” * “7×24小时支持” → “希望你不需要睡觉” 技术选型:穷且益坚版解决方案 前端部分(Vue3+原生JS缝合怪版) // 文件夹上传器(贫困版)classDiaoSiFolderUploader{constructor(){this.chunkSize =5*1024*1024;// 5MB一片this.maxTry =99;// 最大重试次数(因为甲方网络是2G)this.

【工具】无需Token!WebAI2API将网页AI转为API使用

【工具】无需Token!WebAI2API将网页AI转为API使用

转载请注明出处:小锋学长生活大爆炸[xfxuezhagn.cn] 如果本文帮助到了你,欢迎[点赞、收藏、关注]哦~ 背景介绍         想用OpenClaw、想在自己工具里集成API,但Token太贵了?不过,各大商家不是都提供了免费的网页版吗?比如doubao、ChatGPT,网页版是不限量还免费的!         所以这次介绍的工具,就是将网页版的AI转成了兼容OpenAI协议的API。以前也有web2api、chat2apt,不过都不更新了。而这次的WebAI2API非常好用。 使用效果         亲测效果挺好,原理就是:对外提供API接口,接收到请求后默认人工操作去内置浏览器上发送内容,然后将结果再返回给接口。 还提供了一个后端管理系统,可以方便的查看系统状态、管理配置等等。 不只是文字,图片生成也是能实现的。 如果你部署在服务器上,还能远程查看屏幕。 目前支持的AI厂商列表: 网站名称文本生成图片生成视频生成LMArena✅✅🚫Gemini Enterprise Business✅✅✅Nano Banana F