滕青山博客-CSDN博客

原创 HMAC在线加密核心JS实现

本文介绍基于crypto-js的HMAC在线加密工具JS实现，支持MD5、SHA-1/2/3、RIPEMD160等10种HMAC算法；密钥可选文本/Hex/Base64格式，结果输出Hex或Base64；全程浏览器端计算，安全高效。

2026-02-17 19:43:20 315

原创 HMAC在线加密在线工具分享

一款基于Vue3开发的HMAC在线加密工具，支持MD5/SHA-1/SHA-256等算法，实时计算、纯前端处理，数据不上传，保障安全。提供十六进制/Base64双格式输出与一键复制功能，适用于API签名、数据校验等场景。

2026-02-17 19:37:33 238

原创 JWT编码/解码核心JS实现

本文介绍基于 Vue 3/Nuxt 3 实现的纯前端 JWT 编码/解码工具，支持 HS/RS/PS/ES 等主流算法。核心库 `JWTHelper` 封装 Base64 URL 编解码、JWT 解析、签名生成与验证，HMAC 用 CryptoJS，RSA/ECDSA 等非对称算法调用 Web Crypto API，全程浏览器端完成，安全高效。

2026-02-16 00:02:42 303

原创 JWT编码解码在线工具分享

哈喽大家好，今天给大家安利一个我最近用手搓的在线工具——。做开发的同学应该都知道 JWT（JSON Web Token），现在前后端分离项目里用得特别多。但有时候调试接口、排查问题，手里没个顺手的工具，解析个 Token 还得去找在线网站，挺麻烦的。所以我就想，干脆自己做一个网页版的，打开就能用，还不用安装。

2026-02-15 23:45:55 255

原创文件16进制查看器核心JS实现

本文介绍基于 Vue 3 + Nuxt 3 实现的纯前端文件十六进制查看器：无需上传，直接在浏览器中读取任意文件（含二进制），通过 `FileReader` 解析为 `Uint8Array`，并提供格式化（空格/换行/大写）的 Hex 展示与 `.hex` 文件导出功能。

2026-02-13 00:42:48 316

原创文件16进制查看器在线工具分享

一款基于Vue 3开发的在线文件十六进制查看器，纯前端运行，文件不上传、隐私安全；支持任意格式，提供空格/紧凑/大写三种Hex显示模式，一键复制或下载。即开即用，轻量高效。

2026-02-13 00:38:37 464

原创 Vue3文本差异对比器实现方案

本文介绍基于Vue 3实现的轻量级文本差异对比工具，核心采用原生JS实现LCS（最长公共子序列）算法，支持行/词/字符三级对比模式，并可忽略空格与大小写。Vue组件负责交互与渲染，Diff逻辑独立封装、动态加载，性能优化采用HTML字符串直出，兼顾效率与灵活性。

2026-02-12 11:00:30 458

原创文本差异对比器在线工具分享

日常工作中常需对比文本/代码差异，肉眼识别易错低效。推荐我开发的在线工具——文本差异对比器，支持行/词/字符三级对比，红删绿增高亮显示，可忽略空格/大小写，纯前端运行，隐私安全，响应式设计，即开即用。

2026-02-12 10:56:04 481

原创 Vue3证书信息查看工具实现方案

本文详述「证书信息查看」工具的Vue 3实现方案，涵盖页面结构（输入/结果/操作三区）、状态管理、输入校验、拖拽上传、多模式查询（文本/文件/域名）及结果格式化与PEM下载等功能，代码模块清晰，便于维护与扩展。

2026-02-11 00:44:56 375

原创证书信息查看在线工具分享

这是一款基于Vue 3开发的轻量级在线工具——「证书信息查看」，无需安装、零门槛使用。支持输入域名、粘贴PEM证书或上传文件，秒级解析SSL/TLS证书关键信息（签发者、有效期、域名等），兼顾普通用户、站长与安全爱好者需求，全程本地处理，隐私无忧。

2026-02-11 00:13:38 382

原创 Vue3二维码生成器实现方案

