纯HTML本地版社工密码生成器：原理、实现与安全自测实战

这阵子我抽空把以前写的一个小工具重新翻出来打磨了一遍，就是标题里这个“纯HTML本地版社工密码生成器”，也叫SocialEngineeringDictionaryGenerator。说白了，它就是一个只有单个网页文件、不需要联网、不需要装数据库的密码词典生成页面，用来根据某个人公开可见的基础信息，比如姓名拼音、出生年月、手机号分段、常用网名这些，在本机直接展开出一批“大概率会被本人拿来当密码”的候选组合。

很多人一听到“社工密码生成器”就觉得是搞攻击的坏东西，这个误会挺大。我在安全测试和防护意识培训里经常要用到类似的字典，不是为了拿它去撞谁的账号，而是想验证一个问题：如果一个人习惯用姓名首字母加生日当密码，或者喜欢把手机号后四位拼在常见单词后面，那他的密码到底有多容易被枚举出来。这个工具就是干这个用的，它能在不把任何隐私信息上传到云端的前提下，把这个验证过程放在你自己的浏览器里完成。

项目是完全开源的思路，核心就是一个HTML文件加上内嵌CSS和JavaScript，没有框架、没有依赖，双击就能用。这篇文章我就把这个项目的设计思路、核心实现、实操用法和我在写它时踩过的一些坑全部拆开讲一遍，给同样有密码安全自测需求或者纯想用前端技术做点实用工具的朋友一些参考。

1. 先搞懂这个项目的真实需求和使用场景

1.1 它到底在解决什么问题

先说个真实的背景。我平时在做账号安全评估时候，偶尔会遇到客户问我：“我的密码够不够安全？”我一般是不会直接评价的，因为密码安不安全，不看长度也不看复杂度，而是看“别人能不能猜到”。

能不能猜到就有讲究了。如果你密码是“Qwer1234”，看起来又有大小写又有数字，但它其实是一个全网最常见的弱密码之一。如果换成“Zhangwei19930815”，长度不短、还带大小写和数字，看起来很强，可只要有人知道你的名字叫张伟、生日是1993年8月15日，这串密码就完全没有秘密可言。

问题的根源就在于，人是懒惰的，也倾向于用有意义的、能记住的信息来构造密码。这个“有意义的信息”往往就是自己的姓名、生日、手机号、邮箱、家人的名字、宠物的名字、喜欢的球星、常用的口头禅，再加上顶多一两次变换规则。所谓“社工密码生成器”，其实就是把人在构造密码时的这些偏好转换成规则化、枚举式的组合，形成一串候选密码列表，然后用来评估一个真实密码是否身处其中。

所以，这个项目解决的并不仅仅是一个“生成密码”的问题，它的核心价值是让用户直观地意识到：以我的公开信息为种子，机器可以用极低成本的枚举方法生成多少种可能的密码组合？如果我自己设置的密码就落在这些组合里面，那我的安全性是零。

1.2 为什么非要做成本地版，而不是在线工具

这个点是我在设计时最坚持的地方。网上类似的密码组合生成器不少见，但几乎都是在线网页，点开一个网页往里输入信息，结果就在服务器端走了一圈。先不说网站本身是否可靠，单就“输入自己的姓名、手机号、邮箱、生日”这一条，我就非常不建议把这类个人隐私数据交给任何第三方网站处理。谁也没法保证你输入的原始信息不会被留下来、被记录、被拿去二次利用。

所以这个工具从一开始就定了一个硬性标准：完全本地运行。整个项目就是一份后缀为html的纯静态文件，所有计算逻辑都用JavaScript写死在这一个文件里。当你在浏览器里双击打开这个文件时，它运行在file协议下，不发起任何网络请求，不调用任何外部接口，更不会把数据发出去。输入的信息只存在于当前页面当前时刻的浏览器内存里，关掉页面就什么都没了。

这也是为什么我把技术方案定位在“纯HTML + 原生CSS + 原生JavaScript”，不引入框架、不打包、不构建。一个文件，一个承诺：数据不出本机。如果你的使用场景比较敏感，甚至可以在断网情况下打开它，效果完全不受影响。

1.3 哪些人适合使用这个工具

从我的实际经验来看，主要会有三类人来用这个页面。

第一类是安全测试工程师。在做授权渗透测试或红队演练的时候，往往需要针对目标人员生成一份“关键词规则字典”，再交给密码喷洒或登录枚举类工具去验证弱口令。这时候本地版单文件工具非常顺手，拷到内网机器里就能用，不依赖外网，也不容易留下痕迹。

第二类是安全意识培训讲师。我在做员工安全培训时，特别喜欢在现场做一个小互动：让一位志愿者上台，输入自己的姓名拼音和出生年份，两秒钟后生成几百个候选密码，然后问大家：“你觉得用个人信息生成的密码，能算安全密码吗？”这个演示效果远比讲一堆理论要好，几乎每次都有同事听完立刻去改密码。

第三类其实是最重要的——普通个人用户，用来自查。你可以把自己的常用密码结构输入进去，看看这个密码是不是建立在公开信息之上的。如果是，其实你已经在用“谁都能猜到”的方式守护你最敏感的数字资产了。

我当然也会强调：请务必只对自己本人的信息、或你拥有明确授权和知情同意的情况下使用。用这个东西针对任何真实第三方个人制作字典，在没有获得授权的前提下，既突破道德底线，也涉及违法风险，这一点我们后面还会专门展开讲。

2. 核心设计拆解：一个页面如何组织完整的生成流程

2.1 整体信息架构：从输入到输出的三个大区

我把这个页面拆成了三个视觉和功能清晰的大区：左侧或上方的个人信息输入区，中间的规则设置与生成控制区，以及下方的结果预览与导出区。

这个布局看似简单，实际上是有讲究的。输入区决定“种子”，也就是所有变换的原材料；规则区决定“怎么变”，控制枚举的深度和广度；结果区展示“生成物的集合”，让人对输出规模有直观把握。

输入区我划分了11个基础字段，都是现实中人们构造密码时最容易用到的基本元素：中文姓名、姓名拼音全拼、拼音首字母、出生年、出生月日、手机号、常用邮箱用户名、QQ号、英文网名、关键数字（比如纪念日），再加一个自定义关键词标签。

大多数人乍一看可能觉得字段好多，但实际用下来就会发现，这些字段基本上就是一个人在社交平台主页里能公开看到的全部画像信息。尤其是QQ号和邮箱用户