import { UPLOAD_URL } from "@/app/constant"; import heic2any from "heic2any"; export function compressImage(file: File, maxSize: number): Promise { return new Promise((resolve, reject) => { const reader = new FileReader(); reader.onload = (readerEvent: any) => { const image = new Image(); image.onload = () => { let canvas = document.createElement("canvas"); let ctx = canvas.getContext("2d"); let width = image.width; let height = image.height; let quality = 0.9; let dataUrl; do { canvas.width = width; canvas.height = height; ctx?.clearRect(0, 0, canvas.width, canvas.height); ctx?.drawImage(image, 0, 0, width, height); dataUrl = canvas.toDataURL("image/jpeg", quality); if (dataUrl.length < maxSize) break; if (quality > 0.5) { // Prioritize quality reduction quality -= 0.1; } else { // Then reduce the size width *= 0.9; height *= 0.9; } } while (dataUrl.length > maxSize); resolve(dataUrl); }; image.onerror = reject; image.src = readerEvent.target.result; }; reader.onerror = reject; if (file.type.includes("heic")) { heic2any({ blob: file, toType: "image/jpeg" }) .then((blob) => { reader.readAsDataURL(blob as Blob); }) .catch((e) => { reject(e); }); } reader.readAsDataURL(file); }); } export function base64Image2Blob(base64Data: string, contentType: string) { const byteCharacters = atob(base64Data); const byteNumbers = new Array(byteCharacters.length); for (let i = 0; i < byteCharacters.length; i++) { byteNumbers[i] = byteCharacters.charCodeAt(i); } const byteArray = new Uint8Array(byteNumbers); return new Blob([byteArray], { type: contentType }); } export function uploadImage(file: Blob): Promise { const body = new FormData(); body.append("file", file); return fetch(UPLOAD_URL, { method: "post", body, mode: "cors", credentials: "include", }) .then((res) => res.json()) .then((res) => { console.log("res", res); if (res?.code == 0 && res?.data) { return res?.data; } throw Error(`upload Error: ${res?.msg}`); }); } export function removeImage(imageUrl: string) { return fetch(imageUrl, { method: "DELETE", mode: "cors", credentials: "include", }); }