IT白袍-CSDN博客

原创 AI+：一文搞懂 Vibe Coding

Vibe Coding 的本质不是技术革命，是心态革命你不再为代码负责，你为产品负责。代码只是中间产物，效果才是最终交付物。Karpathy 的原话里最打动人的是那句—— 忘掉代码的存在。这或许是未来编程的终极形态，也可能是最大的陷阱。编程的门槛正在以肉眼可见的速度消失。在这个浪潮里，你会选择站在哪一边？📝 本文整理自 Andrej Karpathy 原始帖子、社区讨论及相关资料，2025年5月。

2026-05-22 16:00:00 585

原创 AI：OpenAI Codex 安装使用全流程详解：桌面APP、CLI、注册问题与解决方案

OpenAI Codex 是 2025 年 OpenAI 重新启用的品牌，定位是AI 编程智能体平台，对标 Cursor、Claude Code。Codex 只能装桌面 APP 吗？有没有 CLI 版本？下了桌面 APP，CLI 命令会自动装好吗？注册时选中国手机号，提示"无效手机号"是怎么回事？没有 OpenAI 账号，CLI 能不能免登录用？本文逐一解答，并给出国内可用的解决方案。方案成本稳定性推荐度免费⭐⭐⭐（看账号质量）⭐⭐⭐⭐eSIM 实体卡几十元/月⭐⭐⭐⭐⭐。

2026-05-22 10:30:00 3141

原创 AI+：Codex 接入第三方模型：实操全记录

本文详细记录了将Codex接入DeepSeek第三方模型的完整过程及技术挑战。主要内容包括：目标与动机：试图结合Codex的交互体验与DeepSeek的低成本API，但实际难度远超预期。核心障碍：协议格式不兼容（Responses API vs Chat Completions API）认证机制不兼容（Codex无法正确传递API Key）解决方案：采用CCX协议转换器+bridge.js代理桥接的方案通过端口互换和请求重写实现功能实际效果：虽然技术链路打通，但存在身份伪装、元数据缺失等无

2026-05-22 10:00:00 1983

原创 AI+：一文带你了解OpenAI Codex的进化史

OpenAI Codex 2.0深度解析：从退役模型到AI编程智能体平台的华丽转身。新版Codex定位为"AI coding agent"，提供三种产品形态（桌面应用、CLI终端、编辑器集成）和五大核心功能，包括端到端任务执行、多智能体工作流等。相比传统代码补全工具，Codex能独立完成复杂开发任务并支持后台自动化运行。技术架构基于OpenAI专用微调的GPT-5.2-codex模型。与GitHub Copilot等竞品相比，Codex在多智能体协作和自动化方面具有差异化优势，适合独立开发者到大型团队的不同

2026-05-21 17:34:06 1124

原创 AI+：OpenClaw 远程管理能力深度解析

OpenClaw 的远程管理能力并非简单的"远程桌面"或"SSH 包装"，而是构建了一套完整的分布式 AI 控制体系多通道解耦，任意设备皆是控制台Gateway 中枢，负责任务调度与编排Node 节点网络，覆盖任意操作系统与架构这套体系的设计哲学是不再让 AI 助手驻留在单一设备上，而是让它融入到用户整个数字基础设施中，成为真正可编程、可扩展、可远程操控的 AI 控制中枢。这，正是 OpenClaw 与所有传统 AI 聊天客户端之间最本质的区别。

2026-05-21 11:00:00 376

原创 AI+：OpenClaw：开源 AI Agent 框架的定位与技术分析

OpenClaw 采用 Gateway + Agent 的分离架构，底层通过 WebSocket 协议统一消息路由。Google Chat、Microsoft Teams、Mattermost、飞书WebChat（浏览器）、macOS 原生应用对比同类产品（ChatGPT App、Claude App、GitHub Copilot Chat），均仅支持自有封闭渠道，缺乏跨平台消息聚合能力。OpenClaw 在框架自由度和能力边界两个维度上展现了显著优势。

2026-05-20 23:23:28 847

原创代码规范：RESTful API 全面介绍

