Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is it possible to break away from await Promise.all when any promise has fulfilled (Chrome 80)

I need to send a request to multi-servers to see which server will response to my request and if any of them response, I will then further interact with this server. The simplest way is to send my request in sequence, something like this

async function probing(servers) {
    for (const server of servers) {
        const result = await fetch(server)
        if (result.status == 200) {
            return result
        }
    }
}

But I hope to speed up the probing process so I change my code to

async function probing(servers) {
    results = await Promise.all(
        servers.map(async server => {
            return await fetch(server)
        })
    )
    for (const result of results) {
        if (result.status == 200) return result
    }
}

But I still need to await all of promises to finish. What I really need is just if one of them has resolve I then return from my probing()

Is that possbile ?

---- update ----

Thank for the comments promise.any is the solution (and one-liner arrow function can be further simplified as following)

result = await Promise.any(
    servers.map(server => fetch(server))
)

---- update 2 ----

I had thought Promise.any is the way to go and the end of the story. But unfortunately it is not! Promise.any is only available from Chrome 85+ & FF 79+, unlike Promise.all is available for any modern browser except for IE, check here https://v8.dev/features/promise-combinators

And my client needs me to support Chrome version from 2020, i.e. Chrome 80+, I tried to polyfill Promise.any with Babel but I failed.

We use babel6 and I failed to polyfill Promise.any with babel6. I tried to upgraded to babel7 (with npx babel-upgrade --write and some twists) and now the bundled code using Promise.any() can't even work for chrome 88. I asked another question for that How do I polyfill Promise.any() using babel 7?

So now I just have to revert to Promise.all.

---- update 3 ----

I finally made polyfill Promise.any() with Babel 7 work, the key is to using core-js@3 with correct babelrc setting (I am not sure I got them all correct), please refer to my question and answer there.

like image 419
Qiulang 邱朗 Avatar asked Feb 04 '21 10:02

Qiulang 邱朗


People also ask

Can we use await with promise all?

all() along with making that function as async and promise resulting fetching will be done along with the await keyword.

How do you handle promise rejection with await?

If the Promise is rejected, the await expression throws the rejected value. If the value of the expression following the await operator is not a Promise , it's converted to a resolved Promise. An await splits execution flow, allowing the caller of the async function to resume execution.

Can we use async await without promise?

This rule applies when the await operator is used on a non-Promise value. await operator pauses the execution of the current async function until the operand Promise is resolved.

Can async await be halted anyways True or false?

3)async-await allows us to write asynchronous code like a synchronous one, using await , you can pause the function, wait for the IO, and continue the execution. 5)Await can be only used in functions marked as async . Marking function as async makes it also return a promise.


1 Answers

In this case Promise.race() looks reasonable but the problem with Promise.race() is any rejecting promise in the race will collapse the whole race. If what we want is to ignore the individual rejections and carry on with the race then we still have an option in which case only if all promises gets rejected we have to perform an action to handle the error.

So if we invent the Promise.invert() and use it with Promise.all() then we get what we want.

var invert = pr => pr.then(v => Promise.reject(v), x => Promise.resolve(x));

Lets see how we can use it;

var invert     = pr  => pr.then(v => Promise.reject(v), x => Promise.resolve(x)),
    random     = r   => ~~(Math.random()*r),
    rndPromise = msg => random(10) < 3 ? Promise.reject("Problem..!!!")
                                       : new Promise((v,x) => setTimeout(v,random(1000),msg)),
    promises   = Array.from({length: 4}, (_,i) => rndPromise(`Promise # ${i}.. The winner.`));

Promise.all(promises.map(pr => invert(pr)))
       .then(e => console.log(`Error ${e} happened..!!`))
       .catch(v => console.log(`First successfully resolving promise is: ${v}`));

So since the promises are inverted now catch is the place that we handle the result while then is the place for eror handling.

I think you can safely use this in production code provided you well comment this code block for anybody reading in future.

like image 155
Redu Avatar answered Oct 28 '22 13:10

Redu