本文拆解 Vue3/Nuxt3 二维码生成器实战方案，采用「Vue 管结构与状态、独立 JS 负责 Canvas 绘制」的分层架构。通过 `data-*` 属性定义交互协议，实现类型切换、表单联动、实时预览及 PNG/SVG 导出，兼顾可维护性与跨项目复用性。

2026-02-10 00:13:58 299

原创二维码生成器在线工具分享

一款基于Vue开发的在线二维码生成器，无需安装、不传数据，所有操作在浏览器本地完成。支持网址、文本、电话等多类型内容，实时预览、自定义尺寸/容错/颜色，一键下载高清图。隐私安全，手机电脑皆可用。

2026-02-09 23:56:07 852

原创 Vue项目BMI计算器技术实现

本文介绍基于Vue 3与Nuxt.js开发的BMI计算器工具，涵盖核心计算逻辑（含输入验证、BMI公式实现及四类健康状态判定）与交互式页面实现，代码结构清晰，开箱即用。

2026-02-08 00:03:05 765

原创 BMI计算器在线工具分享

分享一款自研Vue版BMI计算器：纯净无广告、秒出结果、实时健康评估（偏瘦/正常/超重等），支持响应式，数据本地计算更隐私。

2026-02-07 23:24:22 232

原创 Vue3密码生成器技术实现方案

本文深入解析密码生成器的前端实现：基于Vue 3 Composition API构建响应式界面，核心逻辑封装于`usePasswordGenerator`组合式函数中；采用Web Crypto API生成加密安全随机数，支持随机密码与XKCD风格短语双模式，并通过熵值算法实时评估强度。

2026-02-03 23:31:26 770

原创 Vue3项目JSON格式化工具技术实现详解

本文详解JSON格式化工具的前端实现，涵盖Composable核心逻辑（格式化、压缩、自动修复）与Vue交互优化（防抖预览、高亮动态加载、实时错误反馈），代码简洁高效，体验流畅。

2026-02-01 23:44:36 231

原创 JSON格式化与压缩在线工具分享

一款基于Vue 3开发的轻量级JSON在线工具，支持一键格式化、极致压缩、字符串转义/去转义及智能自动修复（兼容单引号、省略引号等非标写法）。无广告、带语法高亮、夜间模式与一键复制，提升开发效率。

2026-02-01 23:39:19 302

本文解析了一个文本编码转换器的JavaScript核心实现。该工具支持文本与多种编码格式(十六进制、二进制、Base64、Unicode等)之间的转换。核心功能包括：利用TextEncoder/TextDecoder处理UTF-8编码；通过toString(radix)实现进制转换；使用btoa/atob和代理对处理实现Base64和Unicode转换；巧妙利用URL API实现Punycode编码；以及字符详细信息分析功能。所有转换通过统一的入口函数调用，无需依赖第三方库，实现了轻量高效的编码转换方案。

2026-01-30 22:20:31 445

原创文本编码转换器在线工具分享

推荐一款基于Vue.js开发的在线文本编码转换器：支持12种格式互转（Base64、Unicode、UTF-8 Hex、HTML实体等），实时双向转换、自定义分隔符/前缀，纯前端运行，数据不上传，无广告，安全高效。

2026-01-30 22:09:41 376

原创 Claude Code can be used with your Claude subscription or billed based on APl usage through your

我用的是中转API。报这个错误是因为余额用完了。充值后重新打开VSCODE就行了。

2026-01-29 00:13:25 405

原创时间戳转换器在线工具分享

今天分享一个我用Vue3开发的实用工具——时间戳转换器。它能快速完成时间戳与日期之间的转换，支持多时区、智能检测格式，完全免费且保护隐私。时间戳是从 1970年1月1日 00:00:00 UTC 开始计算的秒数或毫秒数，是计算机表示时间的标准方式。秒级1706425716(10位数字)毫秒级(13位数字)时间戳全球统一、便于计算，但人类难以直接理解，因此需要转换工具。时间戳转换器是开发者和数据工作者的必备工具。我用 Vue3 开发这个工具，希望能帮助更多人高效处理时间数据。

2026-01-28 15:21:48 619

