PDF 도구

JavaScript로 PDF 파일을 만드는 방법

Name: IronPDF
Brand: Iron Software
Availability: InStock
Rating: 4.87 (307 reviews)

업데이트됨:12월 11, 2025

문서 공유 분야에서 어도비가 개척한 PDF(Portable Document Format)는 텍스트가 풍부하고 시각적으로 매력적인 콘텐츠의 무결성을 보존하는 데 중요한 역할을 합니다. 일반적으로 온라인에서 PDF 파일을 열려면 전용 프로그램이 필요합니다. 오늘날의 디지털 환경에서 PDF 파일은 다양한 중요 출판물에 필수적인 요소가 되었습니다. 많은 기업들이 전문적인 문서와 청구서를 작성할 때 PDF 파일을 활용합니다. 또한 개발자들은 특정 고객 요구 사항을 충족하기 위해 PDF 생성 라이브러리를 활용하는 경우가 많습니다. 현대 도서관의 등장으로 PDF 생성 과정이 간소화되었습니다. PDF 생성이 필요한 프로젝트에 가장 적합한 라이브러리를 선택할 때는 빌드, 읽기 및 변환 기능과 같은 요소를 고려하여 원활한 통합과 최적의 성능을 보장하는 것이 중요합니다.

JavaScript 라이브러리

예를 들어, 고객이 PDF 형식의 청구서를 손쉽게 다운로드하고 인쇄할 수 있도록 하고 싶다고 가정해 보겠습니다. 또한, 청구서의 정확한 레이아웃을 유지하고 완벽한 인쇄 품질을 보장하는 것이 매우 중요합니다.

이 섹션에서는 HTML을 PDF 문서로 변환하고 생성하는 데 탁월한 성능을 발휘하는 다양한 JavaScript 라이브러리를 자세히 살펴보겠습니다. 이러한 라이브러리는 효율적이고 정확한 문서 생성 및 변환을 위한 다재다능한 도구를 제공합니다.

1. PDFKit

PDFKit은 방대한 JavaScript 라이브러리 생태계에 처음으로 출시된 PDF 라이브러리 중 하나였습니다. 이 게임은 2012년 처음 출시된 이후 인기가 크게 높아졌으며, 2021년 현재까지도 정기적인 업데이트가 이루어지고 있습니다.

PDFKit은 Webpack을 사용하여 Node 라이브러리와 웹 브라우저 모두를 지원하며, 사용자 지정 글꼴 및 이미지 삽입도 지원합니다.

하지만 비교에서 보듯이 일부 PDF 라이브러리는 사실상 PDFKit의 래퍼에 불과하며 PDFKit보다 사용하기가 조금 더 쉬울 수도 있습니다.

PDFKit에는 상위 수준 API가 제공되지 않습니다. 문서화 작업 또한 종종 어렵습니다. 예상하시다시피 익숙해지는 데 시간이 좀 걸릴 수 있으며, JavaScript 사용하여 PDF를 생성하는 것이 항상 쉬운 작업은 아니라는 것을 알게 될 수도 있습니다.

// Requiring the necessary modules for file system and PDF document creation.
const fs = require('fs');
const PDFDocument = require('pdfkit');

// Create a new PDF document instance
const doc = new PDFDocument();

// Add text content to the PDF document
doc.text('Hello world!');

// Define the output file location and start writing the PDF content to it
doc.pipe(fs.createWriteStream('Demo.pdf'));

// Finalize the PDF file
doc.end();

// Requiring the necessary modules for file system and PDF document creation.
const fs = require('fs');
const PDFDocument = require('pdfkit');

// Create a new PDF document instance
const doc = new PDFDocument();

// Add text content to the PDF document
doc.text('Hello world!');

// Define the output file location and start writing the PDF content to it
doc.pipe(fs.createWriteStream('Demo.pdf'));

// Finalize the PDF file
doc.end();

JAVASCRIPT

2. pdfmake

