slider-captcha-sdk 1.0.18 → 1.0.19

package/dist/index.esm.js

@@ -10,22 +10,22 @@ class PopupSliderCaptcha {
     sliderSize: 38,
     maxRetries: 3,
     timeout: 30000,
-    apiUrl: "/api/captcha",
-    verifyUrl: "/api/captcha/verify",
+    apiUrl: '/api/captcha',
+    verifyUrl: '/api/captcha/verify',
     throttleDelay: 16,
-    clickMaskClose: false
+    clickMaskClose: false,
   }
 
   static CSS_CLASSES = {
-    overlay: "slider-captcha-overlay",
-    modal: "slider-captcha-modal",
-    header: "slider-captcha-header",
-    container: "slider-captcha-container",
-    track: "slider-captcha-track",
-    btn: "slider-captcha-btn",
-    hint: "slider-captcha-hint",
-    loading: "slider-captcha-loading",
-    error: "slider-captcha-error"
+    overlay: 'slider-captcha-overlay',
+    modal: 'slider-captcha-modal',
+    header: 'slider-captcha-header',
+    container: 'slider-captcha-container',
+    track: 'slider-captcha-track',
+    btn: 'slider-captcha-btn',
+    hint: 'slider-captcha-hint',
+    loading: 'slider-captcha-loading',
+    error: 'slider-captcha-error',
   }
 
   // 优化：提取CSS样式为独立方法，减少主体代码长度
@@ -39,29 +39,26 @@ class PopupSliderCaptcha {
     MAX_RETRY_ATTEMPTS: 3,
     DEFAULT_TIMEOUT: 30000,
     FLOATING_TIME_DURATION: 2500,
-    THROTTLE_DELAY: 16
+    THROTTLE_DELAY: 16,
   }
 
