인프런 커뮤니티 질문&답변

hm_stom님의 프로필 이미지
hm_stom

작성한 질문수

[리뉴얼] React로 NodeBird SNS 만들기

이미지 업로드를 위한 multer

formdata

작성

·

419

0


const PostForm = () => {
const { imagePaths, addPostDone } = useSelector((state) => state.post);
const dispatch = useDispatch();
const [text, onChangeText, setText] = useInput('');

useEffect(() => {
if (addPostDone) {
setText('');
}
}, [addPostDone]);

const onSubmit = useCallback(() => {
if (!text || !text.trim()) {
return alert('게시글을 작성하세요.');
}
const formData = new FormData();
imagePaths.forEach((p) => {
formData.append('image', p);
});
formData.append("name", "contentUpload");
console.log(formData);


}, [text, imagePaths]);

const imageInput = useRef();
const onClickImageUpload = useCallback(() => {
imageInput.current.click();
}, [imageInput.current]);

const onChangeImages = useCallback((e) => {
console.log('images', e.target.files);
const imageFormData = new FormData();
[].forEach.call(e.target.files, (f) => {
imageFormData.append('image', f);
});
imageFormData.append("name", "imageUpload");
console.log(imageFormData);
dispatch({
type: UPLOAD_IMAGES_REQUEST,
data: imageFormData,
});
}, []);
form data에서 이런식으로 값을 console에 찍어봤는데 안나오는데
혹시 어디가 잘못된걸까요 ?

답변 1

4

hm_stom님의 프로필 이미지
hm_stom
질문자

해결했습니다!
제가 치명적인 실수를 했네요

저와 같은 실수를 하시는분들을 위하여 올릴게요

formData안에 내용물들이 궁금하여 console로 출력 하는 경우에는 빈객체{}가 나옵니다.

이유는,  FormData는 XMLHttpRequest를 사용해 전송할 key/value와 같이 쌍을 이뤄 컴파일한 "특수한 객체"이기 때문에, 문자열로 표현할 수 없어서 빈 객체가 나옵니다.

반드시 내용물을 찍어볼 때 

"for ...of "를 통하여 내부를 확인하시길 바랍니다!

hm_stom님의 프로필 이미지
hm_stom

작성한 질문수

질문하기