PDFKit은 명령형 방식을 사용하여 무언가를 생성하는 반면, pdfmake는 선언형 방식을 사용합니다. 결과적으로 pdfmake 라이브러리를 사용하면 라이브러리에 특정 결과를 달성하는 방법을 가르치는 데 시간을 낭비하는 대신 PDF 생성의 의도된 기능에 집중하는 것이 더 간단해집니다.

특정 해결책이 유망해 보일지라도 완벽하지 않을 수 있다는 점을 명심하는 것이 중요합니다. 한 가지 예로, Webpack을 사용할 때 pdfmake에 사용자 지정 글꼴을 통합하는 경우 문제가 발생할 수 있습니다. 유감스럽게도 이 특정 문제에 대한 온라인 자료는 제한적입니다. 하지만 Webpack을 사용하지 않는 경우, Git 저장소를 복제하고 글꼴 삽입 스크립트를 실행하여 사용자 지정 글꼴 통합과 관련된 잠재적인 문제를 쉽게 해결할 수 있습니다.

<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.56/pdfmake.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.56/vfs_fonts.js"></script>
</head>
<body>
    <script type="text/javascript">
        // Function to create and print a PDF document
        function CreatePdf() {
            // Define document content and styles
            var docDefinition = {
                content: [
                    { text: "Hello world" } // Text content to be included in the PDF
                ],
                defaultStyle: {}
            };
            // Create and print the PDF using pdfMake library
            pdfMake.createPdf(docDefinition).print();
        }
    </script>

    <button onclick="CreatePdf()">Print pdf</button>
</body>
</html>

<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.56/pdfmake.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.56/vfs_fonts.js"></script>
</head>
<body>
    <script type="text/javascript">
        // Function to create and print a PDF document
        function CreatePdf() {
            // Define document content and styles
            var docDefinition = {
                content: [
                    { text: "Hello world" } // Text content to be included in the PDF
                ],
                defaultStyle: {}
            };
            // Create and print the PDF using pdfMake library
            pdfMake.createPdf(docDefinition).print();
        }
    </script>

    <button onclick="CreatePdf()">Print pdf</button>
</body>
</html>

HTML

JavaScript로 PDF 파일을 생성하는 방법: 그림 1

3. IronPDF

IronPDF 개발자들이 PDF 문서를 더 쉽게 생성, 검색 및 편집할 수 있도록 만들어졌습니다. 이 프로그램은 강력한 PDF 변환기 역할을 하며 PDF 파일을 생성, 편집 및 처리하기 위한 기본 API를 제공합니다.

Node.js 용 IronPDF PDF 문서를 프로그래밍 방식으로 생성하고 사용자 지정하는 과정을 간소화합니다. 고성능 문서 처리 라이브러리의 신뢰할 수 있는 공급업체인 Iron Software 에서 개발한 IronPDF Node.js 환경에서 PDF를 생성하기 위한 강력한 솔루션을 제공합니다. 이 라이브러리는 Node.js 프로젝트와 완벽하게 통합되어 개발자에게 PDF를 쉽게 생성, 서식 지정 및 편집할 수 있는 강력한 도구를 제공합니다.

IronPDF 라이브러리는 다양한 기능을 제공합니다. 여기에는 새 PDF 문서 또는 기존 PDF 문서의 페이지를 분할하고 병합하는 기능, 기존 PDF 파일을 읽고 편집하는 기능, PDF 파일에서 이미지를 추출하는 기능, PDF 파일에 텍스트, 그래픽, 책갈피, 워터마크, 머리글 및 바닥글을 추가하는 기능이 포함되며, 이 모든 기능을 Acrobat Reader 없이 사용할 수 있습니다. CSS 및 CSS 미디어 파일로부터 PDF 문서를 생성할 수 있습니다. IronPDF 사용하면 사용자는 새 PDF 양식을 생성, 업로드 및 업데이트할 수 있을 뿐 아니라 기존 양식도 업데이트할 수 있습니다.

Node.js 용 IronPDF 의 주요 기능:

