게시판 본문 ASP, ASP.NET, IIS & Script - Read Only

약속대로 공개합니다.

완전하지는 않지만, upload 기능은 구현되었습니다.
저도 요즘 시간이 없는 터라 조금씩 발전시킬 생각입니다.

원래는 JoyUpload와 Pure ASP Upload를 이용할 생각이었으나, test 분석 과정에서 일반 Upload componant를 이용해도 된다는 결론을 얻었습니다. (하지만 Pure ASP Upload로 접근했기 때문에 그러한 적용 방법을 확실히 알게 되었습니다)

그래서, 결론적으로 저는 JoyUpload와 DextUpload componant를 이용해서 구현했습니다.

여기 file 첨부가 안 되는 관계로 JoyUpload를 구할 수 있는 위치를 먼저 설명하겠습니다.
PHP School이라는 site를 검색하셔서 거기 자료실에서 JoyUpload라고 검색하시면 file을 다운 받으실 수 있습니다. (게시글을 잘 읽어 보시고, 최신 patch된 version을 다운 받으시길 바랍니다)

아래는 적용법입니다.

1. /lib/js 위치에 JoyUploader.js를 저장합니다. (아래는 JoyUploader.js의 source입니다)

function fJoyUploaderINIT( fintUploadSize, fintUploadCount, fintFormRound, fstrUploadFilter, fintFormUploadSize, fstrFormUploadFilter )
{
var intHeight = 100;
var intWidth = 430;

var strUploaderInit = "<OBJECT id=\"JoyUpLoad\" name=\"JoyUpLoad\" CLASSID=\"CLSID:7236F083-1DC0-45A8-A3CC-A0CB8DAFB1BC\" CODEBASE=\"/lib/cab/JoyUpload.cab\" onError=\"bUploadControl=false;\" style=\"border:0px\" height=\"" + intHeight + "\" width=\"" + intWidth + "\"> " +
" <param name=\"uploadSize\" value=\"" + fintUploadSize + "\"> " +
" <param name=\"uploadCount\" value=\"" + fintUploadCount + "\"> " +
" <param name=\"formround\" value=\"" + fintFormRound + "\"> " +
" <param name=\"uploadFilter\" value=\"" + fstrUploadFilter + "\"> " +
" <param name=\"formUploadSize\" value=\"" + fintFormUploadSize + "\"> " +
" <param name=\"formUploadFilter\" value=\"" + fstrFormUploadFilter + "\"> " +
"</OBJECT>";

document.writeln( strUploaderInit );
}

2. FileCube의 기존 Upload dialog window는 web 대화상자로 되어 있어서 error가 발생하므로 frame_main.asp를 수정했습니다.

3. frame_main.asp에서 아래와 같이 JoyUpload.js를 include합니다.

<script language="javascript" src="/lib/js/JoyUploader.js"></script>

4. 기존에 기술되어 있는 JScript function syncPane()의 앞 부분에 아래의 JScript를 추가합니다.

var bUploadControl = true;
var bSubmit = false;

function fAttachFiles()
{
document.JoyUpLoad.AttachFiles();
}

function fDeleteFiles()
{
document.JoyUpLoad.DeleteFiles();
}

function fUploadFiles()
{
if ( bUploadControl == false )
{
alert( "ActiveX control이 설치되지 않았습니다. " );
return;
}

if (bSubmit == true)
{
return;
}

document.ProcForm.method = "post";
document.ProcForm.action = "/multi_upload.asp";
document.ProcForm.target = "exp_procedure";
document.ProcForm.encoding = "multipart/form-data";

bSubmit = true;
if(document.JoyUpLoad.Submit() == true)
{
// Message 표시를 원하지 않고 다른 page로 바로 이동하려면 아래에서 처리 하면 된다
// document.write(document.JoyUpLoad.Response); // Form 전송 후 server에서 응답하는 message 출력
document.location.reload();
}
else
{
window.returnValue = "";
alert( "전송이 취소되었습니다." );
}
bSubmit = false;
}

5. JoyUpload AxtiveX control를 표현하고 싶은 위치에 아래의 code로 표현합니다.

<script language="javascript">
<!--
// 전체업로드용량(Bytes): 0으로 넣거나 빼면 제한없음
var intUploadSize = "0";

// 전체 업로드 파일갯수: 0으로 넣거나 빼면 제한없음
var intUploadCount = "0";

