fix: 修复画板再次编辑无法保存问题

.env.test

@@ -4,6 +4,6 @@ VITE_OSS_URL = https://lxx-web-1313840333.cos.ap-chengdu.myqcloud.com
 VITE_CDN_URL = https://dmgcdn-1313840333.cos.ap-guangzhou.myqcloud.com
 VITE_SERVER_URL = http://127.0.0.1:9053/api/main
 # VITE_SERVER_URL = http://test.web.xuexiaole.com/api/main
-VITE_XXL_VERSION=2.13.6
+VITE_XXL_VERSION=2.13.7
 VITE_INIT_VCONSOLE = 0
 VITE_TEACHER_ADMIN_URL = https://test.edu.xuexiaole.com

src/components/SignaturePad/index.vue

@@ -37,6 +37,9 @@ async function drawBackground(src: string, taskId = paintTaskId) {
 
   const draw = async (imgSrc: string) => {
     const img = new Image()
+    if (/^https?:\/\//i.test(imgSrc)) {
+      img.crossOrigin = 'anonymous'
+    }
     img.src = imgSrc
     await new Promise<void>((resolve, reject) => {
       img.onload = () => resolve()
@@ -114,15 +117,25 @@ function handleSaveAsync(): Promise<{ blob: Blob | null; data: string | null }>
     const canvas = canvasRef.value as HTMLCanvasElement
     const pointData = JSON.stringify(signaturePad.toData())
     const resolveWithFallback = (blob: Blob | null) => {
-      resolve({
-        blob: blob || dataUrlToBlob(canvas.toDataURL('image/jpeg', 0.85)),
-        data: pointData,
-      })
+      try {
+        resolve({
+          blob: blob || dataUrlToBlob(canvas.toDataURL('image/jpeg', 0.85)),
+          data: pointData,
+        })
+      } catch (error) {
+        console.error('canvas export error', error)
+        resolve({ blob: null, data: pointData })
+      }
     }
-    if (typeof canvas.toBlob === 'function') {
-      canvas.toBlob(resolveWithFallback, 'image/jpeg', 0.85)
-    } else {
-      resolveWithFallback(null)
+    try {
+      if (typeof canvas.toBlob === 'function') {
+        canvas.toBlob(resolveWithFallback, 'image/jpeg', 0.85)
+      } else {
+        resolveWithFallback(null)
+      }
+    } catch (error) {
+      console.error('canvas export error', error)
+      resolve({ blob: null, data: pointData })
     }
   })
 }

src/components/question/answer/HandDrawn.vue

@@ -59,7 +59,7 @@ async function save() {
   const { blob, data } = await signaturePadRef.value.handleSaveAsync()
 
   if (!blob) {
-    return XMessage.error('内容为空，无法保存')
+    return XMessage.error(data ? '画板图片导出失败，请重试' : '内容为空，无法保存')
   }
 
   if (typeof props.uploadFile !== 'function') {
@@ -192,13 +192,12 @@ watch(showCanvas, async (nv: boolean) => {
   pen()
   const bg = viewPic.value
   const data = props.isAndroid ? '' : props.submitAnswerPicOriginal || ''
-  if (bg) {
+  if (data) {
+    signaturePadRef.value?.handleLoad?.(data)
+  } else if (bg) {
     await signaturePadRef.value?.setBackgroundImage?.(bg)
   }
   if (!showCanvas.value || currentSessionId !== canvasSessionId) return
-  if (data) {
-    signaturePadRef.value?.handleLoad?.(data)
-  }
 })
 </script>
 <template>