原创 Vue3时间戳转换器实现方案

/ 当前时间new Date() // 当前日期时间Date.now() // 当前时间戳(毫秒)// 从时间戳创建new Date(1706425716000) // 毫秒时间戳new Date(1706425716 * 1000) // 秒时间戳需要 * 1000// 从字符串创建new Date('2024-01-28') // ISO 格式new Date('2024-01-28 12:00:00') // 日期时间。

2026-01-28 14:50:40 553

原创日期计算器在线工具分享

日期计算器是一款专门用于处理日期相关计算的在线工具。这款工具基于现代化的Vue3框架开发,采用响应式设计,界面简洁美观,交互流畅。它可以帮助您快速完成日期加减、日期差值计算、工作日计算等常见操作,无需下载安装任何软件,打开浏览器即可使用。这是最常用的功能之一。您可以在指定日期的基础上,增加或减少天数、月数、年数,快速得到目标日期。计算合同到期日期(如:签约日期后90天)推算预产期或宝宝满月日期计算还款日、缴费截止日等规划旅行行程(出发日期后7天是什么时候)选择起始日期。

2026-01-26 20:47:23 517

原创 Vue3日期计算器实现方案

/ Tab 切换// 日期间隔计算// 日期加减计算// 工作日计算// 年龄计算// 将日期设为0,会自动回退到上月最后一天日期间隔计算:时间戳相减 → 转换为天数年月日逐级计算 → 处理借位日期加减计算:原生 Date API → 自动处理溢出年龄计算:年月日分别相减 → 逐级调整借位工作日计算:逐日遍历 → 判断星期几 → 统计分类核心原则利用原生 API: Date 对象的自动溢出处理边界处理: 防止负数、空值、非法日期精确计算: 考虑月份天数差异、闰年等特殊情况。

2026-01-26 20:34:40 559

原创第3章组件基础（一）组合式API、生命周期函数

Vue3支持选项式API和组合式API。其中，选项式API是从Vue2开始使用的一种写法，而Vue3新增了组合式API的写法。1.选项式API选项式API是一种通过包含多个选项的对象来描述组件逻辑的API，其常用的选项包括data、methods、computed、watch等。其中，data用于定义数据，methods用于定义方法，computed用于定义计算属性，watch用于定义侦听器。

2026-01-24 12:44:52 620

原创进制转换器在线工具分享

进制转换器使用文档什么是数制（基数）？数制，又称基数或进位制，定义了在位值计数法中使用多少个不同的数字来表示数值。日常生活中最常用的是十进制（基数10），使用数字0-9。计算机主要使用二进制（基数2），而程序员经常使用十六进制（基数16）和八进制（基数8）来更简洁地表示二进制数据。进制转换原理将一个数从一种进制转换为另一种进制涉及两个主要步骤：将源数字转换为十进制（基数10）：将每个数字乘以其位置值（基数^位置），然后求和使用连续除法将十进制结果转换为目标进制：除以目标基数并收集余数。

2026-01-23 19:26:24 66

原创 Vue3进制转换器实现方案

也就是最近写了个进制转换的小工具，顺手记一下核心的 JS 逻辑。工具截图：其实这东西真没必要搞复杂了，核心就一个思路。

2026-01-23 19:09:10 292

原创 Vue3项目中集成科学计算器的实现方案

架构设计: UI与计算引擎分离,通过桥接通信加载策略: 链式加载保证依赖顺序,添加重试机制命名冲突: 使用引用保存原始函数,避免全局污染生命周期: 正确管理资源加载和清理通过这种方式,我们成功将原生JavaScript计算器引擎集成到现代Vue3项目中,保持了代码的可维护性和扩展性。

2026-01-21 18:31:53 329

原创科学计算器在线工具分享

计算器使用说明基本操作鼠标点击网页计算器的[数字键]/[功能键]进行计算也可通过键盘上的数字键与加减乘除等符号按键进行计算键盘上的Backspace键，可删除上一个输入的内容键盘上的回车键Enter，相当于等号，会直接进行计算功能键说明AC清除显示区的数字或执行清除常量操作M+存储器的数字加上显示区的数字，计算结果并存入存储器中M-存储器的数字减去显示区的数字，计算结果并存入存储器中MR显示存储器中的数字到显示屏MC清除存储器中的记忆的内容Rad。

