관리자 :: 상품 등록 (+ 사진 파일 등록) (1)

이 전 게시물을 확인하면

상품을 문제없이 등록할 수 있는 것을 확인해줄 수 있다.

이번에는 사진을 등록하도록 해주자

 

사진을 등록하려면 생각보다 설정해야하는 부분이 많다

우선 application.propertise 에서 파일 전송하는 설정을 해주자

 

application.properties

application.propertise에서 파일을 전송할 수 있도록 setting을 완료해주었다.

 

그럼 이제 FileController를 만들어주자.

 

FileController.java

사진을 등록하는 것이니, @PostMapping

 

자 .. 이제부터 .. 헷갈린다 ~!~! 눈 제대로 뜨고요~!~!

 

*파일을 보내는건 @RequestPart

 

*파일이 저장될 폴더의 위치를 지정해준다.

프로젝트가 D드라이브나 C드라이브에 있으면

"/shopping/images"

이렇게 지정해준다.

(나는 D드라이브에 shopping 폴더를 생성해주고, 그 안에 images 폴더를 생성해줘서

다음과 같이 폴더 위치를 지정해주었다.)

 

** MAC 사용자일 경우에는

"/Users/아이디/Desktop/shopping/images"

이렇게 지정해주고 폴더는 바탕화면에 넣어주면 된다.

 

나는 학원에서는 윈도우 환경에서 작업을 했고,

집에서는 맥북으로 작업을 하는데

같은 파일을 가지고 계속 이어가면서 작업을 하다보니 이 경로를 자꾸 바꿔줘야한다는 게

너무 헷갈리고 까먹어서 애를 많이 먹었다.

 

헷갈리니 한 줄씩 가져와서 설명을 해주자

 

String fileName = StringUtils.cleanPath(file.getOriginalFilename());

: StringUtils ( import org.springframework.util.StringUtils; )의 CleanPath 기능을 이용하여 파일의 경로를 가져온다.

cleanPath는 사용자의 운영체제 환경이 각기 다를 수 있으므로

한가지 표현 방식으로 통일한다.

 

String[] splitFileName = fileName.split("\\.");

: .을 기준으로 문자열을 여러 문자열로 자른 후 문자열 배열에 저장한다.

 

String ext = splitFileName[splitFileName.length-1];

: 자른 문자열 중의 가장 마지막 배열요소를 가져와서 ext 변수에 저장한다.

 

++ 이 부분은 헷갈리니, 예시를 들어서 설명을 하자

예를 들어, 21.06.11.ppt 라는 파워포인트 파일이 있다고 가정하자

splitFileName[0] = "21"

splitFileName[1] = "06"

splitFileName[2] = "11"

splitFileName[3] = "ppt"

splitFileName의 길이는 4이다. 그럼 ext에는 splitFileName[3]에 들어있는 ppt가 들어가게된다.

 

String saveFileName = null;

Calendar c = Calendar.getInstance();

: 전송 받은 파일을 저장할때의 이름을 지정해주자

이름에는 날짜를 지정해주도록 해주었다.

 

saveFileName = c.getTimeInMillis()+"."+ext;

: 전송받은 파일의 이름은 전송받은 시간을 ms 단위로 바꾼 것으로 설정한다.

 

사용자의 운영체제 환경이 다를 수 있으므로 한가지 표현 방식으로 통일한다.

String을 File객체에서 사용가능한 Path 형태로 변환한다.

 

이제 arc를 통해,

파일 전송이 제대로 되는지 확인해보자

 

귀여운 리트리버 찌부 사진을 선택해서 요청 넣었더니,

내가 지정한 폴더에 성공적으로 들어간 것을 확인할 수 있다!!!!!

 

DB에 전송하는 파일에 대한 table을 생성해주자

그리고는 VO도 이어서 생성해주자

 

ProductImageVO.java

이제는 mapper부터 차례로 작성해주자

 

ProductMapper.xml

ProductMapper.java

ProductService.java

여기까지 작성해주면 다시 API로 돌아가서 추가로 작성해주자

 

파일명과 사이즈를 넣어주는 작업을 해주었다.

 

파일이 성공적으로 들어갔다 ....!!!!!!!!!!!!!!!!!!!!!!

 

* 이제 해야할 일은,

사진 파일만 업로드 가능하도록 만들어 줄것이다.

(확장자 jpg, jpeg, png, gif 만 허용)

 

그럼 허용된 확장자가 아닌 다른 확장자를 업로드하려고 시도했을 시,

다음과 같은 메세지를 띄우는지 arc를 통해 확인해보자

 

ppt 파일을 요청했을 시에

설정한 메세지를 띄어준다 !!

성공 !!!!!

 

 

** 사진을 등록할 때

uri를 넣어주도록 해주자 

다음게시물에서.. 이어서 ..진행 ..