인프런 영문 브랜드 로고
인프런 영문 브랜드 로고

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

대원님의 프로필 이미지
대원

작성한 질문수

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

express.static 미들웨어

formData 대신 객체로 보낼때

작성

·

416

0

백엔드에 게시글 등록시 const upload = multer({...})

router 에서 upload.none() 를 사용하였습니다.

작성된 코드에서는 이미지 업로드 버튼을 누르고 이미지 선택 확인 누르는 순간 로컬에 저장되고 반환되어

프론트에서 imagePaths 에 담겨있습니다. 그 후 강의에선 imagePaths를 FormData에 담아서 보내고있는데

imagePaths는 텍스트만 들어있어서 객체로 보내보려고합니다.

배열을 그대로 담으면 될 것 같아

dispatch({
    type: ADD_POST_REQUEST,
    data: { imagePaths, content: text },
});

이렇게 작성하여 보냈는데 Network에서도 성공이고 프론트에서도 오류나는것 없이 다 SUCCESS입니다. 게시글에는 사진이 나타나지 않습니다. 경로가 잘못된 것 같지는 않고 .. 어떤 문제가 있는걸까요?

 

[등록 전]

스크린샷 2023-03-07 오후 12.15.32.png

[등록 후]

스크린샷 2023-03-07 오후 12.15.40.png

답변 1

0

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

콘솔에 있는 data를 한 번 열어보세요. 거기서 뭔가 비어있을 수 있습니다.

대원님의 프로필 이미지
대원
질문자

말씀해주신대로 data 를 열어보니

ADD_POST_REQUEST 요청에는
imagePaths 가 제대로 들어가있습니다 .

게시글 등록이 완ㄹ ㅛ된 후

ADD_POST_SUCCESS 반환값에는

data에 Images 가 빈 값입니다.

아 ... 이제 생각해보니

if(req.body.image)를 타지 않겠군요 ...

객체로 넣을 때는 제가 작성한 코드기준으로는

req.body.imagePaths, req.body.content 가 되는군요 ㅠㅠ 확인해봤더니 이게 맞네요 하핳 ..

그런데 이렇게 하니까 서버쪽에서 콘솔찍어보니 한글 자,모음이 붙어서나오질 않는데 문제될 건 없을까용?

그전에는 한글이아닌 이상한 문자로 완전 깨져서 출력되어

multer@1.4.4 로 낮추었었습니다. 포스트폼으로는 정상출력됩니당 객체로 넣었을때만 이상하게 출력됩니다.

uploads 폴더에는 깨지지않고 파일 저장됨!

 

스크린샷 2023-03-07 오후 3.21.43.png

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

저거 한글은 고질적인 문제네요. 디비에도 경로가 한글깨짐 없이 잘 들어가면괜찮습니다.

대원님의 프로필 이미지
대원

작성한 질문수

질문하기