Recibo un error extraño en el que, cuando convierto una cadena base64 en un búfer de imagen ( Buffer.from(image, "base64") ) y vuelvo a base64 ( .toString("base64") ) a la cadena base64 resultante le falta su formato ( dataimage/pngbase64 en lugar de data:image/png;base64 ) y falta g== al final. Esto da como resultado que la imagen esté "corrupta" y no se represente cuando la coloco en un <img /> en la interfaz. La solución actual que estoy usando es la siguiente:
image.toString("base64").replace("dataimage/pngbase64", "data:image/png;base64,") + "g=="
pero esto está lejos de ser una solución óptima y me gustaría no usar este tipo de solución.
Aquí es donde almaceno la imagen (la image es base64) y la almaceno en la base de datos
t.field("createModel", { type: $name, args: { input: nonNull(arg({ type: createModelInput.name })) }, resolve: async (_, args) => { const { image, name, manufacturerId, identifiers } = args.input; console.log(image) // correct base64 image from frontend const buffedImage = Buffer.from(image, "base64"); console.log(buffedImage.toString("base64")) // not the same as image above: missing formatting & g== at the end return await prisma.model.create({ data: { image: buffedImage, name, identifiers, manufacturer: { connect: { id: manufacturerId, }, }, }, }); }, });Por favor, dígame si necesita más información.
La parte Base64 de la cadena no comienza hasta después de , ; la parte data: es un esquema, la parte image/png es un tipo de contenido, y la parte base64, es un indicador de que lo que sigue es texto codificado en Base64. Entonces, está solicitando convertir datos que no sean Base64 cuando intenta usar esa cadena completa como Base64.
Primero debe eliminar ese prefijo, porque no es parte de los datos de Base64. Es solo una parte de los data: URI.