1
async function imgResize(data){
// Convert base64 to buffer => <Buffer ff d8 ff db 00 43 00 ...
const buffer = Buffer.from(data, "base64");
Jimp.read(buffer, (err, res) => {
    if (err) throw new Error(err);
    console.log("Original image size: "+res.getWidth()+"x"+res.getHeight())
    if (res.getWidth() > 1025){
        res.resize(1025, Jimp.AUTO)
        console.log("resized image size: "+res.getWidth()+"x"+res.getHeight())
     }
    res.getBase64(Jimp.AUTO, (err, value)=>{
        if(err){return err)}
        return value;
    })
}
const img =  await imgResize(base64data)

I get, SyntaxError: await is only valid in async functions and the top level bodies of modules. But if I remove the async and just print the value without returning it, it works fine. So how I will able to get the value out of that function as return value and hold it in a variable?

Taz
  • 15
  • 3
  • Does this answer your question? [How to return data from promise](https://stackoverflow.com/questions/37533929/how-to-return-data-from-promise) – tevemadar Mar 27 '22 at 12:35

1 Answers1

2

You can't return values inside an asynchronous callback and expect them to be assigned to a variable. Asynchronous callbacks are executed at a later point in time by Node.js at which point the execution context is lost. For example, this won't work:

function getImageWidth(buffer) {
  Jimp.read(buffer, (err, res) => {
    // Outside context is lost and returning here doesn't
    // affect the return value of `getImageWidth` parent function
    return res.getWidth(); // won't work 
  }
}

const width = getImageWidth(buffer);
console.log(width); // undefined

To accomplish what you want, you have two options:

  1. Use a promisified version of Jimp and keep using async/await
  2. Convert imgResize from async/await to use a callback

Turns out Jimp returns a promise if you don't pass a callback function so going for solution #1 is most straightforward. Refactoring from callbacks to async/await would give us the following:

async function imgResize(data) {
  const buffer = Buffer.from(data, "base64");
  const res = await Jimp.read(buffer);
  console.log(`Original image size: ${res.getWidth()} x ${res.getHeight()}`);

  if (res.getWidth() > 1025){
    res.resize(1025, Jimp.AUTO);
    console.log(`Resized image size: ${res.getWidth()} x ${res.getHeight()}`);
  }
  
  return res.getBase64Async(Jimp.AUTO);
}

const img = await imgResize(base64data);

Note: For this to work you need to have top-level await enabled by using ES Modules (ESM). Otherwise you should wrap the last line in an IIFE:

(async () => {
  const img = await imgResize(base64data);
)();
Maxim Orlov
  • 1,942
  • 15
  • 18
  • Hi @MaximOrlov , thanks a lot for the guidance. I have tried your suggested approach, but the getBase64() function expects a cb! I am getting an error on this line: 'return res.getBase64(Jimp.AUTO);' **Error: cb must be a function** – Taz Mar 11 '22 at 09:14
  • @Taz It's a good skill to learn how to browse documentations ;). The promise alternative for this function is getBase64Async https://github.com/oliver-moran/jimp/tree/53ff9d1266207f7f674233f465ec358274510511/packages/jimp#data-uri – Maxim Orlov Mar 11 '22 at 16:12
  • thanks a lot, it works. I actually explored the documentation when started using Jimp, but didn't try this function. My bad. – Taz Mar 11 '22 at 19:04