Exploring the depths of async/await within ExpressJS fetch operations

Question

Exploring the depths of async/await within ExpressJS fetch operations

So far, my API-middleware code is functioning properly. I am being cautious to avoid any blocking calls in my express server, which is why I have implemented a function containing asynchronous fetch calls.

I'm wondering if this extra step is necessary at all. Wouldn't the first await statement already unblock my express server?

Below is the code snippet:

var express = require('express')
var router = express.Router()
const asyncMiddleware = require('./utils/asyncMiddleware');

async function fetchDataFromAPI(URL, bodyJson, wpToken) {      
    try {        
        return await fetch(URL, {
            method: "POST",
            credentials: "same-origin",
            headers:  {
                "Authorization": "Bearer " + wpToken,
                "Content-Type": "application/json",
                "Accept": "application/json"
            },
            body: bodyJson
    });
    } catch (error) {       
        return {status:544, error:error};
    }
}

router.post("/registerVendor", asyncMiddleware(async (req, res, next) => {              
    const response = await fetchDataFromAPI(myApiUrl, req.body, 1)
    return res
    .status(response.status)
    .send({ data: response});
}));

module.exports = router

javascript express fetch

Answer 1

Answer №1

If you're wondering whether it's necessary to place your fetch call within a separate async function, the answer is no, it's not a requirement. While it might be beneficial in some cases, it's not mandatory. Simply awaiting the fetch promise directly will suffice and terminate the synchronous part of your async route callback.

I'm questioning whether the function ("fetchCall" as shown in my code snippet) must be declared as async.

No, there's no strict necessity for it to be asynchronous. It doesn't even have to return a promise since you can await any value. To illustrate, consider the following sequence: A, B, C, D, and E are logged consecutively:

async function bar() {
    console.log("B");
    await 42;
    console.log("D");
}

console.log("A");
bar()
.then(() => {
    console.log("E");
})
.catch(error => {
    console.error(error);
});
console.log("C");

In your specific scenario, it may be advantageous to return a promise. The modified function would look like this:

function fetchData(endpoint, data, token) {      
    return fetch(endpoint, {
        method: "POST",
        credentials: "same-origin",
        headers: {
            "Authorization": "Bearer " + token,
            "Content-Type": "application/json",
            "Accept": "application/json"
        },
        body: data
    })
    .catch(error => ({status:544, error:error}));
}

Nonetheless, the benefit of utilizing async and await lies in enabling the creation of asynchronous code that follows familiar branching and looping patterns typically seen in synchronous programming...

Answer 2

If you're wondering whether it's necessary to place your fetch call within a separate async function, the answer is no, it's not a requirement. While it might be beneficial in some cases, it's not mandatory. Simply awaiting the fetch promise directly will suffice and terminate the synchronous part of your async route callback.

I'm questioning whether the function ("fetchCall" as shown in my code snippet) must be declared as async.

No, there's no strict necessity for it to be asynchronous. It doesn't even have to return a promise since you can await any value. To illustrate, consider the following sequence: A, B, C, D, and E are logged consecutively:

async function bar() {
    console.log("B");
    await 42;
    console.log("D");
}

console.log("A");
bar()
.then(() => {
    console.log("E");
})
.catch(error => {
    console.error(error);
});
console.log("C");

In your specific scenario, it may be advantageous to return a promise. The modified function would look like this:

function fetchData(endpoint, data, token) {      
    return fetch(endpoint, {
        method: "POST",
        credentials: "same-origin",
        headers: {
            "Authorization": "Bearer " + token,
            "Content-Type": "application/json",
            "Accept": "application/json"
        },
        body: data
    })
    .catch(error => ({status:544, error:error}));
}

Nonetheless, the benefit of utilizing async and await lies in enabling the creation of asynchronous code that follows familiar branching and looping patterns typically seen in synchronous programming...

Exploring the depths of async/await within ExpressJS fetch operations

Answer №1

Similar questions

Execute the authenticate method on every router within the express framework

What is the best way to assign an identifier to a variable in this scenario?

Stripping quotation marks from CSV information using Javascript

Most effective method for adding JQuery events to dynamically generated buttons

ExpressJS - Efficiently managing multiple pages and pagination

What can you tell me about Page Event functionality in Datatables?

Having trouble with Next-Auth's signIn with Credentials feature in NextJS?

Storing and Retrieving Multiple Data with localStorage

The Three JS on the website is error-free, yet it fails to function properly

Creating a Dropdown Filter using Vanilla JavaScript

Locate all records in Mongoose that do not have a specific value (using the $ne operator)

The backface remains visible despite being designated as "hidden"

The metallic material in Substance Painter appears as a dark shade in A-Frame

The JavaScript for loop using .appendChild() is inserting the values of the final object, represented as [object object], into the HTML document

Issue with using async await in map function: async function may not complete before moving on to the next item in the

I'm looking for guidance on how to properly implement onChange in this particular script. Any help with the correct syntax

Is it possible to update parent data using a child component?

Creating a harmonious relationship between a generator using recursion and promises

What is the best way to implement a Navbar link in React.js?

What could be causing the issue with running npx create-react-app my-first-app?