본문 바로가기
프로그래밍/JavaScript

scriptX - 프린트제어

by 백룡화검 2008. 10. 9.
<HTML>
<HEAD>
<TITLE>Print Sample</TITLE>
</HEAD>

<script language="javascript">
function printWindow() {
factory.printing.header = "여기는 머릿글입니다."
factory.printing.footer = "여기는 바닥글입니다."
factory.printing.portrait = true //true이면 세로 false이면 가로
factory.printing.leftMargin = 30.0 //왼쪽 마진
factory.printing.topMargin = 30.0 //상단 마진
factory.printing.rightMargin = 30.0 //오른쪽 마진
factory.printing.bottomMargin = 30.0 //하단 마진
factory.printing.Print(false, window)
}
</script>

<BODY>
<object id=factory style="display:none" classid="clsid:1663ed61-23eb-11d2-b92f-008048fdd814" codebase="http://www.meadroid.com/scriptx/ScriptX.cab#Version=6,1,429,14">
</object>
출력이 잘 되십니까?

<input type="button" name="print" value="출력" onClick="printWindow();">
</BODY>
</HTML>


===============================================================================
다음은 MeadCo 사에서 제공하는 ScriptX 에 대한 보다 더 자세한 설명입니다.
=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-

ASP나 자바스크립트로는 이러한 웹브라우저의 인쇄기능 설정을 변경할 수 없습니다.
사용할수 있는것이라고는 오직 여러분들이 잘 아시는 window.print(); 밖에 없습니다. ASP나 자바스크립
트 같은 스크립트 언어로는 윈도우 API를 사용할수 없기 때문이죠.

따라서 할수 있는 방법은 컴포넌트를 따로 만들어서 이것을 ASP 같은 스크립트 언어를 사용해 제어하는 것
이 현재까지의 방법중 가장 확실한 것이죠.

근데 문제는....
직접 서버를 운영하는 분들이 아니고 호스팅 서비스를 이용하시는 분들의 경우 개인이 만든 컴포넌트를 서버
에 인스톨하는 것이 불가능합니다. 대부분의 호스팅 회사들은 이것을 전혀 허락하지 않으니까요. 그리고 만
일 직접 컴포너트를 제작할 능력이 안된다면 그건 더 말할게 없겠죠.

이러한 문제점들을 안고 어려운 환경속에서도 열쒸미 프로젝트 개발에 여념이 없으신 분들에게 좋은 팁하나
가르쳐 드리겠습니다. 남의 손으로 코푼다고 할까요~~ 아주 간단하지만 강력한 인쇄기능 제어 방법입니다.
이 방법을 사용하시면 웹사이트에서 인쇄를 할때...

1. Header, Footer를 완벽히 제어할수 있습니다. Header, Footer를 빼고 인쇄할수도 있고 자기가 원하는 것으
로 바꿔서 인쇄할 수도 있습니다.

2. 코딩으로도 화면을 가로로 인쇄할지 세로로 인쇄할지 설정할수 있습니다.

3. 웹브라우저에 기본으로 되어있는 건 언제나 1부씩 출력이죠.... 이것을 자기가 원하는 부수로 설정할 수 있
습니다.

4. 왼쪽, 오른쪽, 위, 아래 여백 사이즈를 자기가 원하는데로 설정할 수 있습니다.

5. 프린터 이름을 입력해 어느 프린터로 출력 할지도 미리 설정할 수 있습니다.

6. 종이의 종류를 A4로 할지 다른걸로 할지등을 지정할 수 있습니다.

7. Manual Feed로 할지 Auto Feed로 할지 지정할 수 있습니다.

어떠세요. 이 정도 기능을 웹페이지 안의 코딩으로 미리 다 설정이 가능하다면 더 이상 웹어플리케이션 개발
할때 봉착하는 프린트 제어 기능 문제는 겪지 않으시겠죠?
또한 서버에 컴포넌트를 설치할 필요도 없으니 호스팅 서비스를 이용하시는 분들이나 컴포넌트 제작이 어려
우신 분들에게도 아주 좋으실 겁니다.

