k0933的博客

原创 前端跨域怎么解决？配了代理还是不生效？一篇讲透排查思路

跨域是浏览器同源策略拦截响应，非服务器拒绝。开发环境通过 Vite 代理解决，核心在于请求是否先抵达 dev server。90% 代理失效因请求绕过 dev server——如 axios 拼接 baseURL 导致直连后端。关键排查点：请求路径是否以相对路径发出，或用 location.origin + '/api' 构造绝对地址让 axios 跳过拼接。此外，写死域名、路径不匹配、rewrite 错配等均会导致失效。根本心法：代理只对发往 dev server 的请求生效。

原创 免费大语言模型API平台汇总指南（2026年最新）

对于国内开发者，

原创 OMO + Superpowers 协同开发最佳实践

本文介绍了OMO与Superpowers协同开发的最佳实践。整体架构采用分层设计：OMO负责宏观调度（任务拆解、多智能体并行），Superpowers负责微观规范（TDD流程、代码审查）。标准化开发流程包含5个阶段：需求分析（Prometheus生成PRD）、架构设计（Oracle制定方案）、任务规划（Atlas拆解任务）、并行开发（Superpowers执行TDD循环）和代码审查。核心原则包括OMO宏观调度、Superpowers质量保证、人类仅需提出需求以及质量内建机制。该协同模式实现了从需求到交付的全

原创 Superpowers 介绍与使用指南

Superpowers：AI辅助开发的规范化工作流框架 Superpowers是一套规范化的软件开发方法论，通过强制TDD、设计审查等流程约束AI的开发行为。其核心包含5阶段工作流：头脑风暴、任务拆解、TDD执行、两阶段审查和系统调试。该系统支持跨平台使用，提供15+内置技能（如TDD开发、代码审查等），采用MIT许可证确保商用自由。典型应用场景包括TDD开发模块、代码质量审查和系统调试。与Oh My OpenAgent相比，Superpowers更侧重开发流程规范而非智能体编排，两者可协同使用形成完整的A

原创 Oh My OpenAgent (OMO) 介绍与使用指南

《Oh My OpenAgent (OMO) 多模型智能体编排框架指南》 OMO是一个专为OpenCode设计的智能体编排框架，可将单一AI代理转变为协同工作的虚拟开发团队。核心架构包含Sisyphus主编排器和多个专业化智能体（Prometheus战略规划、Atlas任务执行等），支持多模型路由和并行工作。 框架提供40+生命周期钩子，哈希锚定编辑技术使编辑成功率提升10倍，Ultrawork模式可实现一键自动化开发。典型应用场景包括新项目开发、代码重构和完整功能实现，通过直观命令如"ultra

原创 MCP 与传统 Function Calling 技术对比

MCP与传统Function Calling技术对比摘要 MCP（模型上下文协议）是Anthropic推出的开放标准，旨在解决AI系统与外部工具/数据的标准化连接问题。与传统Function Calling技术相比，主要差异体现在： 架构设计：Function Calling采用集成式架构，每个应用需独立实现工具集成；MCP采用客户端-服务器分离架构，支持工具复用。 核心功能：Function Calling仅支持工具调用，MCP额外支持资源访问、提示模板、双向通信等高级功能。 标准化程度：Function

原创 Sourcetree的重置操作

本文介绍了Git版本回退的三种合并方式：软合并（保留修改到暂存区）、混合合并（保留修改到工作区）和强行合并（直接丢弃修改）。针对本地未推送的提交，通过右键选择重置分支即可选择不同回退方式；对于已推送的提交，软合并后需解决冲突才能重新提交，而强行合并会直接丢弃所有更改。操作时需谨慎选择合并方式，避免数据丢失。文章通过截图直观展示了不同合并方式的操作过程和结果差异。

原创 根据前项选择结果，判断后项是否需要非空校验

摘要：本文展示了不同学历阶段学位附件必选条件的差异处理。代码实现中，大学本科阶段学位附件为必选项，而高中阶段为非必选项。通过JavaScript的校验函数validateUplaodXW实现条件判断：当学历为"无"时跳过校验，否则检查附件是否为空。这种动态校验机制可根据用户选择的学历等级灵活调整附件上传要求，适用于教育信息填报等场景。（98字）

原创 基于Upload实现头像的上传、回显以及非空校验

本文展示了一个基于Vue.js的图片上传组件实现方案。通过Upload组件实现图片上传功能，支持jpg/jpeg/png格式校验，并提供图片预览和删除功能。核心代码包含：1) 图片展示区域使用动态背景样式；2) 上传组件配置了格式校验、大小限制等回调函数；3) 使用FormData实现文件上传，成功后更新数据模型。组件还包含非空校验功能，通过隐藏的Input实现表单验证。整体实现简洁高效，适合用户头像上传等场景。

