• 카테고리

    질문 & 답변
  • 세부 분야

    풀스택

  • 해결 여부

    미해결

key: 'image'와 router.post('/image) 관련 질문있습니다.

21.12.16 12:20 작성 조회수 74

0

key: 'image'와 routes/post.js에서
router.post('./images', upload.array('image'))가
일치해야 그대로 받을 수가 있다고 하셨는데
 
PostForm.js에서 onChangeImages 함수에 매개변수로 e를
받아서 e.target.files를 console 찍어보면 FileList가
나옵니다. 여기서 일치한다는게 뭔지 이해가 안되는데...
 
key: image는 어디에 있고 images는 단수에서 복수가 되는건가요?
 
조금 이해가 안되서 그러는데 간략하게 설명해주실수 있나요?
 
// components/PostForm.js
const onClickImageUpload = useCallback(() => {
imageInput.current.click();
}, [imageInput.current]);

const onChangeImages = useCallback((e) => {
console.log('images', e.target.files); // 배열X, 유사배열
const imageFormData = new FormData(); // 멀티파트 형식으로 서버에 보낼수 있다
[].forEach.call(e.target.files, (f) => {
imageFormData.append('image', f); // key: 'image', value(값): f
});
dispatch({
type: UPLOAD_IMAGES_REQUEST,
data: imageFormData,
});
}, []);
 
// routes/post.js
router.post('/images', isLoggedIn, upload.array('image'), (req, res, next) => {
console.log(req.files); // 업로드가 어떻게 됬는지 정보들이 담겨있음
res.json(req.files.map((v) => v.location)); // location 자체에 주소가 담겨있음, PostFrom에 image src에 그대로 전달(backURL 필요 X)
}); // POST /post/images, // upload.array(), upload.single(), upload.none()

답변 1

답변을 작성해보세요.

1

formData.append(키, 밸류) 입니다.

upload.single(키), upload.array(키)입니다.

여기서 두 개의 키가 일치해야 합니다.

답변 감사합니다