javascript Promise.all(array.map()) 에 timeout 설정하기.

Question

const sendTimesheetHandler &#61; async () &#61;> { setIsLoading(true); if ( !date.startDate || !date.endDate || dateDiffInDays(new Date(date.startDate), new Date(date.endDate)) > 16 ) { toast.error('Please select a date range of 16 days or less'); } else { const res &#61; await Promise.all( selectedItems.map(async (item) &#61;> { const rawData &#61; await axios.get( &#96;/api/dashboard/history-timesheet?eid&#61;${item.EmployeeID}&startDate&#61;${date.startDate}&endDate&#61;${date.endDate}&#96;, ); return await axios .post(&#96;/api/dashboard/email-sender-timesheet&#96;, { UserName: item.UserName, FullName: item.FullName, PayType: item.PayType, RawData: rawData.data, StartDate: date.startDate, EndDate: date.endDate, }) .then((res2) &#61;> { console.log(res2); return { status: res2.status, FullName: res2.data.FullName, }; }); }), ); if (res.every((item) &#61;> item.status &#61;&#61;&#61; 200)) { toast.success('Timesheet sent successfully'); } else { toast.error('Something went wrong'); } console.log('final res', res); } setIsLoading(false); };selectedItems 라는 array를 map으로 돌면서 data를 가져오고 가져온 data로 email을 보내는건데, email을 보낼때 너무 짧은시간에 여러 이메일을 보내서 에러가 뜹니다. 그래서 timeout으로 delay를 주려고 하는데, 여러 방법을 했지만 잘 안되네요. 어떻게 고쳐야 될까요? 감사합니다.

1층 · Answer

selectedItems.map 부분부터 비동기/넌블러킹으로 처리되면 이미 map 처리 내부에서 sleep같은걸 주더라도 한번에 다 처리될수밖에 없지않을까요?자바스크립트는 잘 안써봐서 구체적인 해결법 제안은 힘들지만, 동기/블러킹 방식으로 selectedItems를 불러오는 방법을 적용하시는게 좋을듯합니다! 내부에서 axios 호출은 await가 걸려서 그 작업이 끝날때까지 다음 item에 대한 로직이 실행되진 않을듯한데...

Hee Sung Son · Answer

퍼포먼스 관점에서는 이메일을 보내는 로직을 데이터를 한번에 받아서 처리해주는거로 바꾸거나 실행속도는 무지느려지겠지만 promise.all 로직을 프로미스로 연결해주면 해결될겁니다 가령const 프로미스순차실행 &#61; (함수실행할목록들, 실행함수) &#61;> 함수실행할목록들.reduce( async (이전Promise, 현재목록, 인덱스) &#61;> 이전Promise.then(async (이전결과들) &#61;> { const 함수결과 &#61; await 실행함수(현재목록, 인덱스); return [...이전결과들, 함수결과]; }), Promise.resolve([]) );으로 만든함수에 대입해서 Promise.all 대신에 사용해서const res &#61; await 프로미스순차실행(selectedItems, async (item) &#61;> { const rawData &#61; await axios.get( &#96;/api/dashboard/history-timesheet?eid&#61;${item.EmployeeID}&startDate&#61;${date.startDate}&endDate&#61;${date.endDate}&#96; ); return await axios .post(&#96;/api/dashboard/email-sender-timesheet&#96;, { UserName: item.UserName, FullName: item.FullName, PayType: item.PayType, RawData: rawData.data, StartDate: date.startDate, EndDate: date.endDate, }) .then((res2) &#61;> { console.log(res2); return { status: res2.status, FullName: res2.data.FullName, }; }); });로 대신해서 사용 가능합니다

아르마무 · Answer

timeout 시간을 다르게 하는 방법도 있을 것 같고 전체 데이터를 promise.all로 get하고 그 이후에 timeout 걸어서 하나씩 전송하는 방법이 생각 나네요.

javascript Promise.all(array.map()) 에 timeout 설정하기.

3개의 답변

#async 목록