原创 DatePicker日期选择器实现截至时间-至今

摘要：本文介绍了一种使用DatePicker和Input组件配合实现"至今"选项的方法。当用户选择"至今"时，显示不可编辑的Input框，否则显示日期选择器。代码展示了Vue组件中的实现方式，包括条件渲染、日期禁用设置以及快捷选项配置。该方法通过v-if/v-else切换组件，并使用disabledDate和shortcuts选项实现"至今"功能选择，提供了灵活的时间选择交互方式。

原创 图片链接浏览器能直接打开显示正常，放在img标签里就加载不出来的解决方法

原创 vue中view-design的校验及各种坑

async-validator常见校验问题及解决方案 使用async-validator时，值存在但校验失败通常是因为type类型不匹配。表单默认校验类型为string，需根据实际值类型显式声明（如number/array/date等）。常见场景： 日期选择器：需设置type: 'date' 级联选择器：数组值需声明type: 'array' 上传组件：通过隐藏Input绑定值，自定义validator校验非空 正则校验： 身份证需验证18位格式及有效性（含年月日校验） 手机号需符合/^1[3-9]\d{9

原创 基于ant-design的table组件rowSpan、colSpan的行列合并

本文介绍了如何实现表格行合并功能，重点讲解了合并规则和实现方法。关键点包括：1)通过colSpan和rowSpan控制合并；2)使用customCell返回合并配置；3)将相同数据分组后计算合并行数；4)生成合并配置并应用到列定义。提供了完整代码示例，展示了按名称分组后实现多行合并的效果，最终呈现了行合并后的表格展示效果。

原创 ant-design中table组件的rowKey、customRow、rowSelection属性的用法

本文介绍了表格组件的三个关键功能：1）rowKey用于设置行数据的唯一标识；2）customRow支持自定义行样式和事件处理；3）rowSelection提供行选择功能，包括设置默认选中项、禁用特定行选择以及清空选中项。通过代码示例和效果图展示了各功能的实现方式，帮助开发者灵活配置表格交互行为。

原创 vue3中基于AntDesign的Form嵌套表单的校验

本文介绍了在Vue组件中实现父子表单联动校验的方法。子组件通过defineExpose暴露异步校验方法validateForm，使用Promise封装表单验证结果。父组件通过ref获取子组件实例，调用其校验方法，并利用await-to-js库处理异步校验结果。最终通过判断两个表单的校验结果决定是否执行提交逻辑，实现了主表单和组件表单的协同校验机制。这种解耦设计既保持了组件独立性，又实现了表单联动验证功能。

原创 在组件外(.js文件)中使用pinia的方法2--在http.js中使用pinia

本文介绍了使用Pinia管理全局loading状态的解决方案。通过创建loading.js存储模块，定义isLoading状态和请求计数逻辑；在http拦截器中调用store方法控制loading显示；最后在App.vue中绑定状态到全局加载组件。该方案避免了动态值存储问题，且不影响数据持久化插件，实现了请求过程中自动显示/隐藏loading的效果。关键点包括：1）使用requestCount计数确保多个请求时的正确状态；2）需要在Vue应用初始化后正确加载store；3）提供resetLoading方法确

原创 vue2中使用xgplayer播放流视频

XGPlayer播放器使用注意事项：安装后若无法播放，需将依赖版本降为"xgplayer-hls": "2.2.2"和"xgplayer": "2.31.6"。使用步骤包括：1)引入相关库；2)初始化播放器配置参数；3)通过destroy()方法销毁实例。该播放器支持HLS流媒体、自动播放、截图等功能，适用于网页视频播放场景。当遇到播放问题时，版本兼容性是首要排查点。

原创 基于vue+View UI的组织机构选择

摘要：该代码实现了一个基于Vue.js的组织机构树形选择组件，包含左侧树形选择区和右侧已选项展示区。主要功能包括：1)通过树形复选框选择项目；2)实时搜索过滤树节点；3)显示已选项并可删除；4)支持父子节点联动选择。组件采用Modal弹窗形式，使用iView UI库的Tree、Button、Modal等组件，实现了完整的树形数据选择交互流程。

原创 nonorepo+turbo实现多项目管理

【代码】nonorepo+turbo实现多项目管理。

原创 js实现的前端水印

前端水印

原创 前端处理流式数据

【代码】前端处理流式数据。

原创 vue实现的拖拽组件

vuet拖拽

原创 vue中proxy代理配置(测试二)

接口地址：https://ss.dd.dd.d.cn:9006/thirdist/portalApi/biz-api/eemp/supervision/v1/supervisonCount/getPeiCountData?（3）请求get(‘/api/thirdist/portalApi/…（3）请求get(‘/api/thirdist/portalApi/…（2）proxy为 ‘/api’：’ /api’（2）proxy为 ‘/api’：’ /api’（2）proxy为 ‘/api’：’ ’

