CODEWITHSUNDEEP
node.jsreactjsexpress
jschaeppi
jschaeppi

Reputation: 13

Issue understanding async await Node.js timing

I’m having an issue with my async await timings as my code is accepting files from my react front end, then it creates a folder based on information from react and then after the folder is created, it renames the files into the proper folder that was just created.

In my logs I’m seeing that it looks like sometimes the files are being renamed before the folder is created which from everything I’ve read, the first await needs to complete before the next await in the order starts but this seems to not be happening with my code. My code is shown below along with the logs showing the file renaming attempts before folder is created.

newhireRouter.post('/', formidable(), async (req, res) => {

    const { firstName, middleName, dm_userFirst, dm_userLast, dm_email, firstLast, firstDay, dob, location, hireType, address, email, secondLast, phone, phone2, sex, numDays, wage, positions, hours, language, ssn, number } = req.fields;
    const { file1, file2, file3 } = req.files;
    const receiver = await DepartmentModel.findOne({ department: 'New Hires'});

    try {
        await fs.mkdir(`../../uploads/images/newhires/${firstName} ${firstLast}`, { recursive: true }, (err) => {
            if (err) {
                console.log(err);
            }
            console.log('Folder created successfully!');
        })
        await fs.rename(file1.path, `../../uploads/images/newhires/${firstName} ${firstLast}/${file1.name}`, (err) => {
            if (err) {
                console.log('File couldn\'t be moved!');
            }
        })
        await fs.rename(file2.path, `../../uploads/images/newhires/${firstName} ${firstLast}/${file2.name}`, (err) => {
            if (err) {
                console.log('File couldn\'t be moved!');
            }
        })
        await fs.rename(file3.path, `../../uploads/images/newhires/${firstName} ${firstLast}/${file3.name}`, (err) => {
            if (err) {
                console.log('File couldn\'t be moved!');
            }
        })
    } catch(err) {
        console.log(err);
    }
}

Log:

0|server  | File couldn't be moved!
0|server  | File couldn't be moved!
0|server  | File couldn't be moved!
0|server  | Folder created successfully!
0|server  | POST /api/newhire 200 651.450 ms - 16
0|server  | [Error: ENOENT: no such file or directory, open '../../uploads/images/newhires/Tester Testing/12335_TK.PNG'] {
0|server  |   errno: -2,
0|server  |   code: 'ESTREAM',
0|server  |   syscall: 'open',
0|server  |   path: '../../uploads/images/newhires/Tester Testing/12335_TK.PNG',
0|server  |   command: 'API'
0|server  | }

Upvotes: 1

Views: 107

Answers (2)

paradox
paradox

Reputation: 602

async/await works with the promises. you can only await a promise. so in order for you to await on fs.mkdir it should return a promise which isn't the case with your code. You are using the callback API. There are multiple ways to fix this.

You can use promisify from util to convert any callback function into its promise counterpart.

const util = require('util');
const fs = require('fs');

const mkdir = util.promisify(fs.mkdir);
await mkdir(`../../uploads/images/newhires/${firstName} ${firstLast}`,{ recursive: true })

another way to fix this is to use the promise fs API instead of the callback

const fs = require('fs');
const fsPromises = fs.promises;
await fsPromises.mkdir(`../../uploads/images/newhires/${firstName} ${firstLast}`,{ recursive: true })

Upvotes: 1

Iago Calazans
Iago Calazans

Reputation: 328

You need to use fs with Promise's.

fs Promises API# The fs.promises API provides an alternative set of asynchronous file system methods that return Promise objects rather than using callbacks. The API is accessible via require('fs').promises.

The async/await are a sugar application of JavaScript Promise's, in this case you need to use it to get the expected result.

await fs.promises.mkdir(`../../uploads/images/newhires/${firstName} ${firstLast}`, { recursive: true });
console.log('Folder created successfully!');

On your code, you're using a Callback and expect a Promise (resolved || rejected) with await.

await fs.mkdir(
`../../uploads/images/newhires/${firstName} ${firstLast}`,
{ recursive: true },
 /* (err) => {
        if (err) {
            console.log(err);
        }
        console.log('Folder created successfully!');
    } */
) // The above comment is a Callback code!

Upvotes: 0

Related Questions