inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

이미지 관리 풀스택(feat. Node.js, React, MongoDB, AWS)

axios 이용해서 백엔드로 이미지 전송하기

단순히 이미지만 보내는게 아닐때

221

무자본

작성한 질문수 9

0

회원가입을 한다고 가정할때,
 
각종 다른 정보랑 프로필 이미지를 post 한다고 할때는
 
어떠한 방식으로 보내야 하는건가요?

aws react nodejs mongodb express lambda

답변 1

1

김시훈 (도도소프트)

음 강의에서 나오는 방식으로 동일하게 하시면 되요.

 

이미지 키를 백엔드에 전송할 때 회원 가입 정보를 같이 보내면 되요

0

무자본

회원가입 정보를 등록할때 이미지와 다른 정보를 다같이 FormData로 보냈을 경우,

회원의 프로필 이미지 img의 타입이 url인 string으로 저장되는데,

 

회원수정 페이지 관점에서 보면, 서버로부터 온 img는 string이고

수정페이지에서 신규로 이미지를 등록하면 FormData 형식이고...

컴포넌트 내에서 typescript를 따지면서

기존 이미지가 없거나 있을경우, 기존 이미지를 삭제할경우, 신규 이미지를 등록할 경우를 다 따져서 관리한다고 했을때 어떤식으로 관리하면 좋나요?

FormData로 회원수정을 처음 작성하려다보니 좀 헷갈리네요, 고수님의 팁좀 얻을수 있을까요?

0

김시훈 (도도소프트)

아 혹시 지금 강의 초반부이신가요? 후반부에 가면 더 좋은 방법이 나오는데 이걸 보시면 이해가 되실거에요. 이미지 자체는 서버 거치지 않고 먼저 따로 S3에 저장을 하게 되요. 백엔드에는 더이상 formData를 보내지 않고 axios로 post를 날리게 됩니다. post 바디로 들어가는 내용은 회원정보 + S3에 저장된 이미지의 key가 되고요

Router.use 두번째 파라미터 ImageRouter : undefined 전달 오류

0

128

2

소스코드 요청

0

165

1

프록시 관련 질문

0

170

1

Presigned URL 사용시 데이터베이스 저장 시점

0

338

1

이미지 등록시 자동 등록 오류

0

222

1

강의에 사용된 코드 다운 받는 사이트 주소 있나요?

0

393

2

axios 이용해서 백엔드로 이미지 전송 중 새로고침

0

477

1

ImageList 컴포넌트에서 업로드 한 사진을 리스트에서 바로 보기 위해 이 방법도 괜찮나요??

0

386

1

이미지 처음 올릴 때만 나타나는 오류

0

258

1

es6 스타일로 Import 할때 동작하지 않습니다.

0

394

1

이미지 업로드시

0

368

1

node js를 이용하고 mysql에 이미지 경로 저장

2

1263

1

선생님 cloudFront를 사용하게되면 S3는 private으로 사용하는게 좋을까요

0

546

1

선생님 aws-sdk 모듈을 찾을 수 없다고 합니다.

0

668

1

new aws.S3 version 확인

2

509

1

react-router-dom v6 useHistory 이슈

7

641

0

람다에서 시간 초과 에러가 뜹니다!

0

320

1

첫 로드시 동일한 이미지 두번호출

2

497

1

이미지 업로드 시 배열로

2

532

1

Promise.all에 대한 질문

0

432

1

세션에 관한 질문이 있습니다.

0

436

1

Promise.all관련 질문 ("여러 이미지 미리보기" 중...)

0

314

1

cdn 주소

0

513

1

특정 user 페이지 가져오기 질문있습니다.

0

299

1