자 이제 딴소린 다 집어치우고 어떻게 하는지에 대해 말씀 드리겠습니다.

MeadCo라는 회사에서 개발한 ScriptX 라는 컴포넌트가 있습니다. 이것을 사용하는 것입니다.
물론 무료로 사용 가능하구요. Cab 파일 형태로 제공됨으로 서버에 설치하지 않고 클라이언트 컴터에 설치하
여 쓸수 있습니다. 여러분들 어떤 사이트를 방문하면 팝업이 뜨면서 0000 가 배포하는 000 프로그램을 설치하
겠나는 메세지 많이들 보셨죠? '예'를 선택하면 자동으로 그 프로그램이 설치되고 해당하는 웹페이지의 기능
들을 쓸수 있었잖아요. 이게 바로 그겁니다.

1.
우선 MeadCo 사의 웹사이트에서 ScriptX.Cab을 다운 받으세요.
이름(First Name), 성(Last Name), 이메일 주소를 입력하면 무료로 다운 받으실 수 있습니다.

http://www.meadroid.com/scriptx/sxdownload.asp

2.
다운받은 ScriptX.CAB 파일을 본인 웹서버의 원하는 곳에 업로드 시키세요.
http://www.test.com/ActiveX/ScriptX.cab 에 올렸다고 가정하죠.

3.
이제 인쇄기능이 필요한 웹이지 안에 다음의 오브젝트 태그를 삽입하세요.

<object id="factory" style="display:none" viewastext classid="clsid:1663ed61-23eb-11d2-b92f-008048fdd814"
codebase="http://www.test.com/ActiveX/ScriptX.cab#Version=6,1,431,2">
</object>

여기는 게시판이라 짤려서 3줄이 됐지만 짤리지 않게 두줄로 삽입하세요.

4.
이제 준비 끝입니다. 다음의 설정 스크립트를 삽입합니다.

<script defer>
function Print() {
factory.printing.header = "영수증 원본"; // Header에 들어갈 문장
factory.printing.footer = "감사합니다."; // Footer에 들어갈 문장
factory.printing.portrait = false // true 면 가로인쇄, false 면 세로 인쇄
factory.printing.leftMargin = 1.0 // 왼쪽 여백 사이즈
factory.printing.topMargin = 1.0 // 위 여백 사이즈
factory.printing.rightMargin = 1.0 // 오른쪽 여백 사이즈
factory.printing.bottomMargin = 1.0 // 아래 여백 사이즈
factory.printing.SetMarginMeasure(2); // 테두리 여백 사이즈 단위를 인치로 설정합니다.
factory.printing.printer = "HP DeskJet 870C"; // 프린트 할 프린터 이름
factory.printing.paperSize = "A4"; // 용지 사이즈
factory.printing.paperSource = "Manual feed"; // 종이 Feed 방식
factory.printing.collate = true; // 순서대로 출력하기
factory.printing.copies = 2; // 인쇄할 매수
factory.printing.SetPageRange(false, 1, 3); // True로 설정하고 1, 3이면 1페이지에서 3페이지까지 출력
factory.printing.Print(true) // 출력하기
}
</script>

이제 버튼 하나 만들어서 Print() 만 호출하면 위에 설정된 구성들로 프린트가 될것입니다.

만일 폼값을 받아 위의 설정값들을 변경하려면
frm = document.forms[0]; 처럼 폼 다큐먼트를 설정해 준 후
document.factory.printing.copies = frm.CopiesValue.value; 처럼 그 값을 받아오면 됩니다.

그럼 즐프 하세요~

 

* 버전별로 무료 / 사용이 있다고 하던데 지식인 검색해서

codebase=http://www.test.com/ActiveX/ScriptX.cab#Version=6,1,431,2

이부분을 버전을 어떻게 고쳐야 하는지 찾아 보시고 맞게 고쳐주세요.^^

출처 : Tong - 이젠 백수님의 임시 공간통
===============================================================================



' http://www.meadroid.com의 ScriptX 공개 프린트 컴포넌트로 상당히 많은 기능이 있으나
무료로 사용할수 있은 기능은 아래와 같고.  그 외의 기능은 라이센스가 필요하다.

 

