JavaScript를 사용하여 PDF 파일 생성


268

웹 페이지에서 XML 데이터를 PDF 파일로 변환하려고하는데 JavaScript에서 완전히 수행 할 수 있기를 바랍니다. 텍스트, 이미지 및 간단한 도형을 그릴 수 있어야합니다. 브라우저에서 완전히 할 수 있기를 바랍니다.

답변:


446

방금 Javascript 만 사용하여 PDF를 생성하는 jsPDF 라는 라이브러리를 작성했습니다 . 아직 어려서 기능과 버그 수정을 곧 추가 할 예정입니다. 또한 데이터 URI를 지원하지 않는 브라우저의 해결 방법에 대한 몇 가지 아이디어가 있습니다. 자유 MIT 라이센스에 따라 라이센스가 부여되었습니다.

나는 쓰기 시작하기 전에이 질문을 보았고 돌아와서 당신에게 알려 줄 것이라고 생각했습니다 :)

자바 스크립트로 PDF 생성

예를 들어 "Hello World"PDF 파일을 작성하십시오.

// Default export is a4 paper, portrait, using milimeters for units
var doc = new jsPDF()

doc.text('Hello world!', 10, 10)
doc.save('a4.pdf')
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.5/jspdf.debug.js"></script>


10
jsPDF에 부분적으로 영감을 주었습니까? 발표 한 날 jsPDF에 대해 배웠습니다. 지금까지 좋아 보인다. 필자의 요구 사항에 가장 적합한 PDF 생성 라이브러리이기 때문에 Prawn을 사용하게되었습니다. 나는 긍정적이지 않기 때문에 모든 작업을 브라우저 내에서 계속하고 싶다. 배포하려는 시스템에서 Ruby를 얻을 것이다. jsPDF를 매우 자세히보고 있습니다. 도와 드리고 싶지만 시간은 매우 제한적입니다. 앞으로 변경 될 수 있습니다.
amoeba

7
당신은 다소 영감을 얻었습니다 :), 인터넷에서 이미 존재하는지 확인하고 일부 사람들이 유용하다고 생각하는 것을 보았습니다. 도움이 필요하면 알려주세요. 트위터에서 @MrRio입니다.
James Hall

23
여전히 살아있다. 0.9.0rc2 오늘 출시되었습니다.
James Hall

87
@JamesHall, 나는 이것을 작성하기 위해 취해야 할 모든 작업에 대해 감사하고 MIT 라이센싱을 통해 자신의 이익을 위해 상업화 할 수있을 때 세상을 더 나은 곳으로 만들 수 있습니다.
Charles Burns

16
downvoters가 우리에게 "더 나은"아이디어 나 솔루션을 제공 할 수 있습니까? 이것은 훌륭한 노력입니다.
Onur Yıldırım

138

언급 할 가치가있는 또 다른 자바 스크립트 라이브러리는 pdfmake 입니다.

브라우저 지원은 jsPDF만큼 강력하지 않으며 모양 옵션도 보이지 않지만 텍스트 서식 옵션은 현재 jsPDF에서 사용할 수있는 옵션보다 고급입니다.


7
이 답변은 훨씬 더 많이 찬성되어야합니다. pdfmake는 jspdf보다 훨씬 강력합니다. 그러나 부수적 인 참고 사항은 PDFKit 라이브러리를 감싸는 것입니다.
vittore

2
또 다른 참고 사항 인 jspdf는 utf-8을 지원하지 않으며 pdfmake는 기본 글꼴에 대해서만 utf-8을 지원합니다.
Leo

"pdfmake.min.js-0.1.22-9 시간 전"이 날은 업데이트되지 않았습니다.
zenbeni

두 놀이터를 비교해 보면 jsPDF는 "그래픽"PDF 작성을보다 대상으로하는 반면, pdfmake는 형식이 잘 지정된 "일반"문서를 생성하는 데 더 많은 것을 목표로하는 반면 일반 텍스트 형식을위한 훨씬 더 많은 옵션이있는 것 같습니다.
cslotty

이 IE는 친절합니까?
Wildhammer

59

