加密算法演示系统 (Encryption Algorithm Demonstration System)

在线演示地址

点击这里访问演示系统

项目简介

本项目是通信工程专业选修课的大作业成果。旨在设计并实现一个基于 Web 的加密算法可视化教学演示系统。

系统采用纯前端架构（HTML/CSS/JS），集成了从经典密码学（如凯撒密码）到现代分组密码（如 AES）以及视觉密码等多种算法。通过交互式的操作面板和动态的过程可视化，直观地展示了数据加密标准、密钥扩展、异或运算（XOR）、置换-替换网络（SPN）等核心密码学原理。

功能特性

1. 算法演示模块

系统包含以下 9 种主流与经典加密/哈希算法的完整实现与可视化：

• 凯撒密码 (Caesar Cipher): 经典的单表替换算法，支持自定义偏移量与模 26 运算演示。
• 一次性密码本 (One-Time Pad, OTP): 演示信息论安全（Perfect Secrecy）的原理，实现基于字符的模运算或异或操作。
• Playfair 密码: 基于 5x5 矩阵的双字母替换密码（Digraph Substitution），演示矩阵生成与行列置换规则。
• 流密码 (Stream Cipher / RC4-XOR): 基于伪随机数生成器 (PRNG) 产生密钥流，演示明文流与密钥流的逐字节异或过程。
• DES (Data Encryption Standard): 经典分组密码，完整展示 Feistel 网络结构、16 轮迭代、S 盒替换及子密钥生成过程。
• AES-256 (Advanced Encryption Standard): 现代分组密码标准，演示 SPN 结构，包括字节代换 (SubBytes)、行移位 (ShiftRows)、列混合 (MixColumns) 及轮密钥加 (AddRoundKey)。
• 视觉密码 (VCS, Visual Cryptography): 实现 (2, 2) 门限方案，利用像素扩展技术将图像分解为两张分存图 (Shares)，演示基于人眼视觉系统的物理叠加解密。
• 扩展视觉密码 (EVCS): 在 VCS 基础上提供新的视觉加密变体，支持生成更具可读性的分享图/载体图，演示扩展方案的像素映射流程。
• MD5 (Message Digest 5): 演示单向哈希函数的摘要生成与碰撞风险科普（仅用于教学演示，不用于安全场景）。
• RSA 公钥密码: 展示密钥生成（质数选择、模数 N、e/d 计算）、加/解密与签名验证的基本流程（教学演示版本）。

2. 系统管理功能

• 用户认证模拟: 实现基于 SHA-256 加盐哈希 (Salted Hash) 的登录与注册流程，模拟真实安全环境下的密码存储（非明文存储）。
• 后台管理: 提供管理员面板，支持查看用户列表、重置密码及权限管理（普通用户/管理员）。
• 主题切换: 支持明亮/暗黑模式 (Light/Dark Mode) 切换，适配不同演示环境。

技术栈

• 核心语言: JavaScript (ES6+), HTML5, CSS3
• 数据存储: LocalStorage / SessionStorage (纯前端模拟数据库，无后端依赖)
• 加密库: 原生实现各算法逻辑，辅助功能使用 Web Crypto API (SHA-256)。

快速开始

本项目为纯静态网页应用，无需安装 Node.js 环境或配置数据库。

1. 下载/解压 项目文件夹。
2. 双击打开根目录下的 index.html 文件即可运行。
3. 默认管理员账号（用于演示）：
   • 用户名: admin
   • 密码: admin

项目目录结构

.
├── css/
│   └── style.css           # 全局样式定义，包含 CSS Variables 主题配置
├── docs/                   # 算法原理文档 (Markdown 格式)
│   ├── aes.md
│   ├── des.md
│   ├── caesar.md
│   ├── ...
├── js/
│   ├── algorithms/         # 核心算法实现目录
│   │   ├── aes.js          # AES-128/256 实现 (SPN 结构)
│   │   ├── des.js          # DES 实现 (Feistel 结构)
│   │   ├── stream.js       # 流密码实现 (RC4 变体)
│   │   ├── caesar.js       # 凯撒密码
│   │   ├── onetimepad.js   # 一次性密码本
│   │   ├── playfair.js     # Playfair 密码
│   │   ├── vcs.js          # 视觉密码 (VCS)
│   │   ├── evcs.js         # 扩展视觉密码 (EVCS)
│   │   ├── md5.js          # MD5 哈希演示
│   │   ├── rsa.js          # RSA 公钥密码演示
│   │   ├── ...
│   ├── auth.js             # 用户认证类 (SHA-256 加盐哈希)
│   ├── data.js             # 静态内容加载与配置
│   ├── main.js             # 入口逻辑与 DOM 事件绑定
│   ├── theme.js            # 主题切换逻辑
│   └── utils.js            # 工具函数 (Hex转换, Clipboard 等)
└── index.html              # 系统主页入口

核心算法实现细节说明

1. DES 与 AES 分组密码

• DES: 严格遵循 FIPS 46-3 标准。实现了 64 位块处理，通过初始置换 (IP) 和逆初始置换 (FP) 封装 16 轮 Feistel 迭代。代码中显式展示了每一轮的 L/R 寄存器状态。
• AES: 实现了 GF(2^8) 有限域上的多项式乘法用于列混合 (MixColumns)。通过查找表 (S-Box) 优化字节代换效率。支持加密与解密的逆运算流程。

2. 流密码与随机性

• 采用类似 RC4 的 KSA (密钥调度算法) 和 PRGA (伪随机生成算法) 产生密钥流。

• 强调了流密码中“禁止密钥重用”的安全原则（虽然演示中允许用户手动输入，但在文档中强调了 Nonce/IV 的必要性）。

3. 视觉密码 (VCS)

• 利用 HTML5 Canvas API 进行像素级操作。
• 预处理: 将上传图片灰度化并二值化（Binarization）。
• 分发: 遍历二值化矩阵，根据 (2, 2) 方案的概率矩阵生成两张扩展后的噪点图。
• 恢复: 通过 Canvas 的 ImageData 模拟两张胶片的物理叠加效果（逻辑 OR 运算模拟光线遮挡）。

4. RSA 与 MD5

• RSA: 以简化的教学流程演示密钥生成（选取大质数 p、q，计算 N、φ(N)、选择 e 并求解 d），以及基于模幂运算的加解密/签名验证。
• MD5: 展示将任意长度消息压缩为 128 位摘要的过程，用于科普单向性与碰撞风险（提醒：实际安全应用不推荐使用 MD5）。

声明

• 本项目代码主要用于教学演示与学术交流，展示算法内部逻辑与数学原理。
• 在实际生产环境中，请勿直接使用本项目中的算法实现（特别是 JS 原生的 DES/RC4 实现），应使用经过严格审计的工业级密码库（如 OpenSSL, Web Crypto API）。

---

Author: ZZ Course: 通信工程专业选修课 - 信息安全技术