<script language="javascript">

function printWindow() {
  factory.printing.header = "머릿글" //머릿말 설정
  factory.printing.footer = "바닥글"  //꼬릿말 설정
  factory.printing.portrait = true                    //출력방향 설정: true-가로, false-세로
  factory.printing.leftMargin = 1.0                //왼쪽 여백 설정
  factory.printing.topMargin = 1.0                //왼쪽 여백 설정
  factory.printing.rightMargin = 1.0              //왼쪽 여백 설정
  factory.printing.bottomMargin = 1.0            //왼쪽 여백 설정
  factory.printing.Print(false, window)
}
</script>

<object id="factory" viewastext  style="display:none"
  classid="clsid:1663ed61-23eb-11d2-b92f-008048fdd814"
  codebase="http://www.meadroid.com/scriptx/ScriptX.cab#Version=6,2,433,14">
</object>

<input type="button" name="print" value="프린트" onClick="printWindow();">
 

- 프린터 팁 : 웹페이지를 다음 페이지에 인쇄

    <p style="page-break-before:always">
    이 태그를 만나면 다음페이지에 인쇄함

=========================================================================

scriptX 무료기능을 이용한 print() 했는지 여부 확인..

javascript의 window.print()는 인쇄창(프린터 선택하는 화면)을 여는 기능외에 다른 커스터마이징이 불가능합니다.  인쇄를 하지 않고, 창을 닫았을 때, 처리 방법이 있으면 좋은데.. 찾을 수가 없네요. (있나요? 있으면 코멘트 부탁합니다)

 

activeX로 해야할 것 같습니다. activeX로는 scriptX를 이용해 볼만 한데... advanced 기능은 유료로 구매한 경우에만 가능해서 그렇게 추천할 수는 없군요..

 

다만, scriptX의 기본 기능(무료)중에, 인쇄창을 열었는데... 고객이 인쇄를 하지 않고, 인쇄창을 닫아버리면 return value로 false를 돌려주는 기능이 있습니다.

 

페이지에서 인쇄창을 열고, 만약 return값이 false면 "인쇄안함"으로 다시 처리하고, true이면 "인쇄됨" 처리하면 100%는 아니지만, 근접한 결과를 얻을 수 있을 것입니다. (각종 프린터 오류가 있어 프린트가 안된 경우는 print에서 결과값을 return 받아야 하는데.. 그러려면, 유료기능을 사용해야 할 듯합니다)

 

아래에서는  printresult.asp?result=0(실패시) printresult.asp?result=1(성공시)로 처리했는데, 이를 통한 db 작업은 잘 알아서 하시면 되겠습니다..

 

참고로 scriptx의 기본기능(무료)를 이용하면 프린트 결과물의 header footer 위/아래/좌/우 여백 가로/세로출력 등을 설정할 수 있습니다.

 

참고 소스는

 

<OBJECT id="factory" style="DISPLAY: none"
  codeBase="http://www.meadroid.com/scriptx/smsx.cab#Version=6,2,433,14"
  classid="clsid:1663ed61-23eb-11d2-b92f-008048fdd814" viewastext>
  </OBJECT>
<script>
function printPage(){
 factory.printing.header = "";  //머릿말 설정
 factory.printing.footer = "";    //꼬릿말 설정
 factory.printing.portrait = true;  //출력방향 설정: true-가로, false-세로
 factory.printing.leftMargin = 1.0;  //왼쪽 여백 설정
 factory.printing.topMargin = 1.0;  //위쪽 여백 설정
 factory.printing.rightMargin = 1.0;  //오른쪽 여백 설정
 factory.printing.bottomMargin = 1.0;  //아래쪽 여백 설정
 a = factory.printing.Print(true);  //출력하기
 if (!a) {
 window.location.href="printresult.asp?result=0" // 인쇄없이 닫은 경우 처리url  get방식
 }
 else {
 window.location.href="printresult.asp?result=1" // 인쇄한 경우 처리url  get방식
 }
 }
</script>
<body onload="printPage();">

인쇄할 내용

</body>

============================================================================