1. 참조 : https://cuna.tistory.com/127

  2. 이미지 업로드

    1. 전송화면 코드

      Untitled

      1. img/upload 경로에 POST 메서드로 요청
      2. enctype
        1. HTML form을 POST방식으로 전송할 때 전송하는 데이터를 인코딩하기 위해서 인코딩 타입에 대해 명시하는 부분
        2. enctype에 적용가능한 3가지 옵션
          1. multipart/form-data: 파일이 포함된 폼을 전송할 때 사용
          2. application/x-www-form-urlencoded: 파일이 없는 폼에 사용, multipart/form-data를 제외한 모든 경우에 적용(기본값)
          3. text/plain: 인코딩 없이 전송, 보안성이 없어 디버깅 용도로만 사용됨
        3. 파일을 전송하지 않는 경우 multipart/form-data를 사용하게 되면 파일 전송을 위해 추가적으로 표시되는 요소들이 있기 때문에 비효율적임
      3. multiple
        1. 기본적으로 true, false의 값을 가짐
        2. type이 email, file인 input에만 적용됨
        3. email의 경우 콤마를 구분자로 사용하여 여러개를 받을 수 있음
        4. file의 경우 여러개의 파일을 받을 수 있음(false의 경우 하나의 파일만 가능)
        5. XHTML에서는 속성값을 생략할 수 없으므로 속성값을 multiple로 명시해야함

    2. 컨트롤러 코드

      Untitled

      1. @RequestParam
        1. input에 name으로 지정한 값으로 파라미터를 받아오는 어노테이션
        2. 예제에서는 name=”uploadfile”로 명시함
      2. MultipartFile
        1. 클라이언트가 요청을 보낼 때 Http프로토콜의 바디 부분에 데이터를 여러 부분으로 나눠서 보내는 것
        2. 웹 클라이언트가 서버에게 파일을 업로드할 때, Http 프로토콜 바디에 파일정보를 담아서 전송
        3. 파일을 한번에 여러개 전송을 하면, 바디에 파일이 여러개의 부분으로 연결되어 전송
        4. 이렇게 여러 부분으로 나뉘어 전송되는 것을 Multipart data라고 함
        5. 보통 파일 전송에 사용됨
        6. form에서 multipart/form-data로 인코딩하여 보낸 파일은 모두 MultipartFile객체로 받아야함(편리한 메서드 제공)
        7. transferTo() 메서드를 사용하면 원하는 경로에 파일 저장 가능(확장자까지 작성) → 보통 yml에 작성한 path를 받아서 사용
        8. 예제에서는 UUID를 랜덤으로 생성하여 UUID를 이름으로 저장
      3. application.yml

        1. yml에는 간단하게 경로, 최대 사이즈, 최대 요청 사이즈 등을 명시해줌

        2. location을 참조하여 해당 경로에 파일을 저장

          Untitled

  3. 이미지 다운로드

    1. 다운로드 화면 코드

      Untitled

      1. img/download에 GET방식으로 요청하도록 작성

    2. 컨트롤러 코드 작성

      Untitled

      1. 파일 가져오기

        1. Paths.get() 메서드를 활용하여 (경로 + 파일이름(+확장자))를 넘겨주면 Path타입의 객체를 반환하는데, 이후에 파일을 가져오는데 활용됨

        2. Files.probeContentType() 메서드에 Path타입의 객체를 넘겨주면, 객체를 활용해서 String형태로 contentType을 반환

        3. 경로에 사용된 filePath변수(설정 정보를 @Value 어노테이션으로 가져옴, 직접 작성도 가능함)

          Untitled

      2. Header

        1. content-disposition을 설정하는데, 해당 설정을 통해 다운로드받을 때의 파일이름을 설정해줄 수 있음
        2. 앞서 가져온 contentType을 설정해서 해당 파일이 이미지파일임을 알려줌

      3. Resource

        1. 바디에 넣어줄 객체
        2. Files.newInputStream()메서드에 앞서 가져온 Path객체를 넘겨주면 자바에서 활용가능한 Stream타입의 객체를 만들 수 있음

      4. ResponseEntity

        1. ok(): status code 200을 보내는 메서드
        2. headers()에 앞서 작성한 header를 넣어줌
        3. body()에는 Resource타입의 객체를 넘겨줌