网站安全风控系统 (Web Security System)

基于 Vue 3 + WebAssembly (Rust) + Golang + Redis 的高性能 Web 端风控系统。 采用 "Bento Glass" 拟态风格 UI，结合 Hybrid Binary Transport（混合二进制传输）协议，提供极致的安全性和用户体验。

🎯 核心特性

🔐 安全机制

• 动态行为签名: 使用 Rust (WASM) 生成高强度 HMAC-SHA256 签名 (x-sec-token)。
• 混合二进制传输: 核心指纹接口 (/api/fingerprint/generate) 使用 Gzip 压缩二进制流 请求，响应采用 AES-256 加密二进制流，网络抓包显示乱码。
• 防重放攻击: 基于 Nonce + Timestamp 的一次性请求验证。
• 序列号验证: x-sec-seq 严格递增检查，防止请求跳步或重放。
• 环境指纹: 结合 Canvas, Audio, WebGL 等多维度浏览器指纹识别。
• 风险评分引擎: 后端实时计算风险分值，自动拦截异常行为 (>70 分阻断)。

🎨 用户体验 (Bento Glass UI)

• 拟态设计: 采用 "Bento Grid" 布局 + "Glassmorphism" 玻璃拟态风格。
• 实时数据流: 终端风格的网络流监控，实时显示加密/解密数据。
• 国际化 (i18n): 支持中/英双语切换。
• 无感验证: 用户无感知的后台静默验证。

📦 技术栈

组件	技术	说明
前端	Vue 3, TypeScript, Vite	现代化 SPA，Bento Glass UI
SDK	Rust → WebAssembly	核心签名逻辑，抗逆向分析
后端	Golang, Gin	高并发 API 服务，AES 加解密
存储	Redis	会话管理，密钥存储，指纹黑名单
协议	Hybrid Transport	Gzip 压缩 + AES-256 加密 + JSON

🚀 快速开始

前置要求

• Node.js 18+
• Go 1.21+
• Rust 1.75+ (wasm-pack)
• Redis 7.x

1. 安装依赖 & 环境配置

Rust (WASM)

# 安装构建工具
cargo install wasm-pack
rustup target add wasm32-unknown-unknown

2. 构建 WebAssembly SDK

必须先构建 WASM 模块，前端才能正常运行。

cd wasm-sdk
./build.sh

3.后端配置与启动

后端需要通过 .env 文件配置 Redis 连接。

1. 创建 backend/.env 文件:

   REDIS_ADDR=localhost:6379
   REDIS_PASSWORD=your_password
   REDIS_DB=0

2. 启动后端:

   cd backend
   go run main.go

   后端服务运行在 http://localhost:8080

4. 前端启动

cd frontend
npm install
npm run dev

前端页面运行在 http://localhost:5173

🧪 验证与测试

1. 访问前端: 打开浏览器访问 http://localhost:5173。
2. 初始化: 页面加载时会自动进行 WASM 初始化和指纹生成。
3. 验证请求: 点击 "验证请求" (Normal Request) 按钮。
   • 观察 "Network Stream" 面板，看到加密的流量日志。
   • 观察 "Terminal" 输出，确认 x-sec-token 验证通过 (200 OK)。
4. 攻击模拟:
   • 点击 "重放攻击" (Replay Attack) 按钮。
   • 系统应拦截请求并返回 403 Forbidden (Risk API Blocked)。

📂 项目结构

safe/
├── frontend/              # Vue 3 前端 (Bento UI)
│   ├── src/
│   │   ├── sdk/          # 安全 SDK (TypeScript)
│   │   │   ├── wasm/     # 编译后的 WASM 产物
│   │   │   ├── index.ts  # SDK 入口
│   │   │   └── encryption.ts # AES/Gzip 加解密工具
│   │   └── App.vue       # 主界面
│
├── wasm-sdk/             # Rust 源码
│   ├── src/lib.rs        # 签名与验证核心逻辑
│   └── build.sh          # 构建脚本
│
├── backend/              # Golang 后端
│   ├── main.go           # 入口 (加载 .env)
│   ├── handler/          # 业务逻辑
│   ├── middleware/       # 行为检测中间件 (验签)
│   └── utils/            # 加解密工具 (AES, Gzip)
│
└── docker/               # 部署配置

� 协议细节

请求头 (Headers)

所有受保护接口均包含 x-sec-* 扩展头：

x-sec-token: <HMAC-SHA256 Signature>
x-sec-seq: <Sequence Number>
x-sec-nonce: <Random UUID>
x-sec-ts: <Timestamp>
x-sec-fp: <Browser Fingerprint>
x-sec-pid: <Page ID>

混合传输 (Hybrid Transport)

• Request: POST /api/fingerprint/generate
  • Body: Gzip 压缩的 JSON 数据
  • Content-Type: application/octet-stream
• Response:
  • Body: AES-256-CBC 加密的二进制数据
  • Content-Type: application/octet-stream

📄 License

MIT