原创 vue中proxy代理配置(测试一)

（1）设置baseURL为 ‘http://jsonplaceholder.typicode.com’（2）proxy为 ‘/posts’：’ /posts’（2）proxy为 ‘/api’：’ /api’（2）proxy为 ‘/api’：’ /api’（3）请求get(‘/api/posts’)（3）请求get(‘/api/posts’)（3）请求get(‘/api/posts’)（2）proxy为 ‘/api’：’ ’（2）proxy为 ‘/api’：’ ’（1）设置baseURL为 ‘/’

原创 公共api接口

连接

原创 sourceTree回滚版本到某次提交

sourceTree回滚

原创 基于less和scss 循环生成css

【代码】基于less 循环生成css。

原创 Vue 3 + Vite 基于vite-plugin-html的多模板打包，生成多个项目

1、安装 vite-plugin-html。3、配置vite.config.js。

原创 vue3中vite基于vite-plugin-html的多入口打包

1、安装vite-plugin-html。3、配置vite.config.js。

原创 DatePicker 两个日期选择框的时间范围设置不可选日期

DatePicker 时间范围设置不可选日期

原创 Element Plus的el-carousel走马灯平铺多张图片

【代码】Element Plus的el-carousel走马灯平铺多张图片。

原创 linux+springboot+nginx转rtsp流为hls流

1、基本逻辑为前端请求时获取新的rtsp流地址，调用一次rtsp2Hls转码方法，将生成新的hls切片文件（不用考虑旧文件，将会覆盖），转码时先停止当前转码线程，再创建新的线程。2、线程监控：开启一个定时任务，每10分钟查看一次，若有异常线程，则重新获取rtsp流地址进行转码，在晚上8点后则停止所有转码任务。1、下载(自定义版本：http://www.ffmpeg.org/releases/)#编译安装(默认安装在/usr/local/nginx)进入：/usr/local/nginx/sbin。

原创 vue3中基于dayjs实现日历

vue3中基于dayjs实现日历

原创 vue项目cnpm i 报错

报错内容：Install fail! TypeError: Cannot convert undefined or null to objectnpminstall version: 3.28.1npminstall args: C:\Program Files\nodejs\node.exe C:\Users\user\AppData\Roaming\nvm\v12.4.0\node_modules\cnpm\node_modules\npminstall\bin\install.js --fix-

原创 vue项目打包成.tgz

npm pack。

原创 Vue3.0使用keep-alive实现列表页跳转到详情页，再返回列表页时分页保持不变

先判断isBack的状态，如果为false,则说明当前不是从详情页进来的（可能从其他菜单或则编辑页进入，需要更新数据），就更新列表数据（自己的列表数据逻辑，并将分页设为1），之后将isBack设置为false。问题：1、列表页进入详情页，再从详情页返回时，列表页不刷新，即列表当前分页为第二页时，点击进入详情页，再从点击返回按钮，返回到列表页时，列表页保持在第二页。进入列表时，先判断是不是从详情页进入的，如果是，则将isBack设为true。2、列表页进入编辑页，再从编辑页返回时，列表页刷新。

原创 Vue2.0使用keep-alive实现列表页跳转到详情页，再返回列表页时分页保持不变

先判断isBack的状态，如果为false,则说明当前不是从详情页进来的（可能从其他菜单或则编辑页进入，需要更新数据），就更新列表数据（自己的列表数据逻辑，并将分页设为1），之后将isBack设置为false。问题：1、列表页进入详情页，再从详情页返回时，列表页不刷新，即列表当前分页为第二页时，点击进入详情页，再从点击返回按钮，返回到列表页时，列表页保持在第二页。进入列表时，先判断是不是从详情页进入的，如果是，则将isBack设为true。2、列表页进入编辑页，再从编辑页返回时，列表页刷新。

原创 npm最新淘宝镜像站

npm最新淘宝镜像站

原创 day.js实战

项目中对时间格式化是最常见的场景，dayjs返回的是dayjs对象，需要通过。通过.isValid()验证传入的参数是否能被解析成一个时间日期。这表示 Day.js 对象是否在另一个提供的日期时间之前。这表示 Day.js 对象是否和另一个提供的日期时间相同。这表示 Day.js 对象是否在另一个提供的日期时间之后。day.js解析传入的参数，并返回Day.js对象。返回增加一定时间的复制的 Day.js 对象。返回减去一定时间的复制的 Day.js 对象。查询 Day.js 对象的年份是否是闰年。

原创 基于最新 pdf.js 在 Vue3 中预览pdf的方法

1、安装pdfjs-dist。2、将包放到public中。1、下载 pdf.js。