다양한 PDF 생성 기능: IronPDF 사용하면 개발자는 HTML, CSS, JavaScript, 이미지 및 기타 파일 형식을 포함한 다양한 소스에서 PDF를 생성할 수 있습니다. 이러한 유연성을 통해 특정 요구 사항에 맞춘 동적이고 시각적으로 매력적인 PDF 문서를 만들 수 있습니다.
고급 문서 사용자 지정: IronPDF 개발자가 머리글, 바닥글, 첨부 파일, 디지털 서명, 워터마크 및 책갈피와 같은 기능을 사용하여 PDF 문서를 향상시킬 수 있도록 지원합니다. 이를 통해 풍부한 콘텐츠와 인터랙티브 요소를 갖춘 전문가 수준의 PDF를 제작할 수 있습니다.
보안 기능: IronPDF 무단 접근으로부터 PDF를 보호하기 위한 강력한 보안 기능을 제공합니다. 개발자는 PDF 문서에 포함된 중요한 정보를 보호하기 위해 암호, 디지털 서명, 메타데이터 및 기타 보안 설정과 같은 보안 조치를 구현할 수 있습니다.
최적화된 성능: IronPDF 는 완벽한 멀티스레딩 및 비동기 지원을 통해 최적의 성능을 제공하도록 설계되었습니다. 이를 통해 효율적인 PDF 생성이 보장되므로 성능이 가장 중요한 미션 크리티컬 애플리케이션에 적합합니다.
포괄적인 기능 세트: PDF 문서 생성, 서식 지정 및 편집을 위한 50개 이상의 기능을 갖춘 IronPDF 모든 PDF 관련 작업에 대한 포괄적인 솔루션을 제공합니다. IronPDF 기본적인 문서 생성부터 고급 맞춤 설정 및 보안에 이르기까지 개발자의 요구를 충족하는 다양한 기능을 제공합니다.

아래 코드는 JavaScript 사용하여 HTML을 픽셀 단위로 정확한 PDF 파일로 렌더링하는 방법을 보여줍니다.

import { PdfDocument } from "@ironsoftware/ironpdf";

(async () => {
    // HTML content containing JavaScript to be executed upon rendering
    const htmlWithJavaScript = `<h1>This is HTML</h1>
    <script>
        document.write('<h1>This is JavaScript</h1>');
        window.ironpdf.notifyRender(); // Notify IronPDF when rendering is done
    </script>`;

    // Rendering options to enable JavaScript
    const renderOptions = {
        enableJavaScript: true,
    };

    // Render HTML content to a PDF
    const pdf = await PdfDocument.fromHtml(htmlWithJavaScript, { renderOptions });

    // Save the PDF to a file
    await pdf.saveAs("javascript-in-html.pdf");
})();

import { PdfDocument } from "@ironsoftware/ironpdf";

(async () => {
    // HTML content containing JavaScript to be executed upon rendering
    const htmlWithJavaScript = `<h1>This is HTML</h1>
    <script>
        document.write('<h1>This is JavaScript</h1>');
        window.ironpdf.notifyRender(); // Notify IronPDF when rendering is done
    </script>`;

    // Rendering options to enable JavaScript
    const renderOptions = {
        enableJavaScript: true,
    };

    // Render HTML content to a PDF
    const pdf = await PdfDocument.fromHtml(htmlWithJavaScript, { renderOptions });

    // Save the PDF to a file
    await pdf.saveAs("javascript-in-html.pdf");
})();

JAVASCRIPT

또한 HTML 콘텐츠의 모양을 손쉽게 수정하는 사용자 지정 JavaScript 실행할 수도 있습니다.

import { PdfDocument } from "@ironsoftware/ironpdf";

(async () => {
    // JavaScript code to change the text color of header tags to red
    const javascriptCode = "document.querySelectorAll('h1').forEach(function(el){ el.style.color = 'red'; })";

    // HTML content which will be affected by the custom JavaScript
    const htmlContent = "<h1>Happy New Year!</h1>";

    // Rendering options to enable and apply the custom JavaScript
    const renderOptions = {
        enableJavaScript: true,
        javascript: javascriptCode,
    };

    // Render HTML content to a PDF
    const pdf = await PdfDocument.fromHtml(htmlContent, { renderOptions });

    // Save the PDF with the applied JavaScript effects
    await pdf.saveAs("executed_js.pdf");
})();

