ddol82
commented
1 year ago 원인은 비동기 작업을 따로 처리하지 않고 바로 navigate 되는 로직에 있었습니다. 결과적으로는 위에서 제시한 두 문제를 모두 해결하였습니다.
기존의 코드는 아래와 같습니다.
const onBoardCreateClick = (): Promise<void> => {
console.log('게시글 생성 시도');
...
formData.append(...);
...
dispatch<any>(callBoardRegistAPI({
form: formData
}));
navigate('/community/lists/all/1', {replace: true});
window.location.reload();dispatch 지시 후 navigate를 바로 타게 되어있는데, MB과정의 데이터를 비동기로 처리하던 과정을 처리하지 않아 곧바로 navigate 함수를 타고 연결이 강제로 끊겼습니다.
async 및 await 함수를 추가하여 문제를 해결하였습니다.
const onBoardCreateClick = async (): Promise<void> => {
console.log('게시글 생성 시도');
...
formData.append(...);
...
await dispatch<any>(callBoardRegistAPI({
form: formData
}));
navigate('/community/lists/all/1', {replace: true});
window.location.reload();추가적으로, 현재 파일 첨부를 64MB까지 첨부할 수 있도록 설정하였는데, MB단위의 파일을 업로드하고 가공된 파일을 1개 또는 2개를 제작하는 동안 발생하는 대기 시간에 대응하기 위해 로딩 페이지를 만들었습니다.
Describe the bug
To Reproduce
Expected behavior 파일 첨부 후 커뮤니티 메인 화면으로 이동해야 합니다.
Operating Environment