Can I read an image from Arraybuffer or Blob?

[X7md]

I wanna do something like this:

import {ImageMagick,
 initializeImageMagick}
 from '@imagemagick/magick-wasm'
import * as MagickFormat
 from '@imagemagick/magick-wasm/magick-format.js'
import { MagickReadSettings }
 from '@imagemagick/magick-wasm/settings/magick-read-settings.js'
//const readFile = util.promisify(fs.readFile);
//const writeFile = util.promisify(fs.writeFile);
initializeImageMagick().then(async () => {
const readSettings = new MagickReadSettings(
{
    format: MagickFormat.Jpeg
});
/**@type {HTMLInputElement} */
const input = document.querySelector("input")
input.addEventListener('change', changeFile);
let inputData = null;

function changeFile() {
    const file = input.files[0];
    /**@type {FileReader} */
    const reader = new FileReader();
    /* readFile as  ArrayBuffer*/
    reader.addEventListener('load', readFile);
    reader.readAsArrayBuffer(file);
}
function readFile(event) {
    inputData = event.target.result
    readImage()
}
async function readImage(){
    await ImageMagick.read(inputData, readSettings, async (image) => {
         const {height, width} = image;      
         console.log(height, width)
    });
    
}

})

Fix:

just wrapping inputData = event.target.result by new Uint8Array() like this: new Uint8Array(event.target.result);

[dlemstra]

If inputData is an Uint8Array you can use that instead of a file name.

[X7md]

Thanks 💖.