import { PdfDocument } from "@ironsoftware/ironpdf";

(async () => {
    // JavaScript code to change the text color of header tags to red
    const javascriptCode = "document.querySelectorAll('h1').forEach(function(el){ el.style.color = 'red'; })";

    // HTML content which will be affected by the custom JavaScript
    const htmlContent = "<h1>Happy New Year!</h1>";

    // Rendering options to enable and apply the custom JavaScript
    const renderOptions = {
        enableJavaScript: true,
        javascript: javascriptCode,
    };

    // Render HTML content to a PDF
    const pdf = await PdfDocument.fromHtml(htmlContent, { renderOptions });

    // Save the PDF with the applied JavaScript effects
    await pdf.saveAs("executed_js.pdf");
})();

JAVASCRIPT

JavaScript로 PDF 파일을 생성하는 방법: 그림 2

다운로드 버튼을 클릭하면 위 이미지의 PDF 페이지에 표시된 것과 같은 PDF 파일이 다운로드됩니다. 생성된 PDF 파일은 아래와 같습니다.

JavaScript로 PDF 파일을 생성하는 방법: 그림 3

결론

위에 제시된 JavaScript 코드는 타인이 사용할 경우 오용 및 보안 문제를 야기할 가능성이 있다는 점을 유의해야 합니다. 웹 페이지나 웹사이트에 이러한 코드를 배치할 때는 무단 접근 및 데이터 보안 취약점과 같은 위험 요소를 반드시 고려해야 합니다. 또한, 필요한 모든 기능을 갖추지 못했을 수 있는 구형 브라우저를 지원해야 하는 필요성이나 다양한 시스템 및 브라우저와의 호환성 문제도 고려해야 합니다.

IronPDF Node.js 뿐만 아니라 .NET , Java , Python을 포함한 다른 인기 플랫폼에서도 사용할 수 있습니다. 이러한 크로스 플랫폼 호환성은 다양한 기술 스택을 사용하는 개발자에게 일관성과 유연성을 보장합니다. IronPDF 풍부한 기능, 원활한 통합 및 강력한 성능을 갖춘 Node.js 프로젝트에서 PDF 생성을 간소화하려는 개발자에게 유용한 도구입니다.

다양한 개발자의 요구를 충족하기 위해, 이 라이브러리는 무료 평가판 라이선스와 구매 가능한 추가 개발자 라이선스를 포함한 다양한 라이선스 옵션을 제공합니다. Lite 패키지는 영구 라이선스, 30일 환불 보장, 1년 소프트웨어 지원, 업그레이드 옵션을 제공합니다. 최초 구매 외에는 추가 비용이 발생하지 않습니다.

다리우스 세란트

지금 바로 엔지니어링 팀과 채팅하세요

풀스택 소프트웨어 엔지니어 (웹 운영)

다리우스 세런트는 마이애미 대학교에서 컴퓨터 과학 학사 학위를 받았으며, Iron Software에서 풀 스택 웹 운영 마케팅 엔지니어로 근무하고 있습니다. 어린 시절부터 코딩에 매료되었던 그는 컴퓨팅이 신비로우면서도 접근하기 쉬운 분야라고 생각했고, 창의력과 문제 해결 능력을 발휘하기에 완벽한 매체라고 여겼습니다.

Iron Software에서 다리우스는 새로운 것을 만들고 복잡한 개념을 단순화하여 더 쉽게 이해할 수 있도록 하는 것을 즐깁니다. 그는 사내 개발자로서 학생들을 가르치는 데에도 자원하여 차세대 인재들과 전문 지식을 공유하고 있습니다.

다리우스에게 있어 그의 일은 가치 있고 실질적인 영향을 미치기 때문에 보람 있는 일입니다.