Upload 2 files

src/lib/imageSlicer.js

@@ -50,54 +50,94 @@ class ImageSlicer {
   calculateLongImageSliceGrid(width, height, aspectRatio) {
     console.log(`[${new Date().toISOString()}] 📏 长图裁切分析: ${width}x${height}, 比例=${aspectRatio.toFixed(2)}`)
 
-    // 对于长图，优先沿长边方向裁切，保持更大的重叠区域
+    // 对于长图，使用更保守的策略，确保不会出现边界错误
     const isVerticalLong = height > width
 
     if (isVerticalLong) {
       // 垂直长图：沿高度方向裁切
-      const enhancedOverlap = Math.min(this.overlapPixels * 2, this.maxSize * 0.1)
+      const enhancedOverlap = Math.min(this.overlapPixels * 2, 200) // 限制最大重叠
       const sliceHeight = this.maxSize
-      const stepY = Math.max(1, sliceHeight - enhancedOverlap)
 
-      // 重新计算行数，确保覆盖整个图片
-      const rows = Math.ceil((height - enhancedOverlap) / stepY)
-      const cols = 1 // 垂直长图通常不需要水平裁切
+      // 计算需要多少片才能覆盖整个图片
+      let rows = 1
+      let currentY = 0
+      const positions = []
 
-      console.log(`[${new Date().toISOString()}] 📏 垂直长图策略: ${rows}行x${cols}列, 重叠=${enhancedOverlap}px`)
-      console.log(`[${new Date().toISOString()}] 📏 切片尺寸: ${width}x${sliceHeight}, 步长=${stepY}`)
+      while (currentY < height) {
+        const remainingHeight = height - currentY
+        const actualSliceHeight = Math.min(sliceHeight, remainingHeight)
+
+        positions.push({
+          y: currentY,
+          height: actualSliceHeight
+        })
+
+        // 如果这是最后一片，就结束
+        if (currentY + actualSliceHeight >= height) {
+          break
+        }
+
+        // 计算下一片的起始位置
+        currentY += actualSliceHeight - enhancedOverlap
+        rows++
+      }
+
+      console.log(`[${new Date().toISOString()}] 📏 垂直长图策略: ${rows}行x1列, 重叠=${enhancedOverlap}px`)
+      console.log(`[${new Date().toISOString()}] 📏 切片位置:`, positions.map(p => `y=${p.y}, h=${p.height}`).join(', '))
 
       return {
         rows,
-        cols,
+        cols: 1,
         sliceWidth: width,
         sliceHeight,
         stepX: width,
-        stepY,
-        totalSlices: rows * cols,
-        overlapPixels: enhancedOverlap
+        stepY: sliceHeight - enhancedOverlap,
+        totalSlices: rows,
+        overlapPixels: enhancedOverlap,
+        positions // 添加精确的位置信息
       }
     } else {
       // 水平长图：沿宽度方向裁切
-      const enhancedOverlap = Math.min(this.overlapPixels * 2, this.maxSize * 0.1)
+      const enhancedOverlap = Math.min(this.overlapPixels * 2, 200) // 限制最大重叠
       const sliceWidth = this.maxSize
-      const stepX = Math.max(1, sliceWidth - enhancedOverlap)
 
-      // 重新计算列数，确保覆盖整个图片
-      const cols = Math.ceil((width - enhancedOverlap) / stepX)
-      const rows = 1 // 水平长图通常不需要垂直裁切
+      // 计算需要多少片才能覆盖整个图片
+      let cols = 1
+      let currentX = 0
+      const positions = []
+
+      while (currentX < width) {
+        const remainingWidth = width - currentX
+        const actualSliceWidth = Math.min(sliceWidth, remainingWidth)
+
+        positions.push({
+          x: currentX,
+          width: actualSliceWidth
+        })
 
-      console.log(`[${new Date().toISOString()}] 📏 水平长图策略: ${rows}行x${cols}列, 重叠=${enhancedOverlap}px`)
-      console.log(`[${new Date().toISOString()}] 📏 切片尺寸: ${sliceWidth}x${height}, 步长=${stepX}`)
+        // 如果这是最后一片，就结束
+        if (currentX + actualSliceWidth >= width) {
+          break
+        }
+
+        // 计算下一片的起始位置
+        currentX += actualSliceWidth - enhancedOverlap
+        cols++
+      }
+
+      console.log(`[${new Date().toISOString()}] 📏 水平长图策略: 1行x${cols}列, 重叠=${enhancedOverlap}px`)
+      console.log(`[${new Date().toISOString()}] 📏 切片位置:`, positions.map(p => `x=${p.x}, w=${p.width}`).join(', '))
 
       return {
-        rows,
+        rows: 1,
         cols,
         sliceWidth,
         sliceHeight: height,
-        stepX,
+        stepX: sliceWidth - enhancedOverlap,
         stepY: height,
-        totalSlices: rows * cols,
-        overlapPixels: enhancedOverlap
+        totalSlices: cols,
+        overlapPixels: enhancedOverlap,
+        positions // 添加精确的位置信息
       }
     }
   }
@@ -178,12 +218,32 @@ class ImageSlicer {
       // 生成所有切片
       for (let row = 0; row < grid.rows; row++) {
         for (let col = 0; col < grid.cols; col++) {
-          const x = col * grid.stepX
-          const y = row * grid.stepY
-          
-          // 确保不超出图片边界
-          const actualWidth = Math.min(grid.sliceWidth, metadata.width - x)
-          const actualHeight = Math.min(grid.sliceHeight, metadata.height - y)
+          let x, y, actualWidth, actualHeight
+
+          // 如果有精确的位置信息，使用它
+          if (grid.positions) {
+            if (grid.rows > 1) {
+              // 垂直长图
+              const pos = grid.positions[row]
+              x = 0
+              y = pos.y
+              actualWidth = grid.sliceWidth
+              actualHeight = pos.height
+            } else {
+              // 水平长图
+              const pos = grid.positions[col]
+              x = pos.x
+              y = 0
+              actualWidth = pos.width
+              actualHeight = grid.sliceHeight
+            }
+          } else {
+            // 使用传统的计算方式
+            x = col * grid.stepX
+            y = row * grid.stepY
+            actualWidth = Math.min(grid.sliceWidth, metadata.width - x)
+            actualHeight = Math.min(grid.sliceHeight, metadata.height - y)
+          }
 
           // 验证裁切参数
           if (x < 0 || y < 0 || actualWidth <= 0 || actualHeight <= 0 ||
@@ -192,24 +252,35 @@ class ImageSlicer {
             console.error(`[${new Date().toISOString()}]   图片尺寸: ${metadata.width}x${metadata.height}`)
             console.error(`[${new Date().toISOString()}]   裁切位置: (${x}, ${y})`)
             console.error(`[${new Date().toISOString()}]   裁切尺寸: ${actualWidth}x${actualHeight}`)
+            console.error(`[${new Date().toISOString()}]   边界检查: x+w=${x + actualWidth} <= ${metadata.width}, y+h=${y + actualHeight} <= ${metadata.height}`)
             continue // 跳过这个无效的切片
           }
 
           console.log(`[${new Date().toISOString()}] 🔪 生成切片 ${row * grid.cols + col + 1}/${grid.totalSlices}: ${actualWidth}x${actualHeight} at (${x},${y})`)
+          console.log(`[${new Date().toISOString()}] 🔍 边界验证: 图片${metadata.width}x${metadata.height}, 裁切区域(${x},${y},${actualWidth},${actualHeight})`)
 
           // 裁切图片并转换为JPEG格式（更好的兼容性）
-          const sliceBuffer = await image
-            .extract({
-              left: x,
-              top: y,
-              width: actualWidth,
-              height: actualHeight
-            })
-            .jpeg({
-              quality: 90,  // 高质量JPEG
-              progressive: false
-            })
-            .toBuffer()
+          let sliceBuffer
+          try {
+            sliceBuffer = await image
+              .extract({
+                left: x,
+                top: y,
+                width: actualWidth,
+                height: actualHeight
+              })
+              .jpeg({
+                quality: 90,  // 高质量JPEG
+                progressive: false
+              })
+              .toBuffer()
+          } catch (extractError) {
+            console.error(`[${new Date().toISOString()}] ❌ Sharp裁切失败:`)
+            console.error(`[${new Date().toISOString()}]   错误: ${extractError.message}`)
+            console.error(`[${new Date().toISOString()}]   参数: left=${x}, top=${y}, width=${actualWidth}, height=${actualHeight}`)
+            console.error(`[${new Date().toISOString()}]   图片: ${metadata.width}x${metadata.height}`)
+            throw extractError
+          }
           
           const sliceIndex = row * grid.cols + col
           const sliceName = this.generateSliceName(originalName, sliceIndex, grid.totalSlices)