RESTful API 全面介绍摘要 RESTful API是基于REST架构风格的应用程序接口，以资源为中心，通过标准HTTP方法进行操作。其核心遵循六大原则：客户端-服务器分离、无状态、可缓存、统一接口、分层系统和按需代码。关键实践包括：资源使用名词复数命名URL；规范HTTP方法语义（GET/POST/PUT等）；采用标准状态码；JSON格式响应；版本管理推荐URL路径方式；支持过滤/分页/排序参数；以及HTTPS、JWT等安全机制。相比GraphQL和gRPC，RESTful API具有简单轻量、平

2026-05-20 19:19:44 935

原创 AI+：一文带你了解市面主流AI模型与厂商之间的关系

《AI编程工具与模型厂商全景图谱（2025-2026）》梳理了当前主流AI编程工具及其底层模型关系。核心区分厂商、模型和工具三个层级，微软/GitHub、OpenAI、Anthropic等厂商提供GPT-4o、Claude等基础模型，支撑GitHub Copilot、Cursor等开发工具。国产工具如阿里云通义灵码、字节Trae基于自研模型Qwen和豆包。图谱还包含开源项目OpenClaw等独立工具，并提供选型建议：企业推荐Copilot，追求性能选Claude Code，国内团队可用通义灵码，开源需求考虑

2026-05-20 19:13:23 660

原创 AI+：OpenClaw 入门指南：你想知道的都在这里

对于普通用户来说：无论选择哪种安装方式，日常使用上没有任何区别。想快速体验 → 一键安装想学习源码 → 从源码安装想参与开源 → 从源码安装。

2026-05-19 20:41:11 349

原创 AI+：CC switch：让 Claude Code 无缝切换第三方 AI 模型的利器

最近 AI 编程工具发展迅速，Claude Code 凭借其强大的上下文理解与文件操作能力受到很多开发者的青睐。但默认情况下，Claude Code 只支持 Anthropic 官方 API，高频使用成本不低。幸运的是，通过 cc switch 这款工具，我们可以轻松地将 Claude Code 接入各种第三方 AI 模型，实现低成本、高可用的 AI 编程工作流。今天这篇文章，我将从两个常见问题出发，为大家详细讲解 cc switch 的工作原理和使用方法。cc switch 是什么？

2026-05-19 20:13:01 853

原创 AI+：CC Switch：你的AI CLI工具统一控制面板

CC Switch：AI命令行工具的智能控制中心 CC Switch是一款创新的跨平台桌面工具，专为解决AI开发者面临的配置管理难题而设计。它通过统一界面集中管理Claude Code、Codex、Gemini CLI等主流AI编程工具的配置文件，彻底告别手动编辑JSON/TOML/env文件的繁琐操作。核心功能包括：一键切换50+服务商API配置可视化管理系统提示词和技能扩展包内置代理服务和智能故障转移机制详尽的用量统计与多端云同步采用Tauri+Rust技术栈开发，支持Windows/mac

2026-05-19 15:40:16 682

原创 AI+：WorkBuddy vs Trae：腾讯与字节的AI工具对比分析

腾讯WorkBuddy与字节Trae AI工具对比分析：WorkBuddy是腾讯推出的职场AI智能体工作台，主打办公自动化、文档处理等功能，适合非技术人员使用；Trae则是字节跳动的AI编程IDE，专注于代码开发和项目构建，面向开发者群体。两者在定位、功能和技术架构上存在明显差异：WorkBuddy强调本地运行和企业IM集成，Trae则提供专业代码生成和云端AI支持。用户可根据需求选择，办公人员推荐WorkBuddy，开发者更适合Trae。

2026-05-19 15:21:42 3065

原创 AI+：AI编程工具对比分析：OpenClaw、Codex、Trae与Claude Code

定位：开源的终端AI助手，定位为"你的专属AI员工"核心特点🖥️本地运行：数据不上传云端，保护隐私🔌多平台集成：支持WhatsApp、Telegram、Discord、Slack等🤖记忆系统：短期/长期记忆，理解上下文🧩技能扩展：插件系统，可自定义开发💻开源免费：MIT许可证，仅需支付API费用使用场景：个人AI助手、企业隐私场景、跨平台消息集成如果你重视隐私安全，选择OpenClaw如果你需要企业级协作，选择Codex如果你是中文开发者，选择Trae如果你专注深度代码分析，选择📌小贴士。

