diff --git a/js/script.js b/js/script.js index 46a651e..4fc97d6 100644 --- a/js/script.js +++ b/js/script.js @@ -1790,18 +1790,32 @@ const canvas = await generateCanvas(); console.log('预览画布尺寸:', canvas.width, 'x', canvas.height); - // 在 toBlob 之前再次确认 canvas 尺寸 - console.log('预览 toBlob 前 canvas 尺寸:', canvas.width, 'x', canvas.height); + // 尝试使用 toDataURL 获取更高质量的图片 + let dataUrl; + let blob; + + try { + // 先尝试 toDataURL + dataUrl = canvas.toDataURL('image/png'); + console.log('预览 toDataURL 成功,dataUrl 长度:', dataUrl.length); + + // 将 dataUrl 转换为 blob + const response = await fetch(dataUrl); + blob = await response.blob(); + console.log('预览 dataUrl 转 blob 成功,blob 尺寸:', blob.size, 'bytes'); + } catch (err) { + console.log('预览 toDataURL 失败,使用 toBlob:', err); + // 如果 toDataURL 失败,使用 toBlob + blob = await new Promise(resolve => { + canvas.toBlob((b) => { + console.log('预览 toBlob 回调 - blob 尺寸:', b.size, 'bytes'); + resolve(b); + }, 'image/png', 1.0); + }); + dataUrl = URL.createObjectURL(blob); + } - // 使用 toBlob 获取更高质量的图片 - const blob = await new Promise(resolve => { - canvas.toBlob((b) => { - console.log('预览 toBlob 回调 - blob 尺寸:', b.size, 'bytes'); - resolve(b); - }, 'image/png', 1.0); - }); console.log('预览图片大小:', (blob.size / 1024).toFixed(2), 'KB'); - const dataUrl = URL.createObjectURL(blob); showPreviewModal(dataUrl, blob); } @@ -2295,15 +2309,32 @@ // 在 toBlob 之前再次确认 canvas 尺寸 console.log('toBlob 前 canvas 尺寸:', canvas.width, 'x', canvas.height); - // 使用 toBlob 获取更高质量的图片 - const blob = await new Promise(resolve => { - canvas.toBlob((b) => { - console.log('toBlob 回调 - blob 尺寸:', b.size, 'bytes'); - resolve(b); - }, 'image/png', 1.0); - }); + // 尝试使用 toDataURL 获取更高质量的图片 + let dataUrl; + let blob; + + try { + // 先尝试 toDataURL + dataUrl = canvas.toDataURL('image/png'); + console.log('toDataURL 成功,dataUrl 长度:', dataUrl.length); + + // 将 dataUrl 转换为 blob + const response = await fetch(dataUrl); + blob = await response.blob(); + console.log('dataUrl 转 blob 成功,blob 尺寸:', blob.size, 'bytes'); + } catch (err) { + console.log('toDataURL 失败,使用 toBlob:', err); + // 如果 toDataURL 失败,使用 toBlob + blob = await new Promise(resolve => { + canvas.toBlob((b) => { + console.log('toBlob 回调 - blob 尺寸:', b.size, 'bytes'); + resolve(b); + }, 'image/png', 1.0); + }); + dataUrl = URL.createObjectURL(blob); + } + console.log('导出图片大小:', (blob.size / 1024).toFixed(2), 'KB'); - const dataUrl = URL.createObjectURL(blob); const filename = '邀请函_' + Date.now() + '.png'; // 保存 blob 供后续使用