jquery.uploadify 설정 설명 파일 업로드 (asp.net mvc)

페이지 소스:

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>jquery upload 업로드 (asp.net mvc) 설정</title>
    <script src="Resources/jquery.js"></script>
    <script src="Resources/uploadify/jquery.uploadify.js"></script>
    <script type="text/javascript">
        $(function(){
            $("#file-upload").uploadify({
                auto: true, // 파일 선택 후 여부 자동 업로드, 기본값: true
                height: 30, // 버튼 높이
                swf: '/Resources/uploadify/uploadify.swf', // flash 파일 경로
                uploader: '/home/UploadFile', // 서버 업로드 주소
                width: 120, // 버튼 너비
                buttonText: "파일 선택", // 버튼 텍스트 표시, 기본값: Select File
                fileObjName: "uploadFileName", // 서버 수신 파일 이름, 기본 값: FileData
                buttonClass: "custom-css", // 사용자 정의 단추 같은 스타일 (추가) 기본값: 빈
                buttonCursor: "arrow", // 마우스 스타일, 기본값: hand
                buttonImage: null, // 단추 배경 그림
                checkExisting: false, // 만약 위해 true, 서버 반드시 제공하는 인터페이스 검사 곧 업로드 파일을 사용할 지 이미 존재합니다. 서비스 사이드, 
                debug: true, // SWFUpload 위해 것을 모드 설정
                fileSizeLimit: 0, //업로드할 파일 크기 제한: 0 무제한, 기본 단위 KB, 정말 설정 되어 문자열 같다.: 1024MB
                fileTypeDesc: "그림 파일", // 상자 그림 선택 선택 설명을 기본값 All Files
                fileTypeExts: "*.jpg;*.gif;*.png;*.bmp;*.rar", // 파일 확장자 이름 필터 선택 기본값 *.* 즉 모든 파일.여러 가지 접미사 명의 채택; 분리하다
                formData: { parameter1: "value1", parameter2: "value2" }, // 부가 모든 파일 업로드 인자 (json 형식) 을 기본값: 빈
                itemTemplate: false, //템플릿 업로드 대기열 목록,
                method: "post", // 전송 방식, GET|POST
                multi: true, // 혹시 지원. 여러 개의 파일을 업로드
                preventCaching: false, //  막을 캐시
                progressData: "percentage", // 진행 상황을 조 보이기, percentage|speed
                queueSizeLimit: 999,    // 매번 선택 업로드 대열적 총수는 크기, 기본값: 999
                removeCompleted: true,  // 파일 업로드 성공 후 위로 지나갈 행렬, 기본값: true
                removeTimeout: 3,    // 파일 업로드 성공 후 딜레이 몇 초 위로 지나갈 행렬, 기본값: 3
                requeueErrors: false,    //  이 파일 업로드 오류 발생 시 만약 true 올리는 동작 을 어떻게 반복한
                uploadLimit: 999,   // 파일을 업로드할 수 있는 최대, 기본값: 999
                onCancel: function (fileObj) {   // 이 업로드 에서 대기열 위로 지나갈 트리거
                    console.dir(arguments);
                },
                onClearQueue: function (queueItemCount) {   // 이 실행 제거 대기열 건 트리거 같다$('#file-upload').uploadify('cancel','*')
                    console.dir(arguments);
                },
                onDestroy: function () {     // 나는 SWFUpload 되는 것은 트리거
                    console.log("uploadify 이미 인몰되다!");
                },
                onDialogClose: function (queueData) {   // 이 파일 선택 대화상자 닫기 트리거
                    console.dir(arguments);
                },
                onDialogOpen: function () {     // 이 파일 선택 대화상자를 열 때 트리거
                    console.dir(arguments);
                },
                onDisable: function () {     // 호출 disable 방법 시작할 때 트리거 같다: $('#file-upload').uploadify('disable', true);
                    console.log("uploadify 비활성화됨!");
                },
                onEnable: function () {     // 호출 disable 방법 시작할 때 트리거 같다: $('#file-upload').uploadify('disable', true);
                    console.log("uploadify 이미 그에 의해 켜기!");
                },
                onFallback: function () {       // 있습니다 버전 호환 오류 발생
                    console.log("호환되지 않는 있습니다!");
                },
                onInit: function (instance) {   //  초기화 시 발동
                    console.dir(arguments);
                },
                onQueueComplete: function (queueData) {     // 이 큐 중에 모든 파일을 실행할 때 모두 다 발동
                    console.dir(arguments);
                },
                onSelect: function (fileObj) {      // 이 하나하나 선택한 파일을 추가합니다 (큐 시 발동
                    console.dir(arguments);
                },
                onSelectError: function (file, errorCode, errorMsg) {    // 이 하나하나 선택한 파일을 추가합니다 (대열 신문 시 발동
                    console.dir(arguments);
                },
                onSWFReady: function () {     // 이 swf 불러오기 및 준비 완료 시 발동
                    console.log("swf 이미 초기화!");
                },
                onUploadComplete: function (fileObj) {   // 대기 중 하나하나 파일 업로드 작업이 실행 완료 트리거 내가 아무리 업로드 성공을 하든 실패를
                    console.dir(arguments);
                },
                onUploadError: function (fileObj, errorCode, errorMsg, errorString) {       // 이 큐 중 하나하나 파일 업로드 실패 때 트리거
                    console.dir(arguments);
                },
                onUploadProgress: function (fileObj, bytesUploaded, bytesTotal, totalBytesUploaded, totalBytesTotal) {  // 대기 중 하나하나 파일 업로드 진행 이벤트
                    console.dir(arguments);
                },
                onUploadStart: function (fileObj) {      // 이 큐 중 하나하나 파일 업로드 시작 시 발동
                    console.dir(arguments);
                },
                onUploadSuccess: function (fileObj, data, response) {       // 대기열 파일 업로드 중 하나하나 성공 시작할 때 트리거
                    console.dir(arguments);
                }
            });
            /**
             *방법
             */
            //$('#file-upload').uploadify('cancel');  // 은 대기 중 위로 지나갈 첫 
            //$('#file-upload').uploadify('cancel', "*");  // 빈 대기 행렬
            //$('#file-upload').uploadify('destroy');     // 소각하다
            //$('#file-upload').uploadify('disable', true);   // 사용 안함 | 켜기
            //$('#file-upload').uploadify('setting', "name", "value");    // 설정 | uploadify 설정 가져오기
            //$('#file-upload').uploadify('stop');    // 정지
            //$('#file-upload').uploadify('upload')     // 시작 업로드
        });
    </script>