2026-05-19 15:11:24 1599

原创 Vue：如何实现日志导出下载功能？

本文介绍了基于后端接口返回日志URL实现文件下载功能的方法。首先展示后端返回的数据结构示例，包含文件URL地址。然后提供前端实现代码：通过创建Blob对象和隐藏的<a>标签，将URL转换为可下载文件，并自动生成包含时间戳的文件名。关键步骤包括获取当前时间格式化、创建下载链接、设置文件名属性及触发下载操作。该方法适用于需要从后端获取文件地址并实现浏览器下载的场景。

2025-12-18 11:36:55 413

原创 Vue：如何实现一个具有复制功能的文字按钮？

摘要本文介绍了一个实现文字复制功能的按钮组件。通过点击按钮可以将指定文本内容复制到剪贴板，核心代码使用document.execCommand('copy')方法实现复制功能。文章包含效果图展示、关键HTML模板和JavaScript方法代码，并指出该方法存在浏览器兼容性问题，部分现代浏览器可能不再支持该API。实现方案包含创建临时input元素、设置复制内容、执行复制命令和清理DOM元素等步骤。

2025-12-18 11:24:37 427

原创 Vue Echarts实时动态图表实现2【设置起始状态】

摘要本文展示了实时网络流量监控图表的实现方案，主要包含以下内容：使用ECharts库初始化WAN和LAN两个图表实例实现动态数据更新机制，包括时间轴自动更新和流量数据转换自定义tooltip显示格式，自动将字节数转换为B/KB/MB单位响应式设计，监听窗口resize事件自动调整图表大小通过Promise.all并发获取系统端口和接口信息图表配置包括图例样式、坐标轴设置和网格布局等关键点在于实时数据展示和单位转换，使监控数据更直观易读。

2025-11-27 11:29:32 239

原创 Vue：关于 Vue2 父子组件传值方法以及 props 的定义方法和使用

Vue2父子组件通信完整指南本文详细介绍了Vue2中父子组件间的四种数据通信方式：父传子：通过props选项传递数据，支持数组和对象形式定义，可设置类型检查、默认值和验证规则子传父：使用$emit触发自定义事件，父组件通过v-on监听并处理 v-model双向绑定：默认使用value属性和input事件实现表单元素与组件的双向绑定 .sync修饰符：实现多个prop的双向绑定（Vue2.3.0+）文中提供了完整可运行的示例代码，包含模板结构、组件定义和样式设置，帮助开发者快速掌握Vue2组件通信的核

2025-10-23 10:57:43 658

原创 Vue：Vue2 注册全局组件方法

Vue2全局注册组件方法总结：1）使用Vue.component()单组件注册；2）通过require.context批量注册组件；3）采用插件形式组织全局组件；4）自动注册全局组件。最佳实践建议基础组件全局注册、业务组件局部注册，注意命名规范和按需注册。全局注册减少了重复导入，特别适合管理通用组件，但需避免过度注册影响性能。注册后组件可在任意模板直接使用，无需在components选项中声明。

2025-10-23 10:13:38 573

原创 JS：判断对象是否为空（包括原型链上的属性和方法）

本文介绍了三种判断JavaScript对象是否为"真正空"的方法：1）检查对象自身及原型链上的所有可枚举属性；2）使用Reflect.ownKeys()检查更全面的属性（包括Symbol）；3）检查对象是否仅包含默认原型方法。每种方法都提供了代码实现和使用示例，并指出需要注意的特殊情况，如Symbol属性、不可枚举属性以及内置对象的特有方法。这些方案可以帮助开发者更准确地判断对象的"空"状态，避免遗漏原型链上的自定义属性和方法。

2025-08-16 11:26:56 415

原创数据埋点：退出浏览器之前，发送积压的埋点数据请求，该如何做？

