slider-captcha-sdk 1.0.20 → 1.0.21

package/README.md

@@ -3,17 +3,18 @@
 [![npm version](https://badge.fury.io/js/slider-captcha-sdk.svg)](https://badge.fury.io/js/slider-captcha-sdk)
 [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
 
-纯JavaScript滑块验证码SDK，无外部依赖，支持多种模块格式。
+纯JavaScript滑块验证码SDK和密码校验工具，无外部依赖，支持多种模块格式。
 
 ## ✨ 特性
 
-- 🚀 **零依赖** - 纯JavaScript实现，无外部依赖
-- 📱 **响应式** - 完美支持移动端和桌面端
+- 🚀 **零依赖** - 纯JavaScript实现，无外部依赖（除密码校验需要JSEncrypt）
 - 🎨 **可定制** - 丰富的配置选项和样式定制
 - 📦 **多格式** - 支持UMD、ES Module、CommonJS
 - 💪 **TypeScript** - 完整的TypeScript类型定义
 - 🔧 **易集成** - 简单的API，快速集成
 - 🛡️ **安全可靠** - 防暴力破解，多重验证
+- 🔐 **密码校验** - 内置RSA加密密码校验功能
+- ⚡ **高性能** - 优化的代码结构和缓存机制
 
 ## 📦 安装
 
@@ -29,9 +30,11 @@ yarn add slider-captcha-sdk
 
 ## 🚀 快速开始
 
-### ES Module
+### 滑块验证码
+
+#### ES Module
 ```javascript
-import { PopupSliderCaptcha}  from 'slider-captcha-sdk'
+import { PopupSliderCaptcha } from 'slider-captcha-sdk'
 
 const captcha = new PopupSliderCaptcha({
   apiUrl: '/api/captcha',
@@ -48,11 +51,11 @@ const captcha = new PopupSliderCaptcha({
 captcha.show()
 ```
 
-### UMD (浏览器直接引入)
+#### UMD (浏览器直接引入)
 ```html
-<script src="https://unpkg.com/slider-captcha-sdk/dist/slider-captcha.min.js"></script>
+<script src="https://unpkg.com/slider-captcha-sdk/dist/index.min.js"></script>
 <script>
-  const captcha = new SliderCaptcha({
+  const captcha = new PopupSliderCaptcha({
     apiUrl: '/api/captcha',
     verifyUrl: '/api/captcha/verify'
   })
@@ -60,78 +63,203 @@ captcha.show()
 </script>
 ```
 
-### CommonJS
+#### 使用baseUrl配置域名
+```javascript
+// 方式1：使用baseUrl自动拼接域名
+const captcha = new PopupSliderCaptcha({
+  baseUrl: 'https://api.example.com',
+  apiUrl: '/api/captcha',        // 自动拼接为 https://api.example.com/api/captcha
+  verifyUrl: '/api/captcha/verify' // 自动拼接为 https://api.example.com/api/captcha/verify
+})
+
+// 方式2：直接使用完整URL（优先级更高）
+const captcha2 = new PopupSliderCaptcha({
+  baseUrl: 'https://api.example.com',
+  apiUrl: 'https://other-api.com/api/captcha', // 使用完整URL，不会拼接baseUrl
+  verifyUrl: '/api/captcha/verify' // 仍会拼接为 https://api.example.com/api/captcha/verify
+})
+```
+
+#### CommonJS
 ```javascript
-const SliderCaptcha = require('slider-captcha-sdk')
+const { PopupSliderCaptcha } = require('slider-captcha-sdk')
 
-const captcha = new SliderCaptcha()
+const captcha = new PopupSliderCaptcha()
 captcha.show()
 ```
 
+### 密码校验
+
+#### ES Module
+```javascript
+import { PasswordValidator, validatePassword } from 'slider-captcha-sdk'
+
+// 方式1：使用类
+const validator = new PasswordValidator({
+  publicKeyUrl: '/api/getPublicKey',
+  validateUrl: '/api/validatePassword'
+})
+
+const result = await validator.validatePassword('password123', 'username')
+
+// 方式2：使用便捷函数
+const result = await validatePassword('password123', 'username', {
+  publicKeyUrl: '/api/getPublicKey',
+  validateUrl: '/api/validatePassword'
+}, {
+  // additionalData 可选
+})
+
+// 方式3：使用baseUrl配置域名
+const validator = new PasswordValidator({
+  baseUrl: 'https://api.example.com',
+  publicKeyUrl: '/microservice/strongPassword/getPublicKey', // 自动拼接为 https://api.example.com/microservice/strongPassword/getPublicKey
+  validateUrl: '/microservice/strongPassword/checkPassword'  // 自动拼接为 https://api.example.com/microservice/strongPassword/checkPassword
+})
+```
+
 ## 📖 API文档
 
-### 配置选项
+### 滑块验证码 (PopupSliderCaptcha)
+
+#### 配置选项
 
 | 参数 | 类型 | 默认值 | 描述 |
 |------|------|--------|---------|
-| `width` | `number` | `350` | 验证码宽度 |
-| `height` | `number` | `200` | 验证码高度 |
-| `sliderSize` | `number` | `42` | 滑块大小 |
+| `width` | `number` | `320` | 验证码宽度 |
+| `height` | `number` | `155` | 验证码高度 |
+| `sliderSize` | `number` | `38` | 滑块大小 |
 | `maxRetries` | `number` | `3` | 最大重试次数 |
 | `timeout` | `number` | `30000` | 超时时间(ms) |
 | `apiUrl` | `string` | `'/api/captcha'` | 获取验证码接口 |
 | `verifyUrl` | `string` | `'/api/captcha/verify'` | 验证接口 |
+| `baseUrl` | `string` | `''` | 基础域名，如果apiUrl和verifyUrl不包含域名则拼接此域名 |
+| `throttleDelay` | `number` | `16` | 节流延迟(ms) |
+| `clickMaskClose` | `boolean` | `false` | 点击遮罩关闭 |
 | `onSuccess` | `function` | `undefined` | 验证成功回调 |
 | `onFail` | `function` | `undefined` | 验证失败回调 |
 | `onClose` | `function` | `undefined` | 关闭回调 |
 
-### 实例方法
+#### 实例方法
 
-#### `show(): Promise<any>`
+##### `show(): Promise<any>`
 显示验证码弹窗
 
-#### `hide(): void`
+##### `hide(): void`
 隐藏验证码弹窗
 
-#### `refresh(): Promise<void>`
+##### `refresh(): Promise<void>`
 刷新验证码
 
-#### `destroy(): void`
+##### `destroy(): void`
 销毁实例，清理所有事件监听器
 
-#### `reset(): void`
-重置验证码状态
+#### 静态属性
+
+##### `PopupSliderCaptcha.DEFAULTS`
+默认配置对象
 
-### 静态方法
+##### `PopupSliderCaptcha.CSS_CLASSES`
+CSS类名映射
 
-#### `SliderCaptcha.create(options): PopupSliderCaptcha`
-创建验证码实例
+##### `PopupSliderCaptcha.ERROR_TYPES`
+错误类型枚举
 
-#### `SliderCaptcha.show(options): Promise<PopupSliderCaptcha>`
-快速显示验证码
+### 密码校验 (PasswordValidator)
+
+#### 配置选项
+
+| 参数 | 类型 | 默认值 | 描述 |
+|------|------|--------|---------|
+| `publicKeyUrl` | `string` | `'/microservice/strongPassword/getPublicKey'` | 获取公钥接口 |
+| `validateUrl` | `string` | `'/microservice/strongPassword/checkPassword'` | 密码校验接口 |
+| `baseUrl` | `string` | `''` | 基础域名，如果URL不包含域名则拼接此域名 |
+| `timeout` | `number` | `10000` | 超时时间(ms) |
+| `headers` | `object` | `{}` | 请求头 |
+| `cacheDuration` | `number` | `300000` | 缓存时长(ms) |
+
+#### 实例方法
+
+##### `validatePassword(password, userName, additionalData): Promise<Object>`
+校验密码
+
+**参数：**
+- `password` (string): 密码
+- `userName` (string): 用户名  
+- `additionalData` (object): 额外数据（可选）
+
+**返回值：**
+```javascript
+{
+  success: boolean,
+  data: any,
+  message: string,
+  code: string,
+  originalResponse: object
+}
+```
+
+##### `encryptPassword(password, publicKey): string`
+加密密码
+
+##### `getPublicKey(): Promise<string>`
+获取公钥
+
+##### `destroy(): void`
+销毁实例
+
+#### 静态方法
+
+##### `validatePassword(password, userName, options, additionalData): Promise<Object>`
+便捷的密码校验函数
+
+**参数：**
+- `password` (string): 密码
+- `userName` (string): 用户名
+- `options` (object): 配置选项
+- `additionalData` (object): 额外数据（可选）
 
 ## 🔧 服务端接口
 
-### 获取验证码 (GET /api/captcha)
+### 滑块验证码接口
+
+#### 获取验证码 (POST /api/captcha)
+
+**请求格式：**
+```json
+{
+  "timestamp": 1640995200000
+}
+```
 
 **响应格式：**
 ```json
 {
-  "id": "captcha_id",
-  "backgroundImage": "data:image/png;base64,...",
-  "sliderImage": "data:image/png;base64,...",
-  "y": 120
+  "success": true,
+  "data": {
+    "id": "captcha_id",
+    "backgroundImage": "data:image/png;base64,...",
+    "sliderImage": "data:image/png;base64,...",
+    "y": 120,
+    "nonceStr": "random_string"
+  }
 }
 ```
 
-### 验证接口 (POST /api/captcha/verify)
+#### 验证接口 (POST /api/captcha/verify)
 
 **请求格式：**
 ```json
 {
-  "id": "captcha_id",
-  "x": 200,
-  "times": [100, 200, 300]
+  "loginVo": {
+    "nonceStr": "random_string",
+    "value": 200
+  },
+  "dragEventList": [
+    {"time": 100, "position": 50},
+    {"time": 200, "position": 100},
+    {"time": 300, "position": 200}
+  ]
 }
 ```
 
@@ -140,7 +268,43 @@ captcha.show()
 {
   "success": true,
   "message": "验证成功",
-  "token": "verification_token"
+  "data": {
+    "token": "verification_token"
+  }
+}
+```
+
+### 密码校验接口
+
+#### 获取公钥 (GET /microservice/strongPassword/getPublicKey)
+
+**响应格式：**
+```json
+{
+  "success": true,
+  "data": "-----BEGIN PUBLIC KEY-----\nMIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEA...\n-----END PUBLIC KEY-----"
+}
+```
+
+#### 密码校验 (POST /microservice/strongPassword/checkPassword)
+
+**请求格式：**
+```json
+{
+  "userName": "username",
+  "password": "encrypted_password",
+  "timestamp": 1640995200000
+}
+```
+
+**响应格式：**
+```json
+{
+  "success": true,
+  "message": "密码校验成功",
+  "data": {
+    "valid": true
+  }
 }
 ```
 
@@ -149,6 +313,7 @@ captcha.show()
 你可以通过CSS覆盖默认样式：
 
 ```css
+/* 使用CSS类名 */
 .slider-captcha-modal {
   border-radius: 12px;
   box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
@@ -157,6 +322,48 @@ captcha.show()
 .slider-captcha-btn {
   background: linear-gradient(45deg, #667eea 0%, #764ba2 100%);
 }
+
+/* 或者使用CSS变量 */
+:root {
+  --sc-primary: #409eff;
+  --sc-success: #67c23a;
+  --sc-danger: #f56c6c;
+  --sc-border: #e4e7eb;
+  --sc-bg: linear-gradient(90deg, #f7f9fa 0%, #e8f4fd 100%);
+  --sc-text: #333;
+  --sc-text-light: #999;
+  --sc-shadow: 0 4px 20px rgba(0,0,0,.3);
+  --sc-radius: 8px;
+  --sc-transition: .3s ease;
+}
+```
+
+## 🔧 开发
+
+### 安装依赖
+```bash
+npm install
+```
+
+### 开发模式
+```bash
+npm run dev
+```
+
+### 构建
+```bash
+npm run build:prod
+```
+
+### 代码检查
+```bash
+npm run lint
+npm run lint:fix
+```
+
+### 完整检查
+```bash
+npm run check
 ```
 
 ## 📄 许可证
@@ -170,3 +377,13 @@ MIT License - 详见 [LICENSE](LICENSE) 文件
 ## 📞 支持
 
 如果你觉得这个项目有用，请给它一个 ⭐️
+
+## 📝 更新日志
+
+### v1.0.20
+- ✅ 添加密码校验功能
+- ✅ 优化代码结构和性能
+- ✅ 添加ESLint配置
+- ✅ 完善TypeScript类型定义
+- ✅ 修复并发请求问题
+- ✅ 优化打包配置