diff --git a/src/views/ValueForum/components/CreatePostModal.js b/src/views/ValueForum/components/CreatePostModal.js index 41ee02af..2362e720 100644 --- a/src/views/ValueForum/components/CreatePostModal.js +++ b/src/views/ValueForum/components/CreatePostModal.js @@ -79,18 +79,18 @@ const CreatePostModal = ({ isOpen, onClose, onPostCreated }) => { return; } - // 检查文件大小(5MB 限制) - if (file.size > 5 * 1024 * 1024) { - reject(new Error('图片大小不能超过 5MB')); + // 检查文件大小(10MB 限制,给压缩留空间) + if (file.size > 10 * 1024 * 1024) { + reject(new Error('图片大小不能超过 10MB')); return; } const reader = new FileReader(); - reader.onload = (e) => { - const img = new Image(); + reader.onload = function(e) { + const img = document.createElement('img'); - img.onload = () => { + img.onload = function() { try { // 创建 canvas 进行压缩 const canvas = document.createElement('canvas'); @@ -101,10 +101,10 @@ const CreatePostModal = ({ isOpen, onClose, onPostCreated }) => { const maxDimension = 1920; if (width > maxDimension || height > maxDimension) { if (width > height) { - height = (height * maxDimension) / width; + height = Math.round((height * maxDimension) / width); width = maxDimension; } else { - width = (width * maxDimension) / height; + width = Math.round((width * maxDimension) / height); height = maxDimension; } } @@ -115,45 +115,35 @@ const CreatePostModal = ({ isOpen, onClose, onPostCreated }) => { const ctx = canvas.getContext('2d'); ctx.drawImage(img, 0, 0, width, height); - // 转换为 JPEG 格式,质量 0.8(压缩) - canvas.toBlob( - (blob) => { - if (!blob) { - reject(new Error('图片压缩失败')); - return; - } + // 转换为 Data URL(JPEG 格式,质量 0.8) + try { + const compressedDataUrl = canvas.toDataURL('image/jpeg', 0.8); - const compressedReader = new FileReader(); + // 计算压缩率 + const originalSize = file.size; + const compressedSize = Math.round((compressedDataUrl.length * 3) / 4); // Base64 解码后的大小 - compressedReader.onloadend = () => { - console.log( - `图片压缩: ${(file.size / 1024).toFixed(2)}KB -> ${(blob.size / 1024).toFixed(2)}KB` - ); - resolve(compressedReader.result); - }; + console.log( + `图片压缩: ${(originalSize / 1024).toFixed(2)}KB -> ${(compressedSize / 1024).toFixed(2)}KB` + ); - compressedReader.onerror = () => { - reject(new Error('压缩后图片读取失败')); - }; - - compressedReader.readAsDataURL(blob); - }, - 'image/jpeg', - 0.8 - ); + resolve(compressedDataUrl); + } catch (error) { + reject(new Error('图片压缩失败')); + } } catch (error) { reject(new Error(`图片处理失败: ${error.message}`)); } }; - img.onerror = () => { + img.onerror = function() { reject(new Error('图片加载失败')); }; img.src = e.target.result; }; - reader.onerror = () => { + reader.onerror = function() { reject(new Error('文件读取失败')); };