[SPRING]アップロード結果と画面処理に戻る-(2)


通常サイズの画像ファイルの場合、アップロードは処理されますが、ブラウザは結果を反映していません.
生成されたデータはJSONに送信されるので、どの構造にデータを送信するかを決定する必要があります.

  • ブラウザに必要な情報
    -ファイルの元の名前をアップロードします.
    -ファイルのUUID値
    -ファイルをアップロードするストレージパス

  • 上記の情報は、Upload Controllerにファイルを保存するときに作成された文字列で処理することもできますが、クラスとオブジェクトを構成することで、ブラウザでの処理を簡素化できます.

  • プロジェクトでdtoパッケージを構成し、UploadResultDTOクラスを作成します.

  • @Data
    @AllArgsConstructor
    public class UploadResultDTO implements Serializable {
        //implements Serializable을 하는 이유: 자바 시스템 내부에서 사용되는 Object 또는 Data를 
        // 외부의 자바 시스템에서도 사용할 수 있도록 바이트 형태로 데이터를 변환하는 기술로써,
        //JVM 메모리에 상주되어 있는 객체 데이터를 바이트 형태로 변환하는 기술입니다.(직렬화)
    
        private String fileName;
    
        private String uuid;
    
        private String folderPath;
    
        public String getImageURL(){    //추후에 전체 경로가 필요한 경우를 대비하여 생성
            try{
                return URLEncoder.encode(folderPath+"/"+uuid+"_"+fileName,"UTF-8");
            }catch (UnsupportedEncodingException e){
                e.printStackTrace();
            }
            return "";
        }
    }
    Java URLENCODing
  • Web開発ではURLを符号化する必要がある場合がある.
  • URLには多くのルールがあり、これらのルールで使用される文字は固定されているため、一部の値はルールに合致する値に変換する必要があります.
  • やCookieなどのハングルが表現できない場合は、ASCII値としてエンコードする必要があります.
    この場合、次のようにURLEncoderクラスとURLDecoderクラスを使用できます.
  • Encoder
    import java.io.UnsupportedEncodingException;
    import java.net.URLEncoder;
     
    public class URLEncodeTest {
        public static void main(String[] args) {
            String url = null;
            try {
                url = URLEncoder.encode("한글 인코딩", "UTF-8");//URLEncoder는 밑에 정리!
            } catch (UnsupportedEncodingException e1) {
                e1.printStackTrace();
            }
     
            System.out.println(url);
        }
    }
    
    //output : %ED%95%9C%EA%B8%80+%EC%9D%B8%EC%BD%94%EB%94%A9+%EC%9D%B4%EB%9D%BC%EB%84%A4%7E
    
    Decoder
    import java.io.UnsupportedEncodingException;
    import java.net.URLDecoder;
     
    public class URLDecodeTest {
        public static void main(String[] args) {
            String url = null;
     
            try {
                url = URLDecoder.decode("%ED%95%9C%EA%B8%80+%EC%9D%B8%EC%BD%94%EB%94%A9+%EC%9D%B4%EB%9D%BC%EB%84%A4%7E", "UTF-8");
            } catch (UnsupportedEncodingException e) {
                e.printStackTrace();
            }
     
            System.out.println(url);
        }
     
    }
    //output : 한글 인코딩
    
  • Upload Controlは、応答エンティティをアップロード結果の処理に変更します.
  •    @PostMapping("/uploadAjax")
        public ResponseEntity<List<UploadResultDTO>> uploadFile(MultipartFile[] uploadFiles) {
        			//추가된 부분
    
           List<UploadResultDTO> resultDTOList = new ArrayList<>();
            for (MultipartFile uploadFile : uploadFiles) {
    
                // 이미지 파일만 업로드 가능
                if(uploadFile.getContentType().startsWith("image") == false){
                    // 이미지가 아닌경우 403 Forbidden 반환
                    return new ResponseEntity<>(HttpStatus.FORBIDDEN);
                }
    
                // 실제 파일 이름 IE나 Edge는 전체 경로가 들어오므로
                String originalName = uploadFile.getOriginalFilename();
    
                String fileName = originalName.substring(originalName.lastIndexOf("\\") + 1);
    
                // 날짜 폴더 생성
                String folderPath = makeFolder();
    
                //UUID
                String uuid = UUID.randomUUID().toString();
    
                //저장할 파일 이름 
                String saveName = uploadPath + File.separator + folderPath + File.separator + uuid + fileName;
    
                Path savePath = Paths.get(saveName);
    
                try {
                    uploadFile.transferTo(savePath);// 실제 이미지 저장
                    resultDTOList.add(new UploadResultDTO(fileName,uuid,folderPath));
                    //dto에 controller에서 생성된 fileName,uuid,folderPath를 넣어준다.
                }catch (IOException e){
                    e.printStackTrace();
                }
            }
    
            return new ResponseEntity<>(resultDTOList, HttpStatus.OK);
        }

  • メソッドの戻りタイプはvoidからResponseEntityUploadResultDTO>に変更され、非画像ファイルの場合は例外処理ではなく「403 Forbidden」に変更されます.

  • アップロード処理後、ブラウザはJSON配列で結果を受信します.