// 전송창 모서리 둥글기 : 0으로 넣거나 빼면 4각 이고 값이 커질수록 둥글게 된다
var intFormRound = "10";

// 파일선택 창에서 사용할 필더 : 빼면 필터 없음
var strUploadFilter = "이미지파일(*.jpg,*.tif,*.psd)|*.jpg;*.tif;*.psd|텍스트파일(*.txt)|*.txt|모든파일(*.*)|*.*||";

// (form의 file element 사용 시) 업로드용량(Bytes): 0으로 넣거나 빼면 제한없음
var intFormUploadSize = "0" // "1048576";

// (form의 file element 사용 시) 파일선택 창에서 사용할 필더 : 빼면 필터 없음
var strFormUploadFilter = "텍스트파일(*.txt)|*.txt||";

fJoyUploaderINIT( intUploadSize, intUploadCount, intFormRound, strUploadFilter, intFormUploadSize, strFormUploadFilter );
//-->
</script>

6. 아래 button tag를 적절한 위치에 배치합니다.

<input class="bttn01" type="button" name="btnSearch" value=" 파   일 " onclick="fAttachFiles();" style="border: 1pt solid #444444;" ID="Button1"><br>
<input class="bttn01" type="button" name="btnDelete" value=" 삭   제 " onclick="fDeleteFiles();" style="border: 1pt solid #444444;" ID="Button2"><br>
<input class="bttn01" type="button" name="btnUpload" value=" 저   장 " onclick="fUploadFiles();" style="border: 1pt solid #444444;" ID="Button3">

7. 이제 처리만 하면 됩니다. 처리를 위해서 저는 기존의 upload.asp를 multi_upload.asp로 copy하였습니다.

8. multi_upload.asp에서 DXT 처리 부문을 수정합니다. If CheckCapacity( objUpload.FileLen ) Then ~ Else ~ End If 부분에서 Then과 Else 사이를 수정합니다. 아래는 수정된 Code입니다.

' If CInt( strIsOverwrite ) = 0 Then
' objUpload( "joyfile[]" ).Save strPath, False
' For intI = 1 To objUpload("joyfile[]").Count
For Each item In objUpload("joyfile[]")
' objUpload("joyfile[]")(intI).Save strPath, False
item.Save strPath, False
' Response.Write item
Next
' ElseIf CInt( strIsOverwrite ) = 1 Then
' objUpload( "joyfile[]" ).Save strPath, True
' For intI = 1 To objUpload("joyfile[]").Count
' For Each item In objUpload("joyfile[]")
' objUpload("joyfile[]")(intI).Save strPath, True
' item.Save strPath', True
' Response.Write item
' Next
' End If

9. 이상과 같이 하시면 정상적으로 작동하는 것을 확인 하실 수 있습니다. 덮어쓰기 기능을 그대로 사용하려면, 기존에 file upload 시 덮어쓰기 설정에 해당하는 strIsOverwrite을 frame_main.asp에서 checkbox든 hidden이든 직접 설정해 주셔야 할 것입니다. (주석 처리 되어 있음)

10. 기타 file 처리는 multi_upload.asp 측에서 DextUpload componant를 이용해서 처리가 가능할 것입니다. 참고로 저는 DextUpload Professional v3.0을 이용했습니다만, DextUpload v2.0에서도 MultipleUpload sample을 참고하시면 가능할 것입니다.

이상으로 간단하게 나마 설명을 마치겠습니다.

File이 선택되지 않았을 경우는 multi_upload.asp에서 저장 block을 건너뛰도록 하는 것이 방법일 것입니다.

대용량에 대해서는 아직 test해 보지 못했으나 JoyUpload control과는 상관이 없고 DextUpload와 관계된 부분입니다.

한 가지 아쉬운 점은 JoyUpload를 cab file로 변경하여 embed 시도하였으나 client browser에서 ActiveX 서명 문제 때문인지 설치가 정상적으로 진행되지는 않았습니다. 그래서 저는 file을 download 받아서 설치하는 방법으로 하고 있습니다. (잘 아시는 분은 JoyUpload의 Source를 이용해서 이 부분을 해결해서 공유해 주시면 좋겠다는 생각입니다)

혹시 문제가 있는 부분이 있다면 함께 토론해 봤으면 합니다.

끝으로 적극적인 도움을 주신 송원석(송원석)님께 감사드립니다.