Estoy tratando de cambiar el tamaño de varias imágenes en el navegador (los mismos resultados en Chrome y Safari) usando lienzo, para luego guardarlas en IndexedDB a través de Dexie.js. Todo funciona bien en Android, pero en iOS (probado en iPhone 8 y X) 1 o 2 imágenes aleatorias dan como resultado imágenes en negro. ¿Cuál podría ser el problema? Esta es la función que estoy usando:

 photoHeightMax = 1100; photoWidthMax = 1100; resizeBase64Img(src) { return new Promise((resolve, reject) => { const img = new Image(); img.src = src; img.onload = () => { const imgWidth = img.width; const imgHeight = img.height; const scale = Math.min(this.photoWidthMax / imgWidth, this.photoHeightMax / imgHeight); const widthScaled = scale > 1 ? imgWidth : imgWidth * scale; const heightScaled = scale > 1 ? imgHeight : imgHeight * scale; const elem = document.createElement('canvas'); elem.width = widthScaled; elem.height = heightScaled; const ctx = elem.getContext('2d'); ctx.drawImage(img, 0, 0, widthScaled, heightScaled); const data = ctx.canvas.toDataURL('image/jpeg', 0.85); resolve(data); }; img.onerror = (error) => reject(error); }); }

¡Cualquier ayuda sería apreciada!