Programing/JAVA

Oracle 오라클 myBatis BLOB 파일 저장, 불러오는 방법 이미지 미리보기

리커니 2018. 2. 2.
반응형

 

Oracle 오라클 BLOB myBatis 파일 저장, 불러오는 방법 이미지 미리보기

 

multipart/form-data 로 받은  MultipartHttpServletRequest 로 받아

오라클 BLOB 컬럼에 저장하는 방법을 알아보겠습니다.

 

멀티로 파일을 받는 방법은 아래의 Link를 참고하세요.

 

Link : javascript spring 멀티파일선택 업로드 ajaxForm multipart/form-data MultipartHttpServletRequest

 

1
2
3
4
5
6
7
    @RequestMapping(value="/uploadContent.do", method = RequestMethod.POST, produces="text/plain;Charset=UTF-8")
    @ResponseBody
    public String uploadContent(MultipartHttpServletRequest req) throws Exception{
        Gson gson = new Gson();
        FolderSet set = new FolderSet();
        List<MultipartFile> mf = req.getFiles("files[]");
        //중략

cs

 

MultipartFile 리스트 객체로 파일을 전달 받습니다.

 

이제 전달받은 데이터를 VO객체에 담아 저장하는 방식은 기존 myBatis 방식과 같습니다.

다만, BLOB 데이터를 저장할 변수는 VO객체에 byte[] 타입으로로 선언하셔야 합니다.

 

1
2
3
4
5
6
7
8
9
10
public class FileVO{
    private byte[] blob;
 
    public byte[] getBlob() {
        return blob;
    }
    public void setBlob(byte[] blob) {
        this.blob = blob;
    }
}
cs

 

넣으실 떄도 바이너리 타입으로 변환 해서 넣어주셔야 겠죠?

 

1
file.setBlob(mf.get(i).getBytes());
cs

 

당연히 컬럼은 BLOB 타입이고,

들어간 BLOB 컬럼에 데이터가 잘 들어갔는지 확인하기 위해서는

파일의 사이즈와 BLOB 컬럼의 LENGTH 가 같은지 확인하시면 됩니다.

 

 

이제 저장된 BLOB 파일을 읽어 브라우져에서 미리보기 해보록 하죠.

이미지를 미리보여줄 div 태그를 만듭니다.

 

1
2
3
                <div class="fileImg fileEmpty" id="preView">
                    <span>파일 미리보기</span>
                </div>
cs

 

아래와 같이 <img>태그를 추가해줍니다.

 

1
2
3
4
$('#preView').html('<img alt="미리보기" src="${ctx }/content/preview.do?fileId='+fileId+'&fileSeq='+fileSeq+'"/>');
$('#preView').removeClass('fileEmpty');
$('#preView>img').css('max-width',$('#preView').width());
$('#preView>img').css('max-Height',$('#preView').height());
cs

 

 

 

이벤트 발생 시 위에 코드가 실행이 되면 fileId와 fileSeq 코드를 받아

BLOB데이터를 가져와 ByteArrayInputStream으로 읽어 응답객체에 outputSteam으로 내보내 주시면 됩니다.

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
    @RequestMapping(value="/preview.do", produces="text/plain;charset=UTF-8")
    public void preview(HttpServletRequest request, HttpServletResponse response){
        FileVO fileInfo = null;
        InputStream is = null;
        try {
            String fileId = request.getParameter("fileId");
            
            int fileSeq = Integer.parseInt(request.getParameter("fileSeq"));
            FileVO param = new FileVO();
            param.setFileId(fileId);
            param.setFileSeq(fileSeq);
            
            fileInfo = contentService.getFileInfo(param);
            
            String contentType = "image/jpeg";
            response.setContentType(contentType); 
    
            is = new ByteArrayInputStream(fileInfo.getBlob());
            
            ServletOutputStream os = response.getOutputStream();
            int binaryRead;
            
            while ((binaryRead = is.read()) != -1)    {
                os.write(binaryRead);
            }
 
        } catch (Exception e) {
            e.printStackTrace();
        }finally{
            
        }
    }
cs

 

이제 미리보기 div 태그에 이미지가 표출되는 것을 확인 하실 수 있습니다.

반응형

댓글

💲 추천 글