Как вы связываете HTML5 fetch()?

Question

Я делаю серию загрузок файлов с использованием API HTML5, и я хочу последовательно запускать коллекцию обещаний и делать только окончательный PUT, когда все файлы загружаются.

В настоящее время, это то, что у меня есть:

obj.attachments.forEach((file) => {                
    const request = fetch(`${window.location.origin}/api/cases/${obj.id}/attachment`, {    
    ...baseSettings,                    
    body: file,                      
    headers: {},                     
    }).then((req) => req.json())                  
    .then((json) => { console.log('upload ', json); });            
});                         


const request = fetch(`${window.location.origin}/api/cases`, putJSON(_.omit(obj, 'attachments'))); 
request.then((req) => req.json())                 
     .then((json) => dispatch(receiveCase(json)));            

В идеале, obj.attachments будет преобразован в коллекцию Обещания и окончательные выборки могут быть добавлена ​​и все они будут работать в последовательности.

Answer 1

благодаря Ионам, вот мое решение:

return Promise.all(kase.attachments.map((file) => {             
    return fetch(`${window.location.origin}/api/cases/${kase.id}/attachment`, {       
    ...baseSettings,                     
    body: file,                      
    headers: {},                      
    }).then((req) => req.json()).then((json) => {              
    console.log(json, file);                   
    });                         
})).then(files => {                     
    const request = fetch(`${window.location.origin}/api/cases`, putJSON(_.omit(kase, 'attachments'))); 
    return request                      
    .then((req) => req.json())                   
    .then((json) => dispatch(receiveCase(json)));              
});