摘要：本文探讨了在浏览器关闭前发送积压埋点数据的解决方案。推荐使用navigator.sendBeacon()异步发送数据，不阻塞页面关闭且可靠执行。对于旧浏览器兼容，可采用同步XMLHttpRequest（但会阻塞页面）。为应对直接关闭浏览器的情况，可结合visibilitychange事件。关键数据建议使用Service Worker实现后台同步发送。文章还对比了各方案的优缺点，并提供了优化埋点数据积压的建议，如定期批量发送、本地缓存和数据压缩。最佳实践组合为：现代浏览器使用sendBeacon+vi

2025-08-16 10:38:12 985

原创兼容性：如何判断用户设备？

本文介绍了6种判断用户设备类型的方法：1）解析navigator.userAgent获取设备、系统和浏览器信息；2）通过window.screen检测屏幕尺寸；3）使用navigator.platform识别操作系统；4）利用CSS/JS媒体查询实现响应式判断；5）采用现代API navigator.userAgentData获取结构化数据；6）推荐使用UAParser.js等第三方库。各方法各有优劣，建议根据实际需求组合使用，简单场景可选userAgent+screen，生产环境推荐第三方库，未来可转向U

2025-08-16 10:08:14 1300

原创跨域：浏览器有同源策略，但是为何 cdn 请求资源的时候不会有跨域限制？

CDN资源不受同源策略限制主要有两个原因：一是浏览器默认允许通过<script>、<link>等标签加载跨域静态资源；二是CDN服务器通常会设置CORS响应头允许跨域访问。同源策略主要限制通过JavaScript直接读取跨域数据，而静态资源加载通过标签方式或CORS机制规避了这一限制。这种设计既保证了网页能高效使用公共资源，又维护了核心安全边界。

2025-08-16 09:44:31 688

原创 Vue：自定义slider滑块组件

Vue：自定义slider滑块组件

2025-08-15 13:34:29 781

原创 Vue：手写支持浏览器全屏显示的按钮

Vue：手写支持浏览器全屏显示的按钮

2025-08-15 11:58:10 728

原创 Vue：实现一个无线滚动列表的解决方案

Vue实现无限向上滚动效果的摘要（150字）：本文介绍了两种Vue实现move-box区域无限向上滚动的方案。方案1通过定时器控制scrollTop实现基础滚动，包含暂停/恢复功能，并处理了组件销毁时的资源清理。方案2提供了进阶优化，使用CSS动画和内容复制实现更平滑的无缝滚动。两种方案均给出了完整代码，包括HTML结构、Vue逻辑和CSS样式，实现了响应式设计、隐藏滚动条、鼠标悬停暂停等功能。方案1适合简单需求，方案2则提供更流畅的视觉体验，开发者可根据项目需求选择适合的实现方式。

2025-08-13 14:36:44 1545

原创网络信息：WAN与LAN的区别及抽象比喻

WAN与LAN网络对比解析 LAN（局域网）覆盖小范围（家庭/办公室），具备高速（1Gbps+）、低延迟特性，采用以太网/Wi-Fi协议，成本低且自管理。WAN（广域网）跨越大区域，依赖运营商基础设施，速度与延迟受距离限制，成本较高，使用IP/MPLS等协议。典型比喻中，LAN如同公司内线电话，WAN则类似国际长途。二者协作关系可视为"岛屿道路"与"跨海桥梁"，现代技术通过SD-WAN等实现混合组网，优化云服务访问。关键差异体现在范围、速度、管理权及成本维度。

2025-08-12 15:19:15 1266

原创 Flex：Flex布局浏览器分辨率缩放出现界面比例变化问题解决（实测有效）

Flex布局等比例缩放解决方案当Flex布局的1:3:1比例在浏览器缩放时失衡，主要原因是Flex项目默认基于内容宽度调整。解决方案如下：核心方法添加min-width: 0允许项目缩小到比内容更小使用flex: 1 1 0%强制按比例分配空间推荐代码 .left, .center, .right { flex: 1 1 0%; min-width: 0; } .center { flex-grow: 3; } 注意事项避免固定宽度配合overflow处理内容溢出优先使用flex-basis

2025-08-12 15:02:14 1556