[FLEX] 파일 Multi-Uploader (with ASP)


국내에서 FileUpload를 하기 위해서는, activeX를 많이 사용합니다.

ActiveX는 웹표준이 추구하는 Cross-Browsing을 파괴하는 주범이 되는데요.

이번에 기존의 activeX를 걷어내고, Flex를 이용한 업로더를 만들게 되어서,

제작과정에서 생긴 문제점들과 Tip들을 공유하고자 포스팅합니다.

일단 Flash/Flex에는 FileReference, FileReferenceList라는 클래스를 가지고 있습니다.

거의 유일하게 FlashPlayer에서 로컬에 있는 데이터에 접근할수 있는 녀석이라고 말할수 있지요. ^^

AS3.0으로 진화하면서 FlashPlayer(FP9+)의 보안정책이 상당히 강화되어, 기존에 되던 것들도 안되는게 참 많죠 ㅎㅎ

서론이 길었네요.

일단 File 업로드의 과정을 간단하게 살펴보겠습니다.

사용자 삽입 이미지

아주 간단하게 보면, 웹브라우저에 있는 Flash Player을 이용하여, 로컬에 있는 FileData의 정보를 받고, 이를 서버에 HttpService를 사용하여 전달하는 간단한 프로세스입니다.

이 과정에서 여러가지 문제들이 발생할수 있죠. 보안문제라던지, 인코딩문제라던지..

FileReference에 대해서 조금 살펴보겠습니다.

FileReference는 flash core 클래스로, flash.net패키지 안에 들어있습니다.

browse(), upload(), download(), save(), load(), cancel() 등의 Method를 갖고있습니다.

Air에서는 uploadUnencoded()도 있구요.

이 중 browse, upload, cancel 3가지를 사용하여, 업로더를 구현해보겠습니다.

(이번에 진행했던 Server-script가 asp이므로, asp부분에서의 문제들도 언급하겠습니다)

//

addFiles함수에서 _refAddFiles에 fileData를 넣고, Event.SELECT 이벤트가 발생할 경우, onSelectFile()를

실행합니다. _refAddFiles.fileList를 조사하여, listFiles.dataProvider에 데이터를 대입하게 되구요

FileReference를 생성하고 listFiles의 데이터를 대입합니다.



startUpload함수에서 upload메서드를 실행하는데요.

upload에 필요한 Parameter는 총 3가지입니다.

1. URLRequest데이터

2. FileData

3. TestUpload Boolean



업로드와 동시에 어떤 변수를 보내려면 URLVariables을 만들어서 붙이면 되구요.

request를 보낼때의 contentType은 “multipart/form-data”가 됩니다.

RequestMethod는 POST방식입니다.





browse에서 파일타입을 지정하실때는 FileFilter를 활용하시면 됩니다.

Windows환경과 Mac환경에서의 업로드설정을 달리 할수있습니다.


browse Method에서는 Array형태의 Filter데이터를 요구합니다.







다음은 ASP페이지부분의 처리부분에서 발생했던 문제들입니다.

Flex단에서 전송하는 파일명이 한글일경우, 정상적으로 데이터를 받지못하는 문제가 있습니다.

euc-kr기반의 asp(DEXT 업로더)에서는 별도의 언어코드를 설정해줘야합니다.

//

세부적으로는 공개할수 없는 소스들이 섞여있어서, 적을수가 없겠군요.


(주)리화이트 대표 / CEO & Founder

Next ArticleTwitter에서 제공하는 블로그위젯의 문제점