인프런 커뮤니티 질문&답변
작성한 질문수
image upload에 관해서
작성
·
243
0
강의 열심히 듣고 잇습니다.
파일을 업로드 할때 몇가지 문의 드립니다.
product.js에서 upload할때 res.req.file.path 와 같은 구문이 있는데
1. response안의 request가 있다는 의미인가요?
2. 그렇다면 이렇게 res안에 req를 어디에서 넣어 주는가요?
3. 그리고 req에 파일패스, 파일이름이 있는데 이거는 또 어디에서 넣어주는건지요
FileUpload에서 image를 서버에 보내서 저장을 하고 성공했을때 처리하는 로직에 관한 질문 드립니다.
4. 첫번째 이미지 파일을 backend에 저장하고 Images를 콘솔에 출력해 보면 setImages로 파일경로를 추가 했는데 아무것도 안찍힙니다. 그런데 두번째 이미지를 저장하고 출력해보면 첫번째 이미지의 파일경로가 Images에 들어 있는걸로 콘솔에 출력이 됩니다. 첫번째 이미지의 정보가 두번째 이미지의 정보를 backend에 저장 후에 state에 저장 되는게 잘 이해가 안되네요
5. image를 화면에 보여줄때 src에 파일경로를 넣었는데
서버에서 public으로 오픈 하지않은 폴더의 파일에 직접 접근할수 있는가요?
답변 부탁 드리겠습니다.
답변 2
2
안녕하세요 !!!
| upload(req, res, err => { | |
| if (err) { | |
| return res.json({ success: false, err }) | |
| } | |
| return res.json({ success: true, image: res.req.file.path, fileName: res.req.file.filename }) | |
| }) |
여기 부분 소스 코드 네요 !!
1. response안의 request가 있다는 의미인가요?
===> 넵 res 객체 안에 req 객체가 있는 것입니다.
2. 그렇다면 이렇게 res안에 req를 어디에서 넣어 주는가요?
===> 현재 multer 모듈을 사용해서 구현하는 것입니다.
multer 모듈안에서 자동으로 처리해주는 부분입니다. node_modules 폴더에 multer 소스 코드를 보면
파일을 저장한 이후에 저런식으로 데이터를 넣어주는 부분이 있을겁니다.
3. 그리고 req에 파일패스, 파일이름이 있는데 이거는 또 어디에서 넣어주는건지요
===> 이 부분도 2번과 동일하게 multer 모듈에서 처리해주는 것입니다.
모듈을 만든 사람이 소스 코드를 작성할 때 저기에 넣는다고 지정해준것입니다.
4. 첫번째 이미지 파일을 backend에 저장하고 Images를 콘솔에 출력해 보면 setImages로 파일경로를 추가 했는데 아무것도 안찍힙니다. 그런데 두번째 이미지를 저장하고 출력해보면 첫번째 이미지의 파일경로가 Images에 들어 있는걸로 콘솔에 출력이 됩니다. 첫번째 이미지의 정보가 두번째 이미지의 정보를 backend에 저장 후에 state에 저장 되는게 잘 이해가 안되네요
===> 아마 소스 코드 상에서 그렇게 되는 답이 있을것 같습니다 ! 이 부분은 소스 코드를 봐야할것같습니다!
5. image를 화면에 보여줄때 src에 파일경로를 넣었는데
서버에서 public으로 오픈 하지않은 폴더의 파일에 직접 접근할수 있는가요?
===> 이 부분은 서버에서 접근이 아닌 브라우저에서의 접근입니다 ~ !
열심히 하시는 모습이 너무 보기 좋습니다!
앞으로도 화이팅하세요 ^^ !!
0
4번 문제 동일하게 발생해서 Spread syntax(전개 구문)을 useState 배열에서 사용예시가 잘못되었는지 찾아봤습니다. 결론은 코드에 문제가 없어서 해결이 안되었고 저는 우선 Images.push(res.data.filePath)로 처리하고 넘겼습니다.