Несколько fetch () в Promise.all - какой из них не удалось? - PullRequest
Новая
       38

Несколько fetch () в Promise.all - какой из них не удалось?

0 голосов
/ 11 ноября 2018

Если у меня несколько вызовов fetch() в блоке Promise.all, то при сбое одного происходит сбой. Это круто, мне нужно, чтобы они все решили.

Однако, как я могу найти, какой из них действительно потерпел неудачу?

В следующем коде catch error говорит мне:

TypeError: Не удалось получить`

, что делает невозможным создание эффективного сообщения об ошибке пользователя, если я решу это сделать. 

const goodUrl = 'https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js';
const badUrl = 'https://ajax.googleapis77.com/ajax/libs/jquery/2.1.3/jquery.min.js';
Promise.all([
    fetch(goodUrl),
    fetch(badUrl), /* will fail */
    fetch(goodUrl)
]).then(([response1, response2, response3]) => {
    console.log(response1);
    console.log(response2);
    console.log(response3);
}).catch((err) => {
    console.log(err);
});

Вот скрипка (фрагмент не понравился)

Я искал дубликаты, это не один, так как примеры выдают ту же ошибку

Ответы [ 2 ]

0 голосов
/ 11 ноября 2018

Я бы посоветовал вам создать свою собственную маленькую обертку вокруг fetch(), которая выбрасывает пользовательскую ошибку, содержащую нужную информацию: 

function myFetch(url) {
    return fetch(url).catch(function(err) {
       let myError = new Error("Fetch operation failed on " + url);
       myError.url = url;
       throw myError;
    });
}

const goodUrl = 'https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js';
const badUrl = 'https://ajax.googleapis77.com/ajax/libs/jquery/2.1.3/jquery.min.js';
Promise.all([
    myFetch(goodUrl),
    myFetch(badUrl), /* will fail */
    myFetch(goodUrl)
]).then(([response1, response2, response3]) => {
    console.log(response1);
    console.log(response2);
    console.log(response3);
}).catch((err) => {
    console.log(err);
});

Рабочая демоверсия jsFiddle: https://jsfiddle.net/jfriend00/1q34ah0g/

0 голосов
/ 11 ноября 2018

Вы можете просто поймать каждого из них по отдельности и throw некоторые пользовательские ошибки, такие как: 

...
Promise.all([
    fetch(goodUrl).catch(err => {
        throw {url: goodUrl, err};
    }),
    fetch(badUrl).catch(err => {
       throw {url: badUrl, err};
    }),
    fetch(goodUrl).catch(err => {
       throw {url: goodUrl, err};
    })
])
...
...