</head>
<body>
    <input type="file" name="fileName" id="file-upload" />
</body>
</html>

배경 프로그램 및 webconfig 설정:

<system.web>
    <httpRuntime executionTimeout="300" maxRequestLength="10240" />   <!--최대 10MB-- 제한>
</system.web>
public class HomeController : Controller
{
    [HttpPost]
    public ActionResult UploadFile()
    {
        HttpPostedFileBase postedFile = Request.Files["uploadFileName"]; // 업로드할 파일 이름 반드시 일치
        if (postedFile != null)
        {
            string filePath = Path.Combine(AppDomain.CurrentDomain.BaseDirectory, string.Format("{0}{1}", DateTime.Now.ToString("yyyyMMddHHmmsss"), Path.GetExtension(postedFile.FileName)));
            using (Stream streamReader = postedFile.InputStream)
            {
                byte[] buffer = new byte[1024];
                using (FileStream streamWriter = new FileStream(filePath, FileMode.Create, FileAccess.Write))
                {
                    int read = streamReader.Read(buffer, 0, buffer.Length);
                    while (read > 0)
                    {
                        streamWriter.Write(buffer, 0, buffer.Length);
                        read = streamReader.Read(buffer, 0, buffer.Length);
                    }
                    streamWriter.Flush();
                    streamWriter.Close();
                    streamWriter.Dispose();
                    streamReader.Flush();
                    streamReader.Close();
                    streamReader.Dispose();
                    return Content("1");
                }
            }
        }
        return Content("0");
    }
}

글쓴이 Mun 작성일 2015-01-15 01:14