[JavaScript] 파일용량 제한 체크

   //n개 파일 용량 체크(객체ID, 선택한 객체)

function checkFileSize( fileId, select_Idx ) {

var obj;

var obj_length = 3;

var fileSize = 0;

for(var i=0; i<obj_length; i++) {

obj = document.getElementById( fileId + (i+1) );

if( obj.value != "" ) {

fileSize += getFileSize( fileId, (i+1), fileSize, select_Idx );

}

}

var viewFileSize = document.getElementById("viewFileSize");

viewFileSize.innerHTML = fileSize.toFixed(2);  //소수점 둘째자리까지 표시;

}

//파일 용량 체크

function getFileSize( fileId, idx, fileSizeAll, select_Idx ) {

var maxSize = 5*1024*1000; //5M  개별파일 최대 용량

var maxFilesizeAll = 10*1024*1000; //10M 전체파일 최대 용량

var fileSize;

var obj = document.getElementById(fileId+idx);

fileSizeAll = fileSizeAll*1024*1000;

if (typeof document.body.style.maxHeight != "undefined") {

//ie7이상

var fso = new ActiveXObject("Scripting.FileSystemObject");

var f = fso.GetFile( obj.value );

fileSize = f.size;

f = null;

fso = null;

   }else {

//ie6

   var img = new Image();

   img.dynsrc = obj.value;

   fileSize = img.fileSize;    

}

   

if(fileSize > maxSize) {

alert("개별 파일업로드 허용용량 " + (maxSize/1024/1000) +"Mbyte를 초과하였습니다.");

fileValueReset( fileId, select_Idx );

fileSize = 0;

}else if((fileSize+fileSizeAll) > maxFilesizeAll) {

alert("전체 파일업로드 허용용량 " + (maxFilesizeAll/1024/1000) +"Mbyte를 초과하였습니다.");

fileValueReset( fileId, select_Idx );

fileSize = 0;

}else {

fileSize = Number(fileSize/1024/1000);

}

return fileSize;

}

// 첨부파일부분 리셋!!

function fileValueReset( fileId, select_Idx ) {

fileId = fileId+select_Idx;

var obj = document.getElementById(fileId);

    obj.outerHTML = "<input type=\"file\" name=\""+fileId+"\" id=\""+fileId+"\" style=\"width:500px;height:20px;\" onchange=\"checkFileSize('p_file','"+select_Idx+"');\">";

}

---------------------------------------

html

<input type="file" name="p_file1" id="p_file1" style="width:500px;height:20px;" onChange="checkFileSize('p_file', '1');" />

<input type="file" name="p_file2" id="p_file2" style="width:500px;height:20px;" onChange="checkFileSize('p_file', '2');" />

<input type="file" name="p_file3" id="p_file3" style="width:500px;height:20px;" onChange="checkFileSize('p_file', '3');" />

........

........

<li>※ 개별 첨부파일 용량은 최대 5MB까지 가능합니다.</li>

<li>※ 모든 첨부파일 용량은 최대 10MB까지 가능합니다.<span id="viewFileSize">0</span> / 10MB</li>

---------------------------------------

ActiveX를 컨트롤 하는부분이기 때문에 익스플로러에서만 동작 하며, 처음 사용 시 아래와 같은 메세지가 뜬다.

"이 페이지의 ActiveX 컨트롤이 다른 부분과 상호 작용하는데 안전하지 않을 수 있습니다.

상호 작용을 허용하시겠습니까?"

해당 메세지가 안뜨도록 하기 위해선 익스플로러 설정이 필요 하다.

1. 도구>인터넷옵션>보안>신뢰할 수 있는 사이트 등록

2. 사용자 지정 수준 버튼 클릭 > 스크립팅하기 안전하지 않을 것으로 표시된 ActiveX컨트롤 초기화 및 스크립팅 > 사용선택