HTML代码加密工具

HTML代码加密工具是一款在线前端代码加密工具，基于单页应用构建，支持对 HTML 源码进行加密混淆处理，加密后页面运行效果完全不变，有效防止源代码被复制、盗用、篡改，适合站长、前端开发者保护网站源码、防止源码泄露。

本项目为独立单页应用，已集成SEO优化、社交分享、异常监控、路由跳转等能力，开箱即用。

核心功能

1. HTML代码一键加密- 加密后网页功能、样式、交互完全不变

– 支持多层混淆、字符转义、代码压缩

– 自动去除多余空格、注释，精简源码体积

2. 实时预览对比- 加密前/加密后效果实时查看

3. 复制/下载导出- 一键复制加密后代码

– 直接下载加密HTML文件

4. SEO与分享优化- 内置完整 meta 标签、OG、Twitter 社交协议

– 支持微信、社交平台分享卡片展示

5. 异常资源监控- 自动监听脚本加载失败，异常上报

6. 路由兼容处理- 支持内部路由、外部链接、新窗口跳转

– 适配哈希路由与 history 模式

技术架构

– 构建方式：Vite 单页应用打包

– 主入口： index.html

– 核心资源：-  index-ioB0BHD-.js  应用主脚本

–  index-CmRiEske.css  全局样式

–  fonts-code.css  代码字体样式

– 第三方依赖：妙达平台 SDK（分享、埋点、应用初始化）

– 无后端依赖，纯前端本地加密，数据不上传服务器

文件结构

plaintext

html-encrypt-tool/

├── index.html                  # 入口页面（主文件）

├── index-ioB0BHD-.js           # 打包后JS主程序

├── index-CmRiEske.css          # 全局样式文件

├── fonts-code.css              # 代码编辑器字体样式

├── favicon.ico                 # 网站图标

├── app-789zan5upssh_xxx.png    # 分享封面图

部署方式

1. 静态部署（推荐）

直接将所有文件上传至静态网站服务器即可运行：

– Nginx / Apache

– 宝塔面板静态站点

– GitHub Pages / Vercel / Netlify

– 阿里云OSS、腾讯云COS、七牛云等对象存储

2. 本地运行

直接双击  index.html  用浏览器打开即可使用（部分浏览器本地模式分享功能受限，建议部署到线上）。

使用教程

1. 打开工具页面

2. 将需要保护的 HTML 源码粘贴至输入框

3. 选择加密强度（基础/高级/深度混淆）

4. 点击 开始加密

5. 预览效果无误后，复制或下载加密后的代码

6. 替换原网站 HTML 文件即可

加密特点：浏览器正常解析运行，查看源代码无法直接获取原始代码。

配置说明

1. 修改网站信息

在  index.html  头部直接修改以下内容：

–  title  网站标题

–  description  网站描述

–  keywords  关键词

– OG、Twitter 分享标题、描述、图片

2. 修改分享配置

在页面底部  miaoda.init  中修改分享内容：

javascript

share: {

title: “HTML代码加密工具”,

desc: “一键加密HTML代码，确保运行效果不变，保护您的源代码安全无虞。”,

image: “xxx.png”

}

3. 关闭第三方SDK

删除底部  miaoda-external.js  加载代码即可移除平台统计与分享SDK。

浏览器兼容

✅ Chrome / Edge / Firefox

✅ 360浏览器、QQ浏览器、Safari

✅ 手机端微信、内置浏览器

❌ IE浏览器（不支持）

注意事项

1. 仅加密HTML代码，不加密外部 CSS、JS 文件（如需保护可单独加密JS）

2. 加密不会影响 SEO 与网页加载速度

3. 不支持服务端动态渲染页面（PHP/ASP/JSP等）

4. 深度加密可能会轻微增大文件体积

下载方式：