PDFKit을 유지 관리하며 pdfmake (이미 언급되어 있음)도 지원합니다. 노드와 브라우저 모두에서 작동하며 다른 라이브러리가 지원하지 않는 많은 것들을 지원합니다.

  • 유니 코드를 지원하는 서브셋 글꼴 포함
  • 많은 고급 텍스트 레이아웃 항목 (열, 페이지 나누기, 전체 유니 코드 줄 바꿈, 기본 서식있는 텍스트 등).
  • 고급 타이포그래피 (OpenType / AAT 합자, 문맥 대체 등)를위한 더 많은 글꼴 작업. 출시 예정 : 관심이 있다면 fontkit 분기를 참조하십시오.
  • 더 많은 그래픽 자료 : 그라디언트 등
  • browserify 및 스트림과 같은 최신 도구로 구축되었습니다. 브라우저와 노드 모두에서 사용할 수 있습니다.

PDFKit이 수행 할 수있는 작업을 직접 확인하려면 전체 자습서를 보려면 http://pdfkit.org/ 를 확인하십시오 . 그리고 어떤 종류의 문서를 생성 할 수 있는지에 대한 예를 보려면 PDFKit 자체를 사용하여 일부 Markdown 파일에서 생성 된 PDF로 문서를 확인하십시오 ( http://pdfkit.org/docs/guide.pdf) .

http://pdfkit.org/demo/browser.html 브라우저에서 대화식으로 사용해 볼 수도 있습니다 .


이것은 서버 측 라이브러리가 아닙니까? 토론은 클라이언트 측 js 라이브러리에 있다고 생각합니다.
Ash Catchem

10
PDFKit은 답변에서 언급 한대로 노드와 브라우저 모두에서 작동합니다. 브라우저 데모 링크를 참조하십시오.
devongovett

이미지가 압축됩니까? camscanner와 비슷한 기능을하는 웹 응용 프로그램을 작성 중이며 압축 및 다중 페이지 형식을 활용하기 위해 javascript를 통해 PDF 작성을 찾고 있습니다.
Trevor

@devongovett 당신은 내를 볼 수 있습니까 라이브러리에 대한 질문 있습니까?
ninbit

8

또 다른 흥미로운 프로젝트는 texlive.js 입니다.

브라우저에서 (La) TeX를 PDF로 컴파일 할 수 있습니다.


hello world 예제는 훌륭하게 렌더링되지만 완료하는 데 약 30 초가 걸립니다.
Sam Sippe

2

모든 URL에서 pdf를 생성하는 링크를 추가하면이 무료 서비스를 사용할 수 있습니다 (예 : http://www.phys.org ).

http://freehtmltopdf.com/?convert=http%3A%2F%2Fwww.phys.org&size=US_Letter&orientation=portrait&framesize=800&language=ko


1
업데이트 :이 freehtmltopdf.com 서비스 를 확인했을 때 더 이상 사용할 수 없다고 말했습니다. 그래도 놀랍습니다!
Mark Duiker

지금 확인-작동합니다. 그리고 그것은 놀랍습니다. 나는 각 pdf에 대해 지불하는 서비스를 사용하고 코딩해야합니다. 이것은 문제 해결사입니다.
Sergey Sob

-29

JavaScript에서 PDF 인 메모리를 생성 할 수 있다고해도 해당 데이터를 사용자에게 전송하는 방법에 여전히 문제가 있습니다. JavaScript가 사용자에게 파일을 푸시하는 것은 어렵습니다.

파일을 사용자에게 가져 오려면 브라우저가 저장 대화 상자를 표시하도록 서버 제출을 수행하려고합니다.

그러나 PDF를 생성하는 것은 그리 어렵지 않습니다. 사양을 읽으십시오.


1
예를 들어 Data-URIs en.wikipedia.org/wiki/Data_URI_scheme 과 함께 작동하는 것 같습니다 .
Björn

58
요즘 JavaScript로 파일을 쉽게 만들 수 있습니다. (나는 미래에서 왔어요)
Derek 朕 會 功夫

5
요즘 정말 간단합니다. 예를 확인하십시오 : github.com/ChenWenBrian/FileSaver.js
roy riojas

9
당신이 당신의 대답을 삭제 @FrankKrueger, 당신은 6 포인트가 적립됩니다 : P
카밀 Kiełczewski

8
@FrankKreuger는 "사양을 읽어보십시오"라고 대답 한 적이 거의 없습니다.
Krishnan Venkiteswaran
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.