-  // 优化：添加错误类型枚举
   static ERROR_TYPES = {
     NETWORK_ERROR: 'NETWORK_ERROR',
     TIMEOUT_ERROR: 'TIMEOUT_ERROR',
     VALIDATION_ERROR: 'VALIDATION_ERROR',
     IMAGE_LOAD_ERROR: 'IMAGE_LOAD_ERROR',
-    CAPTCHA_DATA_ERROR: 'CAPTCHA_DATA_ERROR'
+    CAPTCHA_DATA_ERROR: 'CAPTCHA_DATA_ERROR',
   }
 
   constructor(options = {}) {
-    // 优化：合并默认配置，使用常量
     this.options = {
       ...PopupSliderCaptcha.DEFAULTS,
       ...options,
       timeout: options.timeout || PopupSliderCaptcha.CONSTANTS.DEFAULT_TIMEOUT,
       maxRetries: options.maxRetries || PopupSliderCaptcha.CONSTANTS.MAX_RETRY_ATTEMPTS,
-      throttleDelay: options.throttleDelay || PopupSliderCaptcha.CONSTANTS.THROTTLE_DELAY
+      throttleDelay: options.throttleDelay || PopupSliderCaptcha.CONSTANTS.THROTTLE_DELAY,
     };
 
-    // 优化：初始化所有属性
     this.elements = {};
     this.state = this.createInitialState();
     this.captchaData = null;
@@ -74,10 +71,8 @@ class PopupSliderCaptcha {
     this.imageCache = new Map();
     this.abortController = null;
 
-    // 优化：使用箭头函数绑定this，避免重复bind调用
     this.throttledHandleMove = this.throttle((e) => this.handleMove(e), this.options.throttleDelay);
 
-    // 优化：添加错误处理
     try {
       this.init();
     } catch (error) {
@@ -86,7 +81,6 @@ class PopupSliderCaptcha {
     }
   }
 
-  // 优化：提取初始状态创建为独立方法
   createInitialState() {
     return {
       isVisible: false,
@@ -94,7 +88,7 @@ class PopupSliderCaptcha {
       currentX: 0,
       startX: 0,
       retryCount: 0,
-      isLoading: false
+      isLoading: false,
     }
   }
 
@@ -105,15 +99,14 @@ class PopupSliderCaptcha {
   }
 
   injectStyles() {
-    if (document.querySelector("#slider-captcha-styles")) return
+    if (document.querySelector('#slider-captcha-styles')) return
 
-    const style = document.createElement("style");
-    style.id = "slider-captcha-styles";
+    const style = document.createElement('style');
+    style.id = 'slider-captcha-styles';
     style.textContent = PopupSliderCaptcha.getStyles();
     document.head.appendChild(style);
   }
 
-  // 优化：简化元素创建逻辑
   createElements() {
     const { elements, options } = this;
 
@@ -135,7 +128,7 @@ class PopupSliderCaptcha {
       ['btn', 'div', PopupSliderCaptcha.CSS_CLASSES.btn],
       ['icon', 'div', '', '→'],
       ['hint', 'div', PopupSliderCaptcha.CSS_CLASSES.hint, '向右滑动完成验证'],
-      ['error', 'div', PopupSliderCaptcha.CSS_CLASSES.error]
+      ['error', 'div', PopupSliderCaptcha.CSS_CLASSES.error],
     ];
 
     // 批量创建元素
@@ -153,19 +146,18 @@ class PopupSliderCaptcha {
     this.setInitialState();
   }
 
-  createElement(tag, className = "", textContent = "") {
+  createElement(tag, className = '', textContent = '') {
     const element = document.createElement(tag);
     if (className) element.className = className;
     if (textContent) element.textContent = textContent;
     return element
   }
 
-  // 优化：简化DOM组装逻辑
   assembleDOM() {
     const { elements } = this;
 
     // 组装头部
-    const headerButtons = this.createElement("div", "slider-captcha-header-buttons");
+    const headerButtons = this.createElement('div', 'slider-captcha-header-buttons');
     headerButtons.append(elements.refreshBtn, elements.closeBtn);
     elements.header.append(elements.title, headerButtons);
 
@@ -174,24 +166,15 @@ class PopupSliderCaptcha {
       elements.backgroundImg,
       elements.sliderImg,
       elements.loadingText,
-      elements.floatingTime
+      elements.floatingTime,
     );
 
     // 组装滑块轨道
     elements.btn.appendChild(elements.icon);
-    elements.track.append(
-      elements.fingerAnimation,
-      elements.btn,
-      elements.hint
-    );
+    elements.track.append(elements.fingerAnimation, elements.btn, elements.hint);
 
     // 组装模态框
-    elements.modal.append(
-      elements.header,
-      elements.container,
-      elements.track,
-      elements.error
-    );
+    elements.modal.append(elements.header, elements.container, elements.track, elements.error);
 
     // 组装到覆盖层
     elements.overlay.appendChild(elements.modal);
@@ -200,24 +183,23 @@ class PopupSliderCaptcha {
 
   setInitialState() {
     // 批量设置初始状态
-    Object.assign(this.elements.container.style, { display: "none" });
-    Object.assign(this.elements.track.style, { display: "none" });
+    Object.assign(this.elements.container.style, { display: 'none' });
+    Object.assign(this.elements.track.style, { display: 'none' });
   }
 
-  // 优化：简化事件绑定
   bindEvents() {
     const { elements } = this;
 
     // 基础事件
-    this.addEventListener(elements.closeBtn, "click", () => this.hide());
-    this.addEventListener(elements.refreshBtn, "click", () => this.refresh());
-    this.addEventListener(elements.overlay, "click", (e) => {
+    this.addEventListener(elements.closeBtn, 'click', () => this.hide());
+    this.addEventListener(elements.refreshBtn, 'click', () => this.refresh());
+    this.addEventListener(elements.overlay, 'click', (e) => {
       if (e.target === elements.overlay && this.options.clickMaskClose) this.hide();
     });
-    this.addEventListener(document, "keydown", (e) => {
-      if (e.key === "Escape" && this.state.isVisible) this.hide();
+    this.addEventListener(document, 'keydown', (e) => {
+      if (e.key === 'Escape' && this.state.isVisible) this.hide();
     });
-    this.addEventListener(document, "visibilitychange", () => this.handleVisibilityChange());
+    this.addEventListener(document, 'visibilitychange', () => this.handleVisibilityChange());
 
     this.bindSliderEvents();
   }
@@ -227,21 +209,20 @@ class PopupSliderCaptcha {
     const handlers = {
       start: (e) => this.handleStart(e),
       move: this.throttledHandleMove,
-      end: () => this.handleEnd()
+      end: () => this.handleEnd(),
     };
 
     // 滑块事件
-    this.addEventListener(elements.btn, "mousedown", handlers.start);
-    this.addEventListener(elements.btn, "touchstart", handlers.start);
-    this.addEventListener(elements.sliderImg, "mousedown", handlers.start);
-    this.addEventListener(elements.sliderImg, "touchstart", handlers.start);
-    this.addEventListener(document, "mousemove", handlers.move, { passive: false });
-    this.addEventListener(document, "touchmove", handlers.move, { passive: false });
-    this.addEventListener(document, "mouseup", handlers.end);
-    this.addEventListener(document, "touchend", handlers.end);
+    this.addEventListener(elements.btn, 'mousedown', handlers.start);
+    this.addEventListener(elements.btn, 'touchstart', handlers.start);
+    this.addEventListener(elements.sliderImg, 'mousedown', handlers.start);
+    this.addEventListener(elements.sliderImg, 'touchstart', handlers.start);
+    this.addEventListener(document, 'mousemove', handlers.move, { passive: false });
+    this.addEventListener(document, 'touchmove', handlers.move, { passive: false });
+    this.addEventListener(document, 'mouseup', handlers.end);
+    this.addEventListener(document, 'touchend', handlers.end);
   }
 
-  // 优化：改进事件管理
   addEventListener(element, event, handler, options = {}) {
     if (!element || typeof handler !== 'function') return
 
@@ -260,7 +241,6 @@ class PopupSliderCaptcha {
     this.eventListeners.length = 0;
   }
 
-  // 优化：缓存尺寸计算
   getDimensions() {
     if (!this.cachedDimensions) {
       const trackWidth = this.elements.track.offsetWidth;
@@ -268,7 +248,7 @@ class PopupSliderCaptcha {
       this.cachedDimensions = {
         trackWidth,
         btnWidth,
-        maxX: trackWidth - btnWidth
+        maxX: trackWidth - btnWidth,
       };
     }
     return this.cachedDimensions
@@ -280,7 +260,6 @@ class PopupSliderCaptcha {
     return Math.round(percentage * (this.options.width - this.options.sliderSize))
   }
 
-  // 优化：简化拖拽处理
   handleStart(e) {
     if (!this.captchaData || this.state.isDragging || this.state.isLoading) return
 
@@ -291,7 +270,7 @@ class PopupSliderCaptcha {
     this.times = [{ time: Date.now(), position: this.getPosition() }];
 
     this.setTransition(false);
-    this.updateUIState("dragging");
+    this.updateUIState('dragging');
     this.cachedDimensions = null; // 清除缓存
   }
 
@@ -333,11 +312,11 @@ class PopupSliderCaptcha {
   }
 
   getClientX(e) {
-    return e.type.includes("touch") ? e.touches[0].clientX : e.clientX
+    return e.type.includes('touch') ? e.touches[0].clientX : e.clientX
   }
 
   setTransition(enabled) {
-    const transition = enabled ? "all 0.3s ease" : "none";
+    const transition = enabled ? 'all 0.3s ease' : 'none';
     requestAnimationFrame(() => {
       this.elements.btn.style.transition = transition;
       this.elements.sliderImg.style.transition = transition;
@@ -349,38 +328,38 @@ class PopupSliderCaptcha {
     const { elements } = this;
     const updates = {
       dragging: () => {
-        elements.hint.style.opacity = "0";
-        elements.fingerAnimation.style.display = "none";
+        elements.hint.style.opacity = '0';
+        elements.fingerAnimation.style.display = 'none';
       },
       success: () => {
-        Object.assign(elements.btn.style, { background: "var(--sc-success)" });
-        Object.assign(elements.icon.style, { innerHTML: "✓", color: "white" });
-        elements.icon.innerHTML = "✓";
+        Object.assign(elements.btn.style, { background: 'var(--sc-success)' });
+        Object.assign(elements.icon.style, { innerHTML: '✓', color: 'white' });
+        elements.icon.innerHTML = '✓';
       },
       fail: () => {
-        Object.assign(elements.btn.style, { background: "var(--sc-danger)" });
-        Object.assign(elements.icon.style, { innerHTML: "✗", color: "white" });
-        elements.icon.innerHTML = "✗";
+        Object.assign(elements.btn.style, { background: 'var(--sc-danger)' });
+        Object.assign(elements.icon.style, { innerHTML: '✗', color: 'white' });
+        elements.icon.innerHTML = '✗';
       },
       reset: () => {
-        Object.assign(elements.btn.style, { background: "white" });
-        Object.assign(elements.icon.style, { color: "#666" });
-        elements.icon.innerHTML = "→";
-        elements.fingerAnimation.style.display = "block";
-        this.updateHintText("向右滑动完成验证", "var(--sc-text-light)");
+        Object.assign(elements.btn.style, { background: 'white' });
+        Object.assign(elements.icon.style, { color: '#666' });
+        elements.icon.innerHTML = '→';
+        elements.fingerAnimation.style.display = 'block';
+        this.updateHintText('向右滑动完成验证', 'var(--sc-text-light)');
       },
       loading: () => {
-        elements.hint.style.opacity = "0";
-        elements.fingerAnimation.style.display = "none";
-        Object.assign(elements.track.style, { pointerEvents: "none", opacity: "0.6" });
-      }
+        elements.hint.style.opacity = '0';
+        elements.fingerAnimation.style.display = 'none';
+        Object.assign(elements.track.style, { pointerEvents: 'none', opacity: '0.6' });
+      },
     };
 
     if (updates[state]) {
       requestAnimationFrame(() => {
         updates[state]();
-        if (state !== "loading") {
-          Object.assign(elements.track.style, { pointerEvents: "auto", opacity: "1" });
+        if (state !== 'loading') {
+          Object.assign(elements.track.style, { pointerEvents: 'auto', opacity: '1' });
         }
       });
     }
@@ -389,7 +368,7 @@ class PopupSliderCaptcha {
   updateHintText(text, color) {
     requestAnimationFrame(() => {
       Object.assign(this.elements.hint, { textContent: text });
-      Object.assign(this.elements.hint.style, { color, opacity: "1" });
+      Object.assign(this.elements.hint.style, { color, opacity: '1' });
     });
   }
 
@@ -402,18 +381,18 @@ class PopupSliderCaptcha {
     requestAnimationFrame(() => {
       elements.btn.style.transform = `translateX(${state.currentX}px)`;
       elements.sliderImg.style.transform = `translateX(${pieceX}px)`;
-      elements.fingerAnimation.style.opacity = progress >= 0.8 ? "0" : "0.6";
+      elements.fingerAnimation.style.opacity = progress >= 0.8 ? '0' : '0.6';
     });
   }
 
   // 优化：简化显示/隐藏逻辑
   show() {
     this.state.isVisible = true;
-    this.elements.overlay.style.display = "flex";
+    this.elements.overlay.style.display = 'flex';
 
     requestAnimationFrame(() => {
-      this.elements.overlay.classList.add("show");
-      this.elements.modal.classList.add("show");
+      this.elements.overlay.classList.add('show');
+      this.elements.modal.classList.add('show');
     });
 
     this.loadCaptcha();
@@ -421,11 +400,11 @@ class PopupSliderCaptcha {
 
   hide() {
     this.state.isVisible = false;
-    this.elements.overlay.classList.remove("show");
-    this.elements.modal.classList.remove("show");
+    this.elements.overlay.classList.remove('show');
+    this.elements.modal.classList.remove('show');
 
     this.safeSetTimeout(() => {
-      this.elements.overlay.style.display = "none";
+      this.elements.overlay.style.display = 'none';
       document.body.removeChild(this.elements.overlay);
       this.reset();
       this.options.onClose?.();
@@ -440,7 +419,7 @@ class PopupSliderCaptcha {
       [PopupSliderCaptcha.ERROR_TYPES.TIMEOUT_ERROR]: '请求超时，请重试',
       [PopupSliderCaptcha.ERROR_TYPES.VALIDATION_ERROR]: '验证失败，请重试',
       [PopupSliderCaptcha.ERROR_TYPES.IMAGE_LOAD_ERROR]: '图片加载失败，请刷新重试',
-      [PopupSliderCaptcha.ERROR_TYPES.CAPTCHA_DATA_ERROR]: '验证码数据错误，请刷新重试'
+      [PopupSliderCaptcha.ERROR_TYPES.CAPTCHA_DATA_ERROR]: '验证码数据错误，请刷新重试',
     };
 
     const errorMessage = errorMessages[errorType] || message || '未知错误';
@@ -450,7 +429,7 @@ class PopupSliderCaptcha {
       this.options.onError({
         type: errorType,
         message: errorMessage,
-        originalError
+        originalError,
       });
     }
 
@@ -471,16 +450,16 @@ class PopupSliderCaptcha {
       this.abortController = new AbortController();
 
       const response = await fetch(this.options.apiUrl, {
-        method: "POST",
+        method: 'POST',
         headers: {
-          "Content-Type": "application/json",
-          ...this.options.headers
+          'Content-Type': 'application/json',
+          ...this.options.headers,
         },
         body: JSON.stringify({
           timestamp: Date.now(),
-          ...this.options.requestData
+          ...this.options.requestData,
         }),
-        signal: this.abortController.signal
+        signal: this.abortController.signal,
       });
 
       if (!response.ok) {
@@ -491,7 +470,7 @@ class PopupSliderCaptcha {
 
       // 优化：更严格的数据验证
       if (!this.validateCaptchaData(data)) {
-        throw new Error("验证码数据格式错误")
+        throw new Error('验证码数据格式错误')
       }
 
       this.captchaData = data.data;
@@ -500,7 +479,10 @@ class PopupSliderCaptcha {
     } catch (error) {
       if (error.name === 'AbortError') {
         this.handleError(PopupSliderCaptcha.ERROR_TYPES.TIMEOUT_ERROR, '请求被取消');
-      } else if (error.message.includes('Failed to fetch') || error.message.includes('NetworkError')) {
+      } else if (
+        error.message.includes('Failed to fetch') ||
+        error.message.includes('NetworkError')
+      ) {
         this.handleError(PopupSliderCaptcha.ERROR_TYPES.NETWORK_ERROR, '网络连接失败');
       } else {
         this.handleError(PopupSliderCaptcha.ERROR_TYPES.CAPTCHA_DATA_ERROR, error.message, error);
@@ -512,10 +494,19 @@ class PopupSliderCaptcha {
   validateCaptchaData(data) {
     if (!data || typeof data !== 'object') return false
 
-    const requiredFields = ['canvasSrc', 'blockSrc', 'canvasWidth', 'canvasHeight', 'blockWidth', 'blockHeight', 'blockY', 'nonceStr'];
+    const requiredFields = [
+      'canvasSrc',
+      'blockSrc',
+      'canvasWidth',
+      'canvasHeight',
+      'blockWidth',
+      'blockHeight',
+      'blockY',
+      'nonceStr',
+    ];
     const dataObj = data.data || data;
 
-    return requiredFields.every(field => {
+    return requiredFields.every((field) => {
       const value = dataObj[field];
       return value !== null && value !== undefined && value !== ''
     })
@@ -529,13 +520,13 @@ class PopupSliderCaptcha {
       const loadPromises = [
         this.loadImageAsync(this.elements.backgroundImg, this.captchaData.canvasSrc, {
           width: this.captchaData.canvasWidth,
-          height: this.captchaData.canvasHeight
+          height: this.captchaData.canvasHeight,
         }),
         this.loadImageAsync(this.elements.sliderImg, this.captchaData.blockSrc, {
           width: this.captchaData.blockWidth,
           height: this.captchaData.blockHeight,
-          top: this.captchaData.blockY
-        })
+          top: this.captchaData.blockY,
+        }),
       ];
 
       Promise.all(loadPromises)
@@ -590,7 +581,7 @@ class PopupSliderCaptcha {
   // 优化：提取样式应用逻辑
   applyStyles(element, styles) {
     Object.entries(styles).forEach(([key, value]) => {
-      element.style[key] = typeof value === "number" ? value + "px" : value;
+      element.style[key] = typeof value === 'number' ? value + 'px' : value;
     });
   }
 
@@ -598,31 +589,31 @@ class PopupSliderCaptcha {
   showLoading() {
     this.state.isLoading = true;
     this.batchUpdateStyles({
-      container: { display: "block" },
-      loadingText: { display: "flex" },
-      error: { display: "none" }
+      container: { display: 'block' },
+      loadingText: { display: 'flex' },
+      error: { display: 'none' },
     });
-    this.updateUIState("loading");
+    this.updateUIState('loading');
   }
 
   hideLoading() {
     this.state.isLoading = false;
-    this.batchUpdateStyles({ loadingText: { display: "none" } });
-    this.updateUIState("reset");
+    this.batchUpdateStyles({ loadingText: { display: 'none' } });
+    this.updateUIState('reset');
   }
 
   showCaptcha() {
     this.batchUpdateStyles({
-      container: { display: "block" },
-      track: { display: "block" },
-      error: { display: "none" }
+      container: { display: 'block' },
+      track: { display: 'block' },
+      error: { display: 'none' },
     });
   }
 
   showError(message) {
     this.hideLoading();
     this.batchUpdateStyles({
-      error: { display: "block", textContent: message }
+      error: { display: 'block', textContent: message },
     });
   }
 
@@ -646,7 +637,7 @@ class PopupSliderCaptcha {
 
   async verify() {
     if (!this.captchaData) {
-      this.onVerifyFail("验证码数据丢失");
+      this.onVerifyFail('验证码数据丢失');
       return
     }
 
@@ -658,20 +649,20 @@ class PopupSliderCaptcha {
       this.abortController = new AbortController();
 
       const response = await fetch(this.options.verifyUrl, {
-        method: "POST",
+        method: 'POST',
         headers: {
-          "Content-Type": "application/json",
-          ...this.options.headers
+          'Content-Type': 'application/json',
+          ...this.options.headers,
         },
         body: JSON.stringify({
           loginVo: {
             nonceStr: this.captchaData.nonceStr,
-            value: this.getPosition()
+            value: this.getPosition(),
           },
           dragEventList: [...this.times],
-          ...this.options.verifyData
+          ...this.options.verifyData,
         }),
-        signal: this.abortController.signal
+        signal: this.abortController.signal,
       });
 
       if (!response.ok) {
@@ -684,12 +675,15 @@ class PopupSliderCaptcha {
       if (this.isVerifySuccess(data)) {
         this.onVerifySuccess(data.data || data.result);
       } else {
-        this.onVerifyFail(data.message || data.msg || "验证失败，请重试！");
+        this.onVerifyFail(data.message || data.msg || '验证失败，请重试！');
       }
     } catch (error) {
       if (error.name === 'AbortError') {
         this.handleError(PopupSliderCaptcha.ERROR_TYPES.TIMEOUT_ERROR, '验证请求被取消');
-      } else if (error.message.includes('Failed to fetch') || error.message.includes('NetworkError')) {
+      } else if (
+        error.message.includes('Failed to fetch') ||
+        error.message.includes('NetworkError')
+      ) {
         this.handleError(PopupSliderCaptcha.ERROR_TYPES.NETWORK_ERROR, '网络连接失败');
       } else {
         this.handleError(PopupSliderCaptcha.ERROR_TYPES.VALIDATION_ERROR, error.message, error);
@@ -703,48 +697,50 @@ class PopupSliderCaptcha {
 
     // 支持多种成功标识
     const successIndicators = [
-      data.code === "0",
+      data.code === '0',
       data.code === 0,
       data.success === true,
       data.status === 'success',
-      data.result === true
+      data.result === true,
     ];
 
-    return successIndicators.some(indicator => indicator === true)
+    return successIndicators.some((indicator) => indicator === true)
   }
 
   onVerifySuccess(ticket) {
-    const duration = this.dragStartTime ? Date.now() - this.dragStartTime : (Date.now() - this.startTime);
+    const duration = this.dragStartTime
+      ? Date.now() - this.dragStartTime
+      : Date.now() - this.startTime;
     const durationText = `验证成功！耗时：${(duration / 1000).toFixed(2)}s`;
 
-    this.updateUIState("success");
-    this.showFloatingTime(durationText, "success");
+    this.updateUIState('success');
+    this.showFloatingTime(durationText, 'success');
 
     this.safeSetTimeout(() => {
       this.options.onSuccess?.({
         ticket: ticket,
         timestamp: Date.now(),
-        duration
+        duration,
       });
       this.hide();
     }, 2000);
   }
 
-  showFloatingTime(text, type = "success") {
+  showFloatingTime(text, type = 'success') {
     const { elements } = this;
     elements.floatingTime.textContent = text;
     elements.floatingTime.className = `slider-captcha-floating-time ${type}`;
 
-    this.safeSetTimeout(() => elements.floatingTime.classList.add("show"), 100);
+    this.safeSetTimeout(() => elements.floatingTime.classList.add('show'), 100);
     this.safeSetTimeout(() => {
-      elements.floatingTime.className = "slider-captcha-floating-time";
+      elements.floatingTime.className = 'slider-captcha-floating-time';
     }, 2500); // 优化：延长显示时间，避免被reset清除
   }
 
   onVerifyFail(message) {
     this.state.retryCount++;
-    this.updateUIState("fail");
-    this.showFloatingTime(message, "fail");
+    this.updateUIState('fail');
+    this.showFloatingTime(message, 'fail');
 
     this.safeSetTimeout(() => {
       if (this.state.retryCount >= this.options.maxRetries) {
@@ -763,7 +759,7 @@ class PopupSliderCaptcha {
       isDragging: false,
       currentX: 0,
       startX: 0,
-      isLoading: false
+      isLoading: false,
     });
 
     this.times = [];
@@ -774,10 +770,10 @@ class PopupSliderCaptcha {
     // 重置UI
     requestAnimationFrame(() => {
       this.setTransition(true);
-      this.elements.btn.style.transform = "translateX(0px)";
-      this.elements.sliderImg.style.transform = "translateX(0px)";
-      this.updateUIState("reset");
-      this.elements.error.style.display = "none";
+      this.elements.btn.style.transform = 'translateX(0px)';
+      this.elements.sliderImg.style.transform = 'translateX(0px)';
+      this.updateUIState('reset');
+      this.elements.error.style.display = 'none';
     });
   }
 
@@ -805,7 +801,7 @@ class PopupSliderCaptcha {
   }
 
   clearAllTimers() {
-    this.timers.forEach(timer => {
+    this.timers.forEach((timer) => {
       clearTimeout(timer);
       clearInterval(timer);
     });
@@ -854,8 +850,8 @@ class PopupSliderCaptcha {
 
       // 恢复body样式
       if (document.body) {
-        document.body.style.userSelect = "";
-        document.body.style.cursor = "";
+        document.body.style.userSelect = '';
+        document.body.style.cursor = '';
       }
 
       // 清理所有定时器
@@ -883,7 +879,7 @@ class PopupSliderCaptcha {
       this.cachedDimensions = null;
 
       // 清空所有属性
-      Object.keys(this).forEach(key => {
+      Object.keys(this).forEach((key) => {
         if (key !== 'constructor') {
           this[key] = null;
         }
@@ -910,12 +906,12 @@ class PopupSliderCaptcha {
 }
 
 // 模块导出
-if (typeof module !== "undefined" && module.exports) {
+if (typeof module !== 'undefined' && module.exports) {
   module.exports = PopupSliderCaptcha;
   module.exports.default = PopupSliderCaptcha;
-} else if (typeof define === "function" && define.amd) {
+} else if (typeof define === 'function' && define.amd) {
   define([], () => PopupSliderCaptcha);
-} else if (typeof window !== "undefined") {
+} else if (typeof window !== 'undefined') {
   window.PopupSliderCaptcha = PopupSliderCaptcha;
   window.SliderCaptcha = PopupSliderCaptcha;
 }
@@ -932,33 +928,30 @@ class PasswordValidator {
   static CONSTANTS = {
     DEFAULT_TIMEOUT: 10000,
     CACHE_DURATION: 5 * 60 * 1000, // 5分钟缓存
-    MIN_PASSWORD_LENGTH: 1
+    MIN_PASSWORD_LENGTH: 1,
   }
 
-  // 优化：添加错误类型枚举
   static ERROR_TYPES = {
     NETWORK_ERROR: 'NETWORK_ERROR',
     TIMEOUT_ERROR: 'TIMEOUT_ERROR',
     ENCRYPTION_ERROR: 'ENCRYPTION_ERROR',
     VALIDATION_ERROR: 'VALIDATION_ERROR',
-    PUBLIC_KEY_ERROR: 'PUBLIC_KEY_ERROR'
+    PUBLIC_KEY_ERROR: 'PUBLIC_KEY_ERROR',
   }
 
   constructor(options = {}) {
-    // 优化：合并配置，使用常量
     this.options = {
       publicKeyUrl: options.publicKeyUrl || '/microservice/strongPassword/getPublicKey',
       validateUrl: options.validateUrl || '/microservice/strongPassword/checkPassword',
       timeout: options.timeout || PasswordValidator.CONSTANTS.DEFAULT_TIMEOUT,
       headers: options.headers || {},
       cacheDuration: options.cacheDuration || PasswordValidator.CONSTANTS.CACHE_DURATION,
-      ...options
+      ...options,
     };
 
     // 缓存公钥，避免重复请求
     this.publicKeyCache = null;
     this.publicKeyExpiry = null;
-    this.abortController = null;
   }
 
   /**
@@ -972,15 +965,8 @@ class PasswordValidator {
     }
 
     try {
-      // 取消之前的请求
-      if (this.abortController) {
-        this.abortController.abort();
-      }
-      this.abortController = new AbortController();
-
       const response = await this.makeRequest(this.options.publicKeyUrl, {
         method: 'GET',
-        signal: this.abortController.signal
       });
 
       if (!this.isSuccessResponse(response)) {
@@ -989,8 +975,8 @@ class PasswordValidator {
 
       // 验证公钥格式
       const publicKey = response.data || response.result;
-      if (!this.validatePublicKey(publicKey)) {
-        throw new Error('公钥格式无效')
+      if (!publicKey) {
+        throw new Error('公钥为空')
       }
 
       // 缓存公钥
@@ -1007,35 +993,28 @@ class PasswordValidator {
 
   // 优化：添加响应成功判断方法
   isSuccessResponse(response) {
-    if (!response || typeof response !== 'object') return false
+    if (!response || typeof response !== 'object') {
+      return false
+    }
 
     const successIndicators = [
       response.code === '0',
       response.code === 0,
       response.success === true,
       response.status === 'success',
-      response.result === true
+      response.result === true,
     ];
 
-    return successIndicators.some(indicator => indicator === true)
-  }
-
-  // 优化：添加公钥验证方法
-  validatePublicKey(publicKey) {
-    if (!publicKey || typeof publicKey !== 'string') return false
-
-    // 基本的RSA公钥格式检查
-    return true
+    return successIndicators.some((indicator) => indicator === true)
   }
 
-  // 优化：添加统一错误处理方法
   handleError(errorType, message, originalError = null) {
     const errorMessages = {
       [PasswordValidator.ERROR_TYPES.NETWORK_ERROR]: '网络连接失败，请检查网络设置',
       [PasswordValidator.ERROR_TYPES.TIMEOUT_ERROR]: '请求超时，请重试',
       [PasswordValidator.ERROR_TYPES.ENCRYPTION_ERROR]: '密码加密失败',
       [PasswordValidator.ERROR_TYPES.VALIDATION_ERROR]: '密码验证失败',
-      [PasswordValidator.ERROR_TYPES.PUBLIC_KEY_ERROR]: '获取公钥失败'
+      [PasswordValidator.ERROR_TYPES.PUBLIC_KEY_ERROR]: '获取公钥失败',
     };
 
     const errorMessage = errorMessages[errorType] || message || '未知错误';
@@ -1045,7 +1024,7 @@ class PasswordValidator {
       this.options.onError({
         type: errorType,
         message: errorMessage,
-        originalError
+        originalError,
       });
     }
 
@@ -1060,7 +1039,6 @@ class PasswordValidator {
    */
   encryptPassword(password, publicKey) {
     try {
-      // 优化：输入验证
       if (!password) {
         throw new Error('密码不能为空')
       }
@@ -1073,7 +1051,6 @@ class PasswordValidator {
         throw new Error('公钥不能为空')
       }
 
-      // 使用导入的JSEncrypt进行RSA加密
       if (typeof JSEncrypt === 'undefined') {
         throw new Error('JSEncrypt库未正确加载，请确保已引入JSEncrypt库')
       }
@@ -1103,13 +1080,8 @@ class PasswordValidator {
    */
   async validatePassword(password, userName, additionalData = {}) {
     try {
-      // 优化：输入验证
-      if (!password ) {
-        throw new Error('密码不能为空')
-      }
-
-      if (!userName) {
-        throw new Error('用户名不能为空')
+      if (!password || !userName) {
+        throw new Error('用户名密码不能为空')
       }
 
       // 1. 获取公钥
@@ -1125,17 +1097,16 @@ class PasswordValidator {
           userName: userName,
           password: encryptedPassword,
           timestamp: Date.now(),
-          ...additionalData
-        })
+          ...additionalData,
+        }),
       });
 
-      // 优化：统一返回格式
       return {
         success: this.isSuccessResponse(response),
         data: response.data || response.result,
         message: response.message || response.msg || '验证完成',
         code: response.code || response.status,
-        originalResponse: response
+        originalResponse: response,
       }
     } catch (error) {
       console.error('密码校验失败:', error);
@@ -1156,7 +1127,7 @@ class PasswordValidator {
         success: false,
         message: error.message || '密码校验失败',
         code: errorType,
-        error: error
+        error: error,
       }
     }
   }
@@ -1168,14 +1139,11 @@ class PasswordValidator {
    * @returns {Promise<Object>} 响应结果
    */
   async makeRequest(url, options = {}) {
-    // 优化：使用实例的abortController
-    if (this.abortController) {
-      this.abortController.abort();
-    }
-    this.abortController = new AbortController();
+    // 优化：为每个请求创建独立的AbortController，避免多个请求互相取消
+    const abortController = new AbortController();
 
     const timeoutId = setTimeout(() => {
-      this.abortController.abort();
+      abortController.abort();
     }, this.options.timeout);
 
     try {
@@ -1184,9 +1152,9 @@ class PasswordValidator {
         headers: {
           'Content-Type': 'application/json',
           ...this.options.headers,
-          ...options.headers
+          ...options.headers,
         },
-        signal: this.abortController.signal
+        signal: abortController.signal,
       });
 
       clearTimeout(timeoutId);
@@ -1240,20 +1208,23 @@ class PasswordValidator {
 
   /**
    * 取消当前请求
+   * 注意：由于现在每个请求使用独立的AbortController，此方法主要用于向后兼容
    */
   cancelRequest() {
-    if (this.abortController) {
-      this.abortController.abort();
-      this.abortController = null;
-    }
+    // 由于现在每个请求使用独立的AbortController，无法直接取消所有请求
+    // 如果需要取消特定请求，建议在调用validatePassword时保存返回的Promise并手动处理
+    console.warn('cancelRequest方法已过时，现在每个请求使用独立的AbortController');
   }
 
   /**
    * 检查是否正在请求中
    * @returns {boolean} 是否正在请求
+   * 注意：由于现在每个请求使用独立的AbortController，此方法无法准确判断
    */
   isRequesting() {
-    return this.abortController && !this.abortController.signal.aborted
+    // 由于现在每个请求使用独立的AbortController，无法准确判断是否正在请求
+    console.warn('isRequesting方法已过时，现在每个请求使用独立的AbortController');
+    return false
   }
 
   /**
@@ -1265,7 +1236,7 @@ class PasswordValidator {
       hasCache: !!this.publicKeyCache,
       isExpired: this.publicKeyExpiry ? Date.now() > this.publicKeyExpiry : true,
       expiryTime: this.publicKeyExpiry,
-      remainingTime: this.publicKeyExpiry ? Math.max(0, this.publicKeyExpiry - Date.now()) : 0
+      remainingTime: this.publicKeyExpiry ? Math.max(0, this.publicKeyExpiry - Date.now()) : 0,
     }
   }