Las preguntas que leí en stackoverflow no me han ayudado a resolver mi problema.

Este es todo el código del lado del cliente, no nodejs.

Tengo un código que usa Fetch api para devolver un png en response.body. Puedo escribir con éxito este archivo en el disco usando File System Access Api. Sin procesar el png a través de pngjs, la imagen se guarda correctamente.

Aunque pngjs dice que acepta un flujo legible y se supone que response.body es un flujo legible, pngjs arroja un error. Supongo que la secuencia legible en la web es diferente del formato nodejs. Sin embargo, puedo devolver los datos de la búsqueda como un ArrayBuffer y pngjs aceptará esto sin ningún problema.

Mi problema es que el png devuelto por el método de análisis de pngjs está dañado incluso si en realidad no le hago nada a la imagen en el método de análisis.

Aquí hay algo de código.

// Introducir png en ArrayBuffer

 const response = await fetch(url); let arrayBuffer = await response.arrayBuffer()

// Analizar arrayBuffer con pngjs

 processImage(arrayBuffer) async function processImage(arrayBuffer) { let dst = new PNG({}) return new Promise((res, rej) => { // res(arrayBuffer) dst.parse(arrayBuffer, function (error, data) { res(data.pack()) }) }) } } }

//Escribir archivo en disco

 writable.write({type: "write", data: data.data}) await writable.close();

No estoy haciendo nada con los datos durante el método de análisis solo para probar.

Del código anterior, si solo devuelvo el arrayBuffer res(arrayBuffer) , el archivo es correcto. Sin embargo, si lo paso al método de análisis de pngjs, aunque no estoy modificando el archivo, resulta dañado.

Cuando no analizo el archivo, devuelve un ArrayBuffer del tamaño correcto y escribe un archivo con un tamaño de 595 kb con un tamaño de arrayBuffer de 608325

Cuando analizo el archivo aunque no lo estoy modificando. El tamaño del archivo resultante es 1024kb y el tamaño de ArrayBuffer es 1048576.

El ArrayBuffer devuelto por ambos procesos es de tipo uint8Array.

Resultado esperado: dado que no estoy cambiando el archivo en el método de análisis de pngjs, el ArrayBuffer devuelto debe tener el mismo tamaño y el archivo no debe estar dañado.

ACTUALIZACIÓN: probé una biblioteca de codificador/descodificador png diferente con los mismos resultados.

 import UPNG from '@pdf-lib/upng'; const response = await fetch(url); let arrayBuffer = await response.arrayBuffer() let img = UPNG.decode(arrayBuffer); // put ArrayBuffer of the PNG file into UPNG.decode let rgba = UPNG.toRGBA8(img)[0]; // UPNG.toRGBA8 returns array of frames, size: width * height * 4 bytes.