2026-01-21 18:31:04 38

原创切换窗口后kiro失去焦点问题

将window.customMenuBarAltFocus选项取消勾选。将window.titleBarStyle设置为custom模式。

2026-01-15 23:52:08 44

原创第2章 Vue.js开发基础（四）侦听器、样式绑定

在Vue中，开发者可以自定义方法来进行数据的更新操作，但是不能自动监听数据的状态。如果想在数据更新后进行相应的操作，可以通过侦听器来实现。侦听器通过watch()函数定义，watch()函数的语法格式如下。watch()函数有3个参数，下面对这3个参数分别进行讲解。第1个参数是侦听器的来源，侦听器的来源可以有以下4种。第2个参数是数据发生变化时要调用的回调函数，这个回调函数的第1个参数表示新值，即数据发生变化后的值，第2个参数表示旧值，即数据发生变化前的值。

2026-01-15 13:21:33 552

原创第2章 Vue.js开发基础（三）事件对象、事件修饰符

计算属性通过computed()函数定义，该函数的参数为一个回调函数，开发者需要在回调函数中实现计算功能，并在计算完成后返回计算后的数据，语法格式如下。const 计算属性名=computed(()=>{return 计算后的数据})</script>

2026-01-15 12:40:59 630

原创第2章 Vue.js开发基础（二）指令

指令是一种在模板中使用的带有-前缀的特殊属性，通过指令可以辅助开发者定义页面结构，使用简洁的代码实现复杂的功能。Vue中的指令按照不同的用途可以分为6类，分别是内容渲染指令、属性绑定指令、事件绑定指令、双向数据绑定指令、条件渲染指令、列表渲染指令。本节将围绕指令进行详细讲解。

2026-01-08 21:16:19 1021

原创批量更新文件夹内文件的上次修改时间

保留原时间：核心是提取原时间的，拼接今天的；随机时间：通过生成0-23的小时、0-59的分秒，再拼接今天的日期；实操建议：优先用「管理员身份」运行，按需选择「仅处理文件」或「包含文件夹」。

2026-01-08 00:38:47 264

原创 Idea中使用tomcat启动控制台乱码问题处理

打开tomcat的conf目录的logging.propoties文件，将所有UTF-8替换成GBK，不用重启idea，只需要重启tomcat。每个人环境都不一样，我这边只提供我的解决方案。tomcat版本10，idea版本2023；

2026-01-07 23:26:00 158

原创 eclipse下载maven依赖的方法

Maven 的核心作用之一就是彻底替代手动导入 jar 包的繁琐过程，而且还能解决手动导包带来的版本冲突、依赖缺失等问题，是 Java 项目中管理依赖的标准方式。pom.xml 就是 maven 的配置文件，用以描述项目的各种信息。

2026-01-06 23:47:03 222

原创 eclipse javaee 下载地址

eclipse javaee 下载地址：https://www.eclipse.org/downloads/packages/

2026-01-05 22:36:21 97

原创 vs2022安装教程

下载地址]：百度网盘 https://pan.baidu.com/s/1v34Hy4_Ni033bXSYZe38iA?pwd=6666 提取码：6666。

2026-01-05 22:34:20 172

原创第2章 Vue.js开发基础（一）单文件组件、数据绑定

由于数据和页面是分离的，在实现数据显示之前，需要先在<script>标签中定义组件所需的数据，具体语法格式如下。5. 数据名:数据值,6. ...7. }8. }9. }在上述语法格式中，<script>中的代码会在每次组件实例被创建的时候执行，其中，第2行代码中的是模块导出语法；第3~8行代码中的setup()函数是Vue3特有的，该函数是组合式API的起点，在函数中可以定义数据和方法，并且需要通过return关键字返回一个对象，用于将对象中的数据暴露给模板和组件实例；

2026-01-04 22:10:48 600