| | |
| | | * Copyright (c) 2024 by GuLiMmo, All Rights Reserved. |
| | | */ |
| | | export default function compressImage( |
| | | src, |
| | | maxWidth, |
| | | maxHeight, |
| | | outputFormat = 'image/jpeg', |
| | | quality = 0.7, |
| | | src, |
| | | maxWidth, |
| | | maxHeight, |
| | | outputFormat = 'image/jpeg', |
| | | quality = 0.7 |
| | | ) { |
| | | return new Promise((resolve, reject) => { |
| | | const image = new Image(); |
| | | image.setAttribute('crossOrigin', 'Anonymous'); |
| | | image.src = src; |
| | | image.onload = () => { |
| | | let width = image.width; |
| | | let height = image.height; |
| | | return new Promise((resolve, reject) => { |
| | | const image = new Image() |
| | | image.setAttribute('crossOrigin', 'Anonymous') |
| | | image.src = src |
| | | image.onload = () => { |
| | | let width = image.width |
| | | let height = image.height |
| | | |
| | | if (width > maxWidth) { |
| | | height *= maxWidth / width; |
| | | width = maxWidth; |
| | | } |
| | | if (width > maxWidth) { |
| | | height *= maxWidth / width |
| | | width = maxWidth |
| | | } |
| | | |
| | | if (height > maxHeight) { |
| | | width *= maxHeight / height; |
| | | height = maxHeight; |
| | | } |
| | | if (height > maxHeight) { |
| | | width *= maxHeight / height |
| | | height = maxHeight |
| | | } |
| | | |
| | | const canvas = document.createElement('canvas'); |
| | | canvas.width = width; |
| | | canvas.height = height; |
| | | const ctx = canvas.getContext('2d'); |
| | | ctx.drawImage(image, 0, 0, width, height); |
| | | const canvas = document.createElement('canvas') |
| | | canvas.width = width |
| | | canvas.height = height |
| | | const ctx = canvas.getContext('2d') |
| | | ctx.drawImage(image, 0, 0, width, height) |
| | | |
| | | const newDataUrl = canvas.toDataURL(outputFormat, quality); |
| | | resolve(newDataUrl); |
| | | }; |
| | | image.onerror = reject; |
| | | }); |
| | | const newDataUrl = canvas.toDataURL(outputFormat, quality) |
| | | resolve(newDataUrl) |
| | | } |
| | | image.onerror = reject |
| | | }) |
| | | } |