묻고 답해요
141만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨[리뉴얼] Node.js 교과서 - 기본부터 프로젝트 실습까지
multer 한글 파일 업로드시 파일명이 깨져요.
multer 로 한글 이미지를 올렸습니다.한글 이미지 명은 각각 '꽃1.jpg', '꽃2.jpg' 입니다.아래 req.files 로그에서보시면 한글명이 깨져서 나오는 데요. 한글명이 깨지지 않도록 할 수 있는 방법이 없을까요?req.files [Object: null prototype] {image1: [{fieldname: 'image1',originalname: 'ê½\x831.jpg',encoding: '7bit',mimetype: 'image/jpeg',destination: 'uploads/',filename: 'ê½\x8311670868094390.jpg',path: 'uploads\\ê½\x8311670868094390.jpg',size: 77675}],image2: [{fieldname: 'image2',originalname: 'ê½\x832.jpg',encoding: '7bit',mimetype: 'image/jpeg',destination: 'uploads/',filename: 'ê½\x8321670868094392.jpg',path: 'uploads\\ê½\x8321670868094392.jpg',size: 73716}]}
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 쇼핑몰 사이트 만들기[전체 리뉴얼]
img태그의 src=로컬호스트/이미지 이 부분 질문있습니다!
프론트에서 이미지를 전달받아서 서버측에서 저장을 할때 uploads폴더에 이미지가 저장되게 했는데 1. img태그에 src속성을 보면 왜 uploads폴더에서 가져오지않고 로컬호스트에서 가져오는지 이해가 가지않습니다. 이미지를 uploads폴더에 저장을 해놨는데 다시 서버에 접근하는 느낌을 잘 모르겠습니다. 그냥 uploads폴더에 있는거 가져다가 쓰면 왜 안되는걸까요? 2. uploads폴더에 이미지를 저장한후에 다시 화면으로 가져오는과정이, uploads폴더에 있는거 서버에 올림 -> 서버에 이미지가 올라와있음 -> 서버측에서 프론트로 올림 이런느낌인걸까요? 그러면 다시 이해가 안가는게 localhost/uploads/이미지 왜 이렇지 않은걸까요..? 만약에 여러폴더에 같은이름으로 이미지가 저장되있다면 폴더명을 명시해줘야하는게 아닌가요ㅠㅠ
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 쇼핑몰 사이트 만들기[전체 리뉴얼]
multer관련 질문입니다.
안녕하세요. 강의 진행 중 질문있어 남깁니다.! 1. //파일 보내기 const dropHandler = (files) => { let formData = new FormData(); const config = { header: { "content-type": "multipart/form-data" }, //헤더에다가 어떤 타입인지 전달해주는 것. }; formData.append("file", files[0]); Axios.post("/api/product/image", formData, config).then((response) => { if (response.data.success) { console.log(response.data); setImages([...Images, response.data.filePath]); //원래 있던것을 넣고(spread문법) -> 이후 새로운 것을 추가. } else { alert("파일을 저장하는데 실패했습니다."); } }); }; 위 코드에서 fromData객체는 ajax통신에서 사용하는 keyvalue값을 갖는 formData인것인가요? 그렇다면append()코드로 인해서, file이 key, files[0]이 value인것인가요? 2. multer과 관련하여 공식문서를 읽어보니 아래 주석과 같이 .single을 설명하였습니다. .single(fieldname) fieldname 인자에 명시된 이름의 단수 파일을 전달 받습니다. 이 파일은 req.file 에 저장될 것 입니다 */ const upload = multer({ storage: storage }).single("file"); 저 단수 파일 이름을 전달 받는다는 의미를 잘 모르겠습니다. 어째서("file")이라고 주신거죠?? multer와 single함수의 이용을 잘 모르겠습니다 ㅠ 3. 2번 직후에 실행되는 코드입니다. 아래 코드가 이해가 가질않습니다 ㅠ router.post("/image", (req, res) => { //가져온 이미지를 저장해준다. upload(req, res, (err) => { if (err) { return req.json({ success: false, err }); //이부분은 req.json이 맞나요 ? } return res.json({ success: true, filePath: res.req.file.path, fileName: res.req.file.filename, }); }); }); post입력을 받는다 -> 콜백을 실행 -> upload()실행 ? ->upload는 어떤 행위를 하는 코드인가요? 제가 이해한 흐름은 2번의 multer()함수는 파일이 어디로 업로드 될 지 알려주는 코드이고, storage를 통해 파일에 대한 정보를 갖는다. -> 따라서 post작업을 보낸 후, 콜백으로 실행된 upload함수로 인해 앞서 말한 파일 정보를 res으로 받는다.(이때 .single()로 인해 req.body안에 정보가 담겨온다.) -> 따라서 res.req.file.****을 사용 하는데, 이 ****은 아래 api에 나타나있는 파일 정보에 해당하는 부분이다. 이 흐름이 맞을까요?? 4. 왜인지 모르겠지만 저는 이미지 업로드를 콘솔창에 찍어볼 경우 아래처럼 path가 나옵니다. 상관없을까요??
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
uploads 파일에 이미지가 들어가지 않습니다
아무리봐도 모르겠습니다... 파일이 안생깁니다. 구글링을 아무리 해봐도 이해가 되질 않는데 힌트라도 주시면 감사하겠습니다..
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 쇼핑몰 사이트 만들기[전체 리뉴얼]
게시글 작성을 안해도 이미지가 서버에 저장되는건가요?
사진 업로드만 해도 서버에 저장하는거면 사용자가 파일 업로드를 하고 막상 게시글 작성을 취소하거나 오류로 인해 작성 실패하더라도 이미지 데이터는 다 서버에 저장되는건가요??
-
해결됨[리뉴얼] Node.js 교과서 - 기본부터 프로젝트 실습까지
multer를 이용한 이미지 업로드 req.body.url 오류..
multer 수업을 수강한뒤 이미지 업로드를 위해 수업 실습처럼 이미지를 먼저 서버에 전송하여 압축한 뒤 이후에 저는 게시물이 아닌 동아리 정보 등록 폼으로 작성을 하려고 합니다. 실습과 같이 /img 라우터로 res.json을 이용해 url까지 전송하였습니다. 그 후 폼 제출 버튼을 클릭해서 콘솔로 req.body.url을 확인해보면 undefined 라고 나옵니다.. 저는 왜 req.body.url에 정보가 없는건가요??
-
미해결[리뉴얼] Node.js 교과서 - 기본부터 프로젝트 실습까지
파일 업로드시 서버 재시작
강의와 관련있는 질문을 남겨주세요.• 강의와 관련이 없는 질문은 지식공유자가 답변하지 않을 수 있습니다. (사적 상담, 컨설팅, 과제 풀이 등)• 질문을 남기기 전, 비슷한 내용을 질문한 수강생이 있는지 먼저 검색을 해주세요. (중복 질문을 자제해주세요.)• 서비스 운영 관련 질문은 인프런 우측 하단 ‘문의하기’를 이용해주세요. (영상 재생 문제, 사이트 버그, 강의 환불 등) 질문 전달에도 요령이 필요합니다.• 지식공유자가 질문을 좀 더 쉽게 확인할 수 있게 도와주세요.• 강의실 페이지(/lecture) 에서 '질문하기'를 이용해주시면 질문과 연관된 수업 영상 제목이 함께 등록됩니다.• 강의 대시보드에서 질문을 남길 경우, 관련 섹션 및 수업 제목을 기재해주세요. • 수업 특정 구간에 대한 질문은 꼭 영상 타임코드를 남겨주세요! 구체적인 질문일수록 명확한 답을 받을 수 있어요.• 질문 제목은 핵심 키워드를 포함해 간결하게 적어주세요.• 질문 내용은 자세하게 적어주시되, 지식공유자가 답변할 수 있도록 구체적으로 남겨주세요.• 정확한 질문 내용과 함께 코드를 적어주시거나, 캡쳐 이미지를 첨부하면 더욱 좋습니다. 기본적인 예의를 지켜주세요.• 정중한 의견 및 문의 제시, 감사 인사 등의 커뮤니케이션은 더 나은 강의를 위한 기틀이 됩니다. • 질문이 있을 때에는 강의를 만든 지식공유자에 대한 기본적인 예의를 꼭 지켜주세요. • 반말, 욕설, 과격한 표현 등 지식공유자를 불쾌하게 할 수 있는 내용은 스팸 처리 등 제재를 가할 수 있습니다. 안녕하세요 강의코드를 응용해서 폴더를 받아 폴더안 파일들을 하나씩 axios 로 보내주고 있습니다 다른 파일들은 정상적으로 보내지는데 , config.json, tsconfig.json 파일을 전송할때 서버가 재시작되어 네트워크 오류가 발생됩니다. 업로드는 multer 를 이용하는데, 서버가 재시작되었다는건 스트림으로 config.json 파일을 읽어서 그런것인가요? 이경우 업로드를 하려면 어떻게 해야하나요? (업로드방지 기능을 만들어서 업로드못하게 막는게 맞을까요?) (tsnode 이용해서 node.js + typescript 로 구축했습니다)