← flaviocopes.com

How to convert a callback into async/await

Published Jun 21 2021

I had some code that used a callback. Without too many implementation details, here’s the gist of it:

const uploadFile = (callback) => {
  //upload the file, then call the callback with the location of the file
  callback(location)
}

uploadFile((location) => {
  // go on
})

See? I call uploadFile and when it finishes doing what it needs to do, it calls the callback function.

But was using async/await across all my file, so I decided to use async/await here too, instead of using the callback.

Here’s how I did it: I wrapped all the body of the uploadFile function in a return new Promise() call, and when I got the data I wanted to return, I called resolve():

const uploadFile = () => {
  return new Promise((resolve, reject) => {
    //upload the file, then call the callback with the location of the file
    resolve(location)
  })
}

const location = await uploadFile()

Now I could use the location data in the first-level, instead of being it wrapped in the callback function.

It helps me keep the code cleaner and reason better about it.

If you are interested, here’s the full code of the actual function, so you can see this concept in a larger example:

const uploadFile = (fileName, id, callback) => {
  const fileContent = fs.readFileSync(fileName)

  const params = {
    Bucket: process.env.AWS_BUCKET_NAME,
    Key: `file.jpg`,
    Body: fileContent
  }

  s3.upload(params, (err, data) => {
    if (err) {
      throw err
    }
    callback(data.Location)
  })
}

uploadFile(files.logo.path, job.id, async (location) => {
  await prisma.job.update({
    where: { id: job.id },
    data: {
      logo: location
    }
  })
})

Here’s what I transformed it into:

const uploadFile = (fileName, id) => {
  return new Promise((resolve, reject) => {
    const fileContent = fs.readFileSync(fileName)

    const params = {
      Bucket: process.env.AWS_BUCKET_NAME,
      Key: `job-${id}.jpg`,
      Body: fileContent
    }

    s3.upload(params, (err, data) => {
      if (err) {
        reject(err)
      }
      resolve(data.Location)
    })
  })
}

handler.post(async (req, res) => {
  const files = req.files
  const body = req.body

  const job = await prisma.job.create({
    data: {
      ...body,
      created_at: new Date().toISOString()
    }
  })

  const location = await uploadFile(files.logo.path, job.id)

  await prisma.job.update({
    where: { id: job.id },
    data: {
      logo: location
    }
  })

  res.redirect(`/jobs/${job.id}/payment`)
})


Wanna go from noobie to expert?

I wrote an entire book on this topic 👇

I also got a super cool course 👇

© 2023 Flavio Copes Flavio Copes using Notion to Site Notion to Site. Follow on Twitter

Solopreneur? Wannabe? Adventure awaits