이미지 경로 설정 질문입니다!

Question

안녕하세요! 현재 강의 듣고 따라해보고 있습니다. (좋은 강의 감사드려요!!) 다름이 아니고, multer 를 이용하여 이미지 업로드까지는 성공하였는데 이미지를 html에서 불러오려고 하니 계속 엑박만 떠서요 ㅠㅠ 제 폴더구조는 아래와 같습니다. my project - client - server - uploads (이 곳에 파일들이 저장되어있음) my project > server > index.js 파일에 app.use('/uploads', express.static('uploads')); 이 코드는 추가를 해놓았고요. my project > client > src > components > views > LandingPage.js 파일에서 <img src={`localhost:3000/${item}`} alt="thumbnail"/> 이미지 파일을 위와 같이 불러오려니 정상적으로 나오지가 않아요. 어떤 부분이 문제일까요 ? ㅠㅠ

Jungyi Lee · Answer

말씀해주신것처럼 하면 파일 경로가 'http://localhost:3000/localhost:8080/uploads' 이렇게 됩니다 ㅠㅠ

John Ahn · Answer

서버 주소가 8000번이면 <img src={`localhost:8000/${item}}  /> 이렇게 해주셔야 합니다 ~

Jungyi Lee · Answer

변수 값이 이미  /uploads/itemName 로 나오는데 이미지는 못불러와요 ㅠㅠ 주소창에 localhost:3000 /uploads/itemName 이렇게 그냥 입력해도 이미지는 아예 안나오고요~ 어떤게 잘못됐을까요 ? ㅠㅠ  + 서버 주소는 8000번인데 주소창에   localhost:8000 /uploads/itemName 이 경로에서는 이미지가 정상적으로 나오고, 클라이언트에서는 여전히 안나오네요 .. 뭐가 잘못됐을까요~~?ㅠㅠ

John Ahn · Answer

혹시  item  저 변수 값이 어떻게 나오나요 ?  만약 저 변수 값이 이미 /uploads/itemName 이렇게 나온다면 localhost:5000/${item}  이렇게 해주시고 아니라면 localhost:5000/uploads/${item} 이렇게 해주세요  그리고   5000번은 노드 서버가 5000번 일때  5000번을 해주시면 됩니다.