customer-chat-sdk 1.0.62 → 1.0.64

package/dist/core/ScreenshotManager.d.ts

@@ -286,8 +286,20 @@ export declare class ScreenshotManager {
      */
     private dataUrlToArrayBuffer;
     /**
-     * 构建二进制结构（按顺序：sign[14], type[1], topicLength[1], topic[topicLength], routingKey[8]）
-     * 20 + 1 + 8 + 8 = 37 字节
+     * 将 ArrayBuffer 转换为 base64 字符串
+     */
+    private arrayBufferToBase64;
+    /**
+     * 构建二进制结构（按顺序：sign[20], type[1], topicLength[1], topic[topicLength], routingKeyLength[1], routingKey[routingKeyLength]）
+     * 总大小 = 20 + 1 + 1 + topicLength + 1 + routingKeyLength（动态计算）
+     *
+     * 与服务端格式对应：
+     * - sign: 20字节 (CharSequence, UTF-8)
+     * - type: 1字节 (转为无符号)
+     * - topicLength: 1字节
+     * - topic: topicLength字节 (CharSequence, UTF-8)
+     * - routingKeyLength: 1字节
+     * - routingKey: routingKeyLength字节 (CharSequence, UTF-8)
      */
     private buildBinaryConfig;
     /**

package/dist/core/ScreenshotManager.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScreenshotManager.d.ts","sourceRoot":"","sources":["../../src/core/ScreenshotManager.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"ScreenshotManager.d.ts","sourceRoot":"","sources":["../../src/core/ScreenshotManager.ts"],"names":[],"mappings":"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"}

package/dist/customer-sdk.cjs.js

@@ -14992,6 +14992,10 @@ class ScreenshotManager {
         if (!this.options.silentMode) {
             console.log('📸 使用 snapdom 引擎截图...');
         }
+        // 限制只截图可见区域（viewport），避免截图不可见区域
+        // 注意：snapdom 可能不支持直接限制可见区域，所以这里只是添加警告
+        let targetElement = element;
+        let tempContainer = null;
         try {
             // 检查元素是否存在和可见
             const rect = element.getBoundingClientRect();
@@ -15000,6 +15004,53 @@ class ScreenshotManager {
             }
             // 构建 snapdom 选项
             const options = {};
+            if (element === document.body || element === document.documentElement) {
+                // 对于 body 或 html 元素，创建一个临时容器，只包含可见区域
+                // 使用 html2canvas 的方式：创建一个固定大小的容器，只包含可见内容
+                tempContainer = document.createElement('div');
+                tempContainer.style.position = 'fixed';
+                tempContainer.style.top = '0';
+                tempContainer.style.left = '0';
+                tempContainer.style.width = `${window.innerWidth}px`;
+                tempContainer.style.height = `${window.innerHeight}px`;
+                tempContainer.style.overflow = 'hidden';
+                tempContainer.style.zIndex = '999999';
+                tempContainer.style.pointerEvents = 'none';
+                tempContainer.style.backgroundColor = window.getComputedStyle(document.body).backgroundColor || 'white';
+                // 创建一个包装器，只包含可见区域的内容
+                // 注意：这里不克隆整个 body，而是直接使用 body 作为父元素
+                // 但限制容器的尺寸为可见区域
+                document.body.appendChild(tempContainer);
+                // 使用 body 作为目标，但通过容器限制范围
+                // 实际上，我们需要直接截图 body，但限制尺寸
+                // 由于 snapdom 可能不支持直接限制尺寸，我们使用一个更简单的方法：
+                // 直接截图 body，但通过 CSS 限制其显示范围（但这会影响页面）
+                // 更好的方法是：使用 html2canvas 的方式，创建一个 canvas 并只绘制可见区域
+                // 简化方案：直接使用 body，但添加尺寸限制选项（如果 snapdom 支持）
+                // 如果不支持，则只能截图整个 body
+                targetElement = element;
+                if (!this.options.silentMode) {
+                    console.log(`📸 注意：snapdom 将截图整个 body，建议使用 html2canvas 或 modern-screenshot 来限制可见区域`);
+                    console.log(`📸 可见区域尺寸: ${window.innerWidth}x${window.innerHeight}`);
+                }
+                // 清理临时容器（未使用）
+                if (tempContainer && tempContainer.parentNode) {
+                    tempContainer.parentNode.removeChild(tempContainer);
+                }
+                tempContainer = null;
+            }
+            else {
+                // 对于其他元素，检查是否完全可见
+                const elementRect = element.getBoundingClientRect();
+                const isFullyVisible = elementRect.top >= 0 &&
+                    elementRect.left >= 0 &&
+                    elementRect.bottom <= window.innerHeight &&
+                    elementRect.right <= window.innerWidth;
+                if (!isFullyVisible && !this.options.silentMode) {
+                    console.warn(`📸 ⚠️ 元素部分不可见，snapdom 可能会截图整个元素（包括不可见部分）`);
+                    console.warn(`📸 建议：使用 html2canvas 或 modern-screenshot 来限制可见区域`);
+                }
+            }
             // 如果配置了代理服务器，使用 useProxy 选项处理跨域图片和字体
             // 参考: https://github.com/zumerlab/snapdom/blob/main/README_CN.md#跨域图片和字体-useproxy
             // 只有当 useProxy 为 true 且 proxyUrl 存在时才使用代理
@@ -15034,16 +15085,16 @@ class ScreenshotManager {
             switch (outputFormat) {
                 case 'jpeg':
                     // 使用 toJpg 快捷方法（snapdom 使用 jpg 作为方法名）
-                    img = await snapdom.toJpg(element, options);
+                    img = await snapdom.toJpg(targetElement, options);
                     break;
                 case 'webp':
                     // 使用 toWebp 快捷方法
-                    img = await snapdom.toWebp(element, options);
+                    img = await snapdom.toWebp(targetElement, options);
                     break;
                 case 'png':
                 default:
                     // 使用 toPng 快捷方法（默认）
-                    img = await snapdom.toPng(element, options);
+                    img = await snapdom.toPng(targetElement, options);
                     break;
             }
             // 获取 base64 数据（HTMLImageElement 的 src 属性包含 data URL）
@@ -15052,12 +15103,28 @@ class ScreenshotManager {
             if (!dataUrl || dataUrl.length < 100) {
                 throw new Error('生成的 base64 数据无效或过短');
             }
+            // 清理临时容器（如果存在）
+            if (tempContainer !== null) {
+                const container = tempContainer;
+                const parent = container.parentNode;
+                if (parent) {
+                    parent.removeChild(container);
+                }
+            }
             if (!this.options.silentMode) {
                 console.log(`📸 snapdom 截图成功！格式: ${outputFormat}, 尺寸: ${img.width}x${img.height}`);
             }
             return dataUrl;
         }
         catch (error) {
+            // 确保清理临时容器（即使出错）
+            if (tempContainer !== null) {
+                const container = tempContainer;
+                const parent = container.parentNode;
+                if (parent) {
+                    parent.removeChild(container);
+                }
+            }
             const errorMessage = error instanceof Error ? error.message : String(error);
             const errorName = error instanceof Error ? error.name : 'Unknown';
             // 针对不同类型的错误给出具体提示
@@ -15454,19 +15521,21 @@ class ScreenshotManager {
             console.log('📸 使用 modern-screenshot 引擎截图（Worker 模式）...');
         }
         try {
-            // 获取元素的实际尺寸（使用 scrollWidth/scrollHeight 获取完整内容尺寸）
-            // 对于 document.body，需要特殊处理，确保截取完整页面内容
+            // 获取元素的实际尺寸
+            // 对于 document.body，使用窗口可见区域尺寸（而不是完整滚动内容），避免截图过大
             let elementWidth;
             let elementHeight;
             if (element === document.body || element === document.documentElement) {
-                // 对于 body 或 html 元素，使用页面的完整尺寸（包括滚动内容）
-                elementWidth = Math.max(element.scrollWidth, element.offsetWidth, document.documentElement.scrollWidth, document.documentElement.offsetWidth, window.innerWidth);
-                elementHeight = Math.max(element.scrollHeight, element.offsetHeight, document.documentElement.scrollHeight, document.documentElement.offsetHeight, window.innerHeight);
+                // 对于 body 或 html 元素，使用窗口可见区域尺寸（viewport）
+                // 这样可以避免截图整个页面（包括不可见区域），减少图片大小
+                elementWidth = window.innerWidth;
+                elementHeight = window.innerHeight;
             }
             else {
-                // 对于其他元素，使用元素的完整尺寸
-                elementWidth = element.scrollWidth || element.clientWidth || element.offsetWidth;
-                elementHeight = element.scrollHeight || element.clientHeight || element.offsetHeight;
+                // 对于其他元素，使用元素的可见尺寸（clientWidth/clientHeight）
+                // 如果元素有滚动，只截图可见部分
+                elementWidth = element.clientWidth || element.offsetWidth || element.scrollWidth;
+                elementHeight = element.clientHeight || element.offsetHeight || element.scrollHeight;
             }
             if (!this.options.silentMode) {
                 console.log(`📸 目标元素: ${element.tagName}${element.id ? '#' + element.id : ''}${element.className ? '.' + element.className.split(' ').join('.') : ''}`);
@@ -15490,10 +15559,10 @@ class ScreenshotManager {
             // 计算压缩后的尺寸（对所有元素都应用，包括 document.body）
             // 这样可以避免生成过大的截图，减少 base64 大小
             const { width, height } = this.calculateCompressedSize(elementWidth, elementHeight, this.options.maxWidth, this.options.maxHeight);
-            // 对于所有元素都应用尺寸限制（包括 body），避免截图过大
-            // 如果计算后的尺寸小于元素实际尺寸，使用压缩尺寸；否则使用元素实际尺寸（但不超过最大值）
-            const finalWidth = width < elementWidth ? width : Math.min(elementWidth, this.options.maxWidth);
-            const finalHeight = height < elementHeight ? height : Math.min(elementHeight, this.options.maxHeight);
+            // 使用计算后的压缩尺寸（确保不超过 maxWidth/maxHeight）
+            // 对于 body 元素，已经使用了 window.innerWidth/innerHeight，所以直接使用压缩尺寸即可
+            const finalWidth = width;
+            const finalHeight = height;
             // 处理跨域图片的函数
             const handleCrossOriginImage = async (url) => {
                 // 如果是 data URL 或 blob URL，直接返回
@@ -17119,16 +17188,42 @@ class ScreenshotManager {
         return u8arr.buffer;
     }
     /**
-     * 构建二进制结构（按顺序：sign[14], type[1], topicLength[1], topic[topicLength], routingKey[8]）
-     * 20 + 1 + 8 + 8 = 37 字节
+     * 将 ArrayBuffer 转换为 base64 字符串
+     */
+    arrayBufferToBase64(buffer) {
+        const bytes = new Uint8Array(buffer);
+        // 使用循环构建字符串，避免 String.fromCharCode.apply 的参数数量限制
+        let binaryStr = '';
+        for (let i = 0; i < bytes.length; i++) {
+            binaryStr += String.fromCharCode(bytes[i]);
+        }
+        return btoa(binaryStr);
+    }
+    /**
+     * 构建二进制结构（按顺序：sign[20], type[1], topicLength[1], topic[topicLength], routingKeyLength[1], routingKey[routingKeyLength]）
+     * 总大小 = 20 + 1 + 1 + topicLength + 1 + routingKeyLength（动态计算）
+     *
+     * 与服务端格式对应：
+     * - sign: 20字节 (CharSequence, UTF-8)
+     * - type: 1字节 (转为无符号)
+     * - topicLength: 1字节
+     * - topic: topicLength字节 (CharSequence, UTF-8)
+     * - routingKeyLength: 1字节
+     * - routingKey: routingKeyLength字节 (CharSequence, UTF-8)
      */
     buildBinaryConfig(config) {
-        // 20 + 1 + 8 + 8 = 37 字节
-        const buffer = new ArrayBuffer(37);
-        const view = new DataView(buffer);
         const encoder = new TextEncoder();
+        // 计算实际长度
+        const topicBytes = encoder.encode(config.topic);
+        const topicLength = topicBytes.length;
+        const routingKeyBytes = encoder.encode(config.routingKey.trim());
+        const routingKeyLength = routingKeyBytes.length;
+        // 动态计算总大小：20(sign) + 1(type) + 1(topicLength) + topicLength + 1(routingKeyLength) + routingKeyLength
+        const totalSize = 20 + 1 + 1 + topicLength + 1 + routingKeyLength;
+        const buffer = new ArrayBuffer(totalSize);
+        const view = new DataView(buffer);
         let offset = 0;
-        // sign: 20字节 (字符串，UTF-8编码，不足补0，大端序)
+        // sign: 20字节 (字符串，UTF-8编码，不足补0)
         const signStr = String(config.sign);
         const signBytes = encoder.encode(signStr);
         const signArray = new Uint8Array(buffer, offset, 20);
@@ -17137,21 +17232,17 @@ class ScreenshotManager {
         // type: 1字节
         view.setUint8(offset, config.type);
         offset += 1;
-        // topic: 8字节
-        const topicBytes = encoder.encode(config.topic);
-        const topicLength = topicBytes.length;
         // topicLength: 1字节
         view.setUint8(offset, topicLength);
         offset += 1;
+        // topic: topicLength字节
         const topicArray = new Uint8Array(buffer, offset, topicLength);
         topicArray.set(topicBytes);
         offset += topicLength;
-        // routingKey: 
-        const routingKeyBytes = encoder.encode(config.routingKey.trim());
-        const routingKeyLength = routingKeyBytes.length;
         // routingKeyLength: 1字节
         view.setUint8(offset, routingKeyLength);
         offset += 1;
+        // routingKey: routingKeyLength字节
         const routingKeyArray = new Uint8Array(buffer, offset, routingKeyLength);
         routingKeyArray.set(routingKeyBytes);
         offset += routingKeyLength;
@@ -17202,6 +17293,30 @@ class ScreenshotManager {
                             // 将截图转换为 ArrayBuffer
                             const imageBuffer = this.dataUrlToArrayBuffer(latestScreenshot);
                             const imageBufferSize = imageBuffer.byteLength;
+                            // 将 imageBuffer 转换为 base64 字符串（用于和接收端对比）
+                            const imageBufferBase64 = this.arrayBufferToBase64(imageBuffer);
+                            // 验证：base64Data（从 latestScreenshot 提取）和 imageBufferBase64（从 imageBuffer 转换）应该一致
+                            const isBase64Same = base64Data === imageBufferBase64;
+                            // 打印 imageBuffer 的 base64 编码（用于和接收端对比）
+                            if (!this.options.silentMode) {
+                                console.log('📸 [发送前] 数据流程分析:');
+                                console.log(`  latestScreenshot: ${latestScreenshot.substring(0, 50)}... (原始 data URL)`);
+                                console.log(`  base64Data (从 latestScreenshot 提取): 长度 ${base64Data.length} 字符`);
+                                console.log(`  imageBuffer: ArrayBuffer, 大小 ${imageBufferSize} 字节`);
+                                console.log(`  imageBufferBase64 (从 imageBuffer 转换): 长度 ${imageBufferBase64.length} 字符`);
+                                console.log(`  ✅ 验证: base64Data === imageBufferBase64 ? ${isBase64Same ? '✅ 一致' : '❌ 不一致'}`);
+                                if (!isBase64Same) {
+                                    console.warn('📸 ⚠️ 警告: base64Data 和 imageBufferBase64 不一致！');
+                                    console.log('  base64Data (前100字符):', base64Data.substring(0, 100));
+                                    console.log('  imageBufferBase64 (前100字符):', imageBufferBase64.substring(0, 100));
+                                }
+                                console.log('📸 [发送前] imageBuffer 转换为 Base64（用于和接收端对比）:');
+                                console.log(`  Base64 长度: ${imageBufferBase64.length} 字符`);
+                                console.log(`  Base64 完整字符串:`);
+                                console.log(imageBufferBase64);
+                                console.log(`  📌 接收端使用方法: const imageUrl = \`data:image/webp;base64,\${receivedBase64}\``);
+                                console.log(`  Data URL: data:image/webp;base64,${imageBufferBase64}`);
+                            }
                             // 构建配置的二进制结构
                             const configBuffer = this.buildBinaryConfig(config);
                             const configBufferSize = configBuffer.byteLength;

package/dist/customer-sdk.esm.js

@@ -14988,6 +14988,10 @@ class ScreenshotManager {
         if (!this.options.silentMode) {
             console.log('📸 使用 snapdom 引擎截图...');
         }
+        // 限制只截图可见区域（viewport），避免截图不可见区域
+        // 注意：snapdom 可能不支持直接限制可见区域，所以这里只是添加警告
+        let targetElement = element;
+        let tempContainer = null;
         try {
             // 检查元素是否存在和可见
             const rect = element.getBoundingClientRect();
@@ -14996,6 +15000,53 @@ class ScreenshotManager {
             }
             // 构建 snapdom 选项
             const options = {};
+            if (element === document.body || element === document.documentElement) {
+                // 对于 body 或 html 元素，创建一个临时容器，只包含可见区域
+                // 使用 html2canvas 的方式：创建一个固定大小的容器，只包含可见内容
+                tempContainer = document.createElement('div');
+                tempContainer.style.position = 'fixed';
+                tempContainer.style.top = '0';
+                tempContainer.style.left = '0';
+                tempContainer.style.width = `${window.innerWidth}px`;
+                tempContainer.style.height = `${window.innerHeight}px`;
+                tempContainer.style.overflow = 'hidden';
+                tempContainer.style.zIndex = '999999';
+                tempContainer.style.pointerEvents = 'none';
+                tempContainer.style.backgroundColor = window.getComputedStyle(document.body).backgroundColor || 'white';
+                // 创建一个包装器，只包含可见区域的内容
+                // 注意：这里不克隆整个 body，而是直接使用 body 作为父元素
+                // 但限制容器的尺寸为可见区域
+                document.body.appendChild(tempContainer);
+                // 使用 body 作为目标，但通过容器限制范围
+                // 实际上，我们需要直接截图 body，但限制尺寸
+                // 由于 snapdom 可能不支持直接限制尺寸，我们使用一个更简单的方法：
+                // 直接截图 body，但通过 CSS 限制其显示范围（但这会影响页面）
+                // 更好的方法是：使用 html2canvas 的方式，创建一个 canvas 并只绘制可见区域
+                // 简化方案：直接使用 body，但添加尺寸限制选项（如果 snapdom 支持）
+                // 如果不支持，则只能截图整个 body
+                targetElement = element;
+                if (!this.options.silentMode) {
+                    console.log(`📸 注意：snapdom 将截图整个 body，建议使用 html2canvas 或 modern-screenshot 来限制可见区域`);
+                    console.log(`📸 可见区域尺寸: ${window.innerWidth}x${window.innerHeight}`);
+                }
+                // 清理临时容器（未使用）
+                if (tempContainer && tempContainer.parentNode) {
+                    tempContainer.parentNode.removeChild(tempContainer);
+                }
+                tempContainer = null;
+            }
+            else {
+                // 对于其他元素，检查是否完全可见
+                const elementRect = element.getBoundingClientRect();
+                const isFullyVisible = elementRect.top >= 0 &&
+                    elementRect.left >= 0 &&
+                    elementRect.bottom <= window.innerHeight &&
+                    elementRect.right <= window.innerWidth;
+                if (!isFullyVisible && !this.options.silentMode) {
+                    console.warn(`📸 ⚠️ 元素部分不可见，snapdom 可能会截图整个元素（包括不可见部分）`);
+                    console.warn(`📸 建议：使用 html2canvas 或 modern-screenshot 来限制可见区域`);
+                }
+            }
             // 如果配置了代理服务器，使用 useProxy 选项处理跨域图片和字体
             // 参考: https://github.com/zumerlab/snapdom/blob/main/README_CN.md#跨域图片和字体-useproxy
             // 只有当 useProxy 为 true 且 proxyUrl 存在时才使用代理
@@ -15030,16 +15081,16 @@ class ScreenshotManager {
             switch (outputFormat) {
                 case 'jpeg':
                     // 使用 toJpg 快捷方法（snapdom 使用 jpg 作为方法名）
-                    img = await snapdom.toJpg(element, options);
+                    img = await snapdom.toJpg(targetElement, options);
                     break;
                 case 'webp':
                     // 使用 toWebp 快捷方法
-                    img = await snapdom.toWebp(element, options);
+                    img = await snapdom.toWebp(targetElement, options);
                     break;
                 case 'png':
                 default:
                     // 使用 toPng 快捷方法（默认）
-                    img = await snapdom.toPng(element, options);
+                    img = await snapdom.toPng(targetElement, options);
                     break;
             }
             // 获取 base64 数据（HTMLImageElement 的 src 属性包含 data URL）
@@ -15048,12 +15099,28 @@ class ScreenshotManager {
             if (!dataUrl || dataUrl.length < 100) {
                 throw new Error('生成的 base64 数据无效或过短');
             }
+            // 清理临时容器（如果存在）
+            if (tempContainer !== null) {
+                const container = tempContainer;
+                const parent = container.parentNode;
+                if (parent) {
+                    parent.removeChild(container);
+                }
+            }
             if (!this.options.silentMode) {
                 console.log(`📸 snapdom 截图成功！格式: ${outputFormat}, 尺寸: ${img.width}x${img.height}`);
             }
             return dataUrl;
         }
         catch (error) {
+            // 确保清理临时容器（即使出错）
+            if (tempContainer !== null) {
+                const container = tempContainer;
+                const parent = container.parentNode;
+                if (parent) {
+                    parent.removeChild(container);
+                }
+            }
             const errorMessage = error instanceof Error ? error.message : String(error);
             const errorName = error instanceof Error ? error.name : 'Unknown';
             // 针对不同类型的错误给出具体提示
@@ -15450,19 +15517,21 @@ class ScreenshotManager {
             console.log('📸 使用 modern-screenshot 引擎截图（Worker 模式）...');
         }
         try {
-            // 获取元素的实际尺寸（使用 scrollWidth/scrollHeight 获取完整内容尺寸）
-            // 对于 document.body，需要特殊处理，确保截取完整页面内容
+            // 获取元素的实际尺寸
+            // 对于 document.body，使用窗口可见区域尺寸（而不是完整滚动内容），避免截图过大
             let elementWidth;
             let elementHeight;
             if (element === document.body || element === document.documentElement) {
-                // 对于 body 或 html 元素，使用页面的完整尺寸（包括滚动内容）
-                elementWidth = Math.max(element.scrollWidth, element.offsetWidth, document.documentElement.scrollWidth, document.documentElement.offsetWidth, window.innerWidth);
-                elementHeight = Math.max(element.scrollHeight, element.offsetHeight, document.documentElement.scrollHeight, document.documentElement.offsetHeight, window.innerHeight);
+                // 对于 body 或 html 元素，使用窗口可见区域尺寸（viewport）
+                // 这样可以避免截图整个页面（包括不可见区域），减少图片大小
+                elementWidth = window.innerWidth;
+                elementHeight = window.innerHeight;
             }
             else {
-                // 对于其他元素，使用元素的完整尺寸
-                elementWidth = element.scrollWidth || element.clientWidth || element.offsetWidth;
-                elementHeight = element.scrollHeight || element.clientHeight || element.offsetHeight;
+                // 对于其他元素，使用元素的可见尺寸（clientWidth/clientHeight）
+                // 如果元素有滚动，只截图可见部分
+                elementWidth = element.clientWidth || element.offsetWidth || element.scrollWidth;
+                elementHeight = element.clientHeight || element.offsetHeight || element.scrollHeight;
             }
             if (!this.options.silentMode) {
                 console.log(`📸 目标元素: ${element.tagName}${element.id ? '#' + element.id : ''}${element.className ? '.' + element.className.split(' ').join('.') : ''}`);
@@ -15486,10 +15555,10 @@ class ScreenshotManager {
             // 计算压缩后的尺寸（对所有元素都应用，包括 document.body）
             // 这样可以避免生成过大的截图，减少 base64 大小
             const { width, height } = this.calculateCompressedSize(elementWidth, elementHeight, this.options.maxWidth, this.options.maxHeight);
-            // 对于所有元素都应用尺寸限制（包括 body），避免截图过大
-            // 如果计算后的尺寸小于元素实际尺寸，使用压缩尺寸；否则使用元素实际尺寸（但不超过最大值）
-            const finalWidth = width < elementWidth ? width : Math.min(elementWidth, this.options.maxWidth);
-            const finalHeight = height < elementHeight ? height : Math.min(elementHeight, this.options.maxHeight);
+            // 使用计算后的压缩尺寸（确保不超过 maxWidth/maxHeight）
+            // 对于 body 元素，已经使用了 window.innerWidth/innerHeight，所以直接使用压缩尺寸即可
+            const finalWidth = width;
+            const finalHeight = height;
             // 处理跨域图片的函数
             const handleCrossOriginImage = async (url) => {
                 // 如果是 data URL 或 blob URL，直接返回
@@ -17115,16 +17184,42 @@ class ScreenshotManager {
         return u8arr.buffer;
     }
     /**
-     * 构建二进制结构（按顺序：sign[14], type[1], topicLength[1], topic[topicLength], routingKey[8]）
-     * 20 + 1 + 8 + 8 = 37 字节
+     * 将 ArrayBuffer 转换为 base64 字符串
+     */
+    arrayBufferToBase64(buffer) {
+        const bytes = new Uint8Array(buffer);
+        // 使用循环构建字符串，避免 String.fromCharCode.apply 的参数数量限制
+        let binaryStr = '';
+        for (let i = 0; i < bytes.length; i++) {
+            binaryStr += String.fromCharCode(bytes[i]);
+        }
+        return btoa(binaryStr);
+    }
+    /**
+     * 构建二进制结构（按顺序：sign[20], type[1], topicLength[1], topic[topicLength], routingKeyLength[1], routingKey[routingKeyLength]）
+     * 总大小 = 20 + 1 + 1 + topicLength + 1 + routingKeyLength（动态计算）
+     *
+     * 与服务端格式对应：
+     * - sign: 20字节 (CharSequence, UTF-8)
+     * - type: 1字节 (转为无符号)
+     * - topicLength: 1字节
+     * - topic: topicLength字节 (CharSequence, UTF-8)
+     * - routingKeyLength: 1字节
+     * - routingKey: routingKeyLength字节 (CharSequence, UTF-8)
      */
     buildBinaryConfig(config) {
-        // 20 + 1 + 8 + 8 = 37 字节
-        const buffer = new ArrayBuffer(37);
-        const view = new DataView(buffer);
         const encoder = new TextEncoder();
+        // 计算实际长度
+        const topicBytes = encoder.encode(config.topic);
+        const topicLength = topicBytes.length;
+        const routingKeyBytes = encoder.encode(config.routingKey.trim());
+        const routingKeyLength = routingKeyBytes.length;
+        // 动态计算总大小：20(sign) + 1(type) + 1(topicLength) + topicLength + 1(routingKeyLength) + routingKeyLength
+        const totalSize = 20 + 1 + 1 + topicLength + 1 + routingKeyLength;
+        const buffer = new ArrayBuffer(totalSize);
+        const view = new DataView(buffer);
         let offset = 0;
-        // sign: 20字节 (字符串，UTF-8编码，不足补0，大端序)
+        // sign: 20字节 (字符串，UTF-8编码，不足补0)
         const signStr = String(config.sign);
         const signBytes = encoder.encode(signStr);
         const signArray = new Uint8Array(buffer, offset, 20);
@@ -17133,21 +17228,17 @@ class ScreenshotManager {
         // type: 1字节
         view.setUint8(offset, config.type);
         offset += 1;
-        // topic: 8字节
-        const topicBytes = encoder.encode(config.topic);
-        const topicLength = topicBytes.length;
         // topicLength: 1字节
         view.setUint8(offset, topicLength);
         offset += 1;
+        // topic: topicLength字节
         const topicArray = new Uint8Array(buffer, offset, topicLength);
         topicArray.set(topicBytes);
         offset += topicLength;
-        // routingKey: 
-        const routingKeyBytes = encoder.encode(config.routingKey.trim());
-        const routingKeyLength = routingKeyBytes.length;
         // routingKeyLength: 1字节
         view.setUint8(offset, routingKeyLength);
         offset += 1;
+        // routingKey: routingKeyLength字节
         const routingKeyArray = new Uint8Array(buffer, offset, routingKeyLength);
         routingKeyArray.set(routingKeyBytes);
         offset += routingKeyLength;
@@ -17198,6 +17289,30 @@ class ScreenshotManager {
                             // 将截图转换为 ArrayBuffer
                             const imageBuffer = this.dataUrlToArrayBuffer(latestScreenshot);
                             const imageBufferSize = imageBuffer.byteLength;
+                            // 将 imageBuffer 转换为 base64 字符串（用于和接收端对比）
+                            const imageBufferBase64 = this.arrayBufferToBase64(imageBuffer);
+                            // 验证：base64Data（从 latestScreenshot 提取）和 imageBufferBase64（从 imageBuffer 转换）应该一致
+                            const isBase64Same = base64Data === imageBufferBase64;
+                            // 打印 imageBuffer 的 base64 编码（用于和接收端对比）
+                            if (!this.options.silentMode) {
+                                console.log('📸 [发送前] 数据流程分析:');
+                                console.log(`  latestScreenshot: ${latestScreenshot.substring(0, 50)}... (原始 data URL)`);
+                                console.log(`  base64Data (从 latestScreenshot 提取): 长度 ${base64Data.length} 字符`);
+                                console.log(`  imageBuffer: ArrayBuffer, 大小 ${imageBufferSize} 字节`);
+                                console.log(`  imageBufferBase64 (从 imageBuffer 转换): 长度 ${imageBufferBase64.length} 字符`);
+                                console.log(`  ✅ 验证: base64Data === imageBufferBase64 ? ${isBase64Same ? '✅ 一致' : '❌ 不一致'}`);
+                                if (!isBase64Same) {
+                                    console.warn('📸 ⚠️ 警告: base64Data 和 imageBufferBase64 不一致！');
+                                    console.log('  base64Data (前100字符):', base64Data.substring(0, 100));
+                                    console.log('  imageBufferBase64 (前100字符):', imageBufferBase64.substring(0, 100));
+                                }
+                                console.log('📸 [发送前] imageBuffer 转换为 Base64（用于和接收端对比）:');
+                                console.log(`  Base64 长度: ${imageBufferBase64.length} 字符`);
+                                console.log(`  Base64 完整字符串:`);
+                                console.log(imageBufferBase64);
+                                console.log(`  📌 接收端使用方法: const imageUrl = \`data:image/webp;base64,\${receivedBase64}\``);
+                                console.log(`  Data URL: data:image/webp;base64,${imageBufferBase64}`);
+                            }
                             // 构建配置的二进制结构
                             const configBuffer = this.buildBinaryConfig(config);
                             const configBufferSize = configBuffer.byteLength;