노드 도움말

JsdomNPM (개발자를 위한 작동 방식)

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

업데이트됨:6월 22, 2025

JSDOM과 IronPDF Node.js 에서 결합하면 프로그래머는 PDF 문서를 생성하고 수정하는 데 필요한 광범위한 도구를 활용할 수 있습니다. JSDOM이라는 W3C DOM의 순수 JavaScript 구현체를 사용하면 브라우저에서 가능한 것과 유사한 방식으로 서버 측에서 HTML 및 XML 문서를 조작할 수 있습니다. 반대로 IronPDF 간단한 Node.js API를 사용하여 HTML 콘텐츠에서 고품질 PDF를 더 쉽게 생성할 수 있도록 합니다.

JSDOM과 IronPDF 결합하면 개발자는 Node.js 앱 내에서 웹 페이지를 PDF로 쉽게 변환하고, 기존 PDF를 수정하고, HTML 템플릿에서 PDF 문서를 즉시 생성할 수 있습니다. 이 조합은 최신 웹 기술과의 호환성을 보장할 뿐만 아니라 문서 생성 속도를 향상시키기 때문에 강력한 PDF 생성 기능이 필요한 프로젝트에 매우 적합한 옵션입니다.

JSDOM NPM이란 무엇인가요?

JSDOM NPM (Node Package Manager)은 Node.js 사용하여 HTML 문서를 구문 분석하고 작업할 수 있도록 해주는 JavaScript 라이브러리입니다. Node.js 내부에서 브라우저와 유사한 환경을 제공하며 W3C DOM(문서 객체 모델)을 지원합니다. 결과적으로 HTML 및 XML 문서의 특성과 내용을 프로그래밍 방식으로 조작할 수 있습니다. 클릭이나 양식 제출과 같은 동작도 시뮬레이션할 수 있습니다.

JSDOM NPM (개발자를 위한 작동 방식): 그림 1

JSDOM은 HTML 기반 보고서 작성, 온라인 사이트 테스트 및 검증, 웹 스크래핑과 같은 작업에 매우 유용합니다. 표준 브라우저 기능을 사용할 수 없는 서버 측 환경에서 HTML 페이지를 작업할 때 개발자에게 도움이 됩니다. JSDOM NPM 패키지는 Node.js 애플리케이션에서 HTML 조작 및 상호 작용을 처리하여 클라이언트 측 브라우저 기능과 서버 측 JavaScript 간의 간극을 메워줍니다.

Node.js 기반의 JSDOM은 다양한 강력한 웹 기능을 구현하고 있어 HTML 및 XML 문서를 다루는 서버 측 환경에서 작업하는 개발자에게 유용한 도구입니다. JSDOM의 주요 특징은 다음과 같습니다.

W3C DOM 구현

JSDOM은 W3C DOM 및 HTML 사양의 다양한 기능을 JavaScript 완벽하게 구현한 버전을 제공합니다. 이를 통해 잘 알려진 DOM API를 사용하여 HTML 및 XML 문서를 프로그래밍 방식으로 조작할 수 있습니다.

브라우저와 유사한 환경

JSDOM은 Node.js 내에서 브라우저 환경을 모방하기 때문에, 마치 브라우저에서 JavaScript 실행하는 것처럼 HTML 페이지를 조작할 수 있습니다. 이 내용은 문서 객체 모델 작업, 이벤트 관리, 스크립트 실행, 항목 접근 및 변경 등을 다룹니다.

표준 지원

HTML5, CSS3 및 최신 JavaScript 기능을 포함한 최신 웹 표준이 지원됩니다. 이를 통해 대부분의 웹 콘텐츠와의 호환성이 보장되며, 복잡한 페이지를 정확하게 조작하고 분석할 수 있습니다.

구문 분석 및 직렬화

JSDOM은 HTML 문자열을 DOM 구조로 파싱할 수 있으며, DOM 노드는 다시 HTML 문자열로 직렬화할 수 있습니다. 이는 페이지 내에서 스크립트를 실행하고 웹 페이지에서 업데이트된 HTML 출력을 편집 및 생성할 수 있도록 하기 위한 것입니다.

사용자 정의 가능한 구성

JSDOM은 외부 리소스 처리(외부 스크립트 로드 및 외부 스크립트 또는 스타일시트 실행 등), 다양한 JavaScript 엔진(V8 또는 SpiderMonkey 등) 간 전환 등 브라우저 관련 기능을 모방하도록 구성할 수 있습니다.

테스트 프레임워크와의 통합

JSDOM은 Jest 및 Mocha와 같은 테스트 프레임워크에서 DOM 조작을 포함한 단위 테스트 및 통합 테스트를 작성하는 데 널리 사용되는 도구입니다. 이를 통해 전체 브라우저 환경 없이도 웹 앱을 헤드리스 모드로 테스트할 수 있습니다.

접근성 및 호환성

이 프레임워크는 화면 낭독기와의 호환성 및 ARIA 속성 지원과 같은 접근성 기능을 갖추고 있으므로 접근성 표준을 준수해야 하는 애플리케이션에 적합합니다.

Node.js 생태계 통합

JSDOM은 다른 라이브러리 및 더 큰 Node.js 생태계와 잘 어울립니다. 예를 들어, 더 복잡한 웹 스크래핑 및 자동화 작업을 위해 Puppeteer와 같은 패키지와 함께 사용하거나 효율적인 HTML 파싱을 위해 Cheerio와 함께 사용할 수 있습니다.

JSDOM Node.js 생성 및 구성

다음 단계를 따르면 Node.js 애플리케이션에서 JSDOM을 구축하고 구성할 수 있습니다.

JSDOM을 설치하세요

먼저, 컴퓨터에 npm과 Node.js 설치되어 있는지 확인하세요. npm을 사용하여 JSDOM을 설치할 수 있습니다.

npm install jsdom

npm install jsdom

SHELL

JSDOM 기본 사용법

다음은 JSDOM 환경을 설정하고 HTML 문서를 사용하는 간단한 예입니다.

const { JSDOM } = require('jsdom');

// Example HTML content
const htmlContent = `
<!DOCTYPE html>
<html>
<head>
  <title>JSDOM Example</title>
</head>
<body>
  <div id="content">
    <p>Hello, JSDOM!</p>
  </div>
</body>
</html>
`;

// Create a JSDOM instance
const dom = new JSDOM(htmlContent);

// Access and manipulate the DOM
const document = dom.window.document;
const contentDiv = document.getElementById('content');
contentDiv.innerHTML = '<p>Hello, modified JSDOM!</p>';

// Serialize the modified DOM back to HTML
const modifiedHtml = dom.serialize();
console.log(modifiedHtml);

const { JSDOM } = require('jsdom');

// Example HTML content
const htmlContent = `
<!DOCTYPE html>
<html>
<head>
  <title>JSDOM Example</title>
</head>
<body>
  <div id="content">
    <p>Hello, JSDOM!</p>
  </div>
</body>
</html>
`;

// Create a JSDOM instance
const dom = new JSDOM(htmlContent);

// Access and manipulate the DOM
const document = dom.window.document;
const contentDiv = document.getElementById('content');
contentDiv.innerHTML = '<p>Hello, modified JSDOM!</p>';

// Serialize the modified DOM back to HTML
const modifiedHtml = dom.serialize();
console.log(modifiedHtml);

JAVASCRIPT

JSDOM NPM (개발자를 위한 작동 방식): 그림 2

구성 옵션

JSDOM 생성자는 사용자가 기능을 다양하게 사용자 정의할 수 있도록 옵션을 제공합니다. 다음은 몇 가지 일반적인 설정 선택 사항입니다.

이는 JSDOM 객체 API가 외부 리소스의 스크립트와 스타일시트를 로드하는 방식을 규정합니다. 파싱된 HTML에 포함된 스크립트를 JSDOM에서 실행할지 여부를 결정합니다. JSDOM 내부에서 실행되는 스크립트의 콘솔 출력을 캡처할 수 있도록 합니다. 브라우저의 시각적 환경을 모방하므로 여러 CSS 및 레이아웃 계산에 영향을 미칠 수 있습니다.

이 그림은 옵션을 사용하여 JSDOM 코드를 설정하는 방법을 보여주는 예시입니다.

const { JSDOM } = require('jsdom');

const htmlContent = '<!DOCTYPE html><html><body><p>Hello, JSDOM!</p></body></html>';

const options = {
  resources: 'usable', // Load external resources (e.g., scripts, stylesheets)
  runScripts: 'dangerously', // Allow scripts to run
};

const dom = new JSDOM(htmlContent, options);

// Access the document and window objects
const document = dom.window.document;
const window = dom.window;

// Manipulate the DOM or interact with the window object here
console.log(document.documentElement.outerHTML); // Output the modified HTML

const { JSDOM } = require('jsdom');

const htmlContent = '<!DOCTYPE html><html><body><p>Hello, JSDOM!</p></body></html>';

const options = {
  resources: 'usable', // Load external resources (e.g., scripts, stylesheets)
  runScripts: 'dangerously', // Allow scripts to run
};

const dom = new JSDOM(htmlContent, options);

// Access the document and window objects
const document = dom.window.document;
const window = dom.window;

// Manipulate the DOM or interact with the window object here
console.log(document.documentElement.outerHTML); // Output the modified HTML

JAVASCRIPT

고급 사용법

테스트 코드를 테스트 프레임워크와 연결하거나 사용자 상호 작용을 에뮬레이션하는 등 더 복잡한 상황에서도 JSDOM을 적용할 수 있습니다. 다음은 JSDOM과 Jest를 사용하여 테스트하는 방법을 보여주는 예시입니다.

const { JSDOM } = require('jsdom');

test('modifying DOM with JSDOM', () => {
  const dom = new JSDOM('<!DOCTYPE html><html><body><p>Hello, JSDOM!</p></body></html>');
  const document = dom.window.document;
  const contentParagraph = document.querySelector('p');

  // Assert initial content
  expect(contentParagraph.textContent).toBe('Hello, JSDOM!');

  // Modify content
  contentParagraph.textContent = 'Hello, modified JSDOM!';

  // Assert modified content
  expect(contentParagraph.textContent).toBe('Hello, modified JSDOM!');
});

const { JSDOM } = require('jsdom');

test('modifying DOM with JSDOM', () => {
  const dom = new JSDOM('<!DOCTYPE html><html><body><p>Hello, JSDOM!</p></body></html>');
  const document = dom.window.document;
  const contentParagraph = document.querySelector('p');

  // Assert initial content
  expect(contentParagraph.textContent).toBe('Hello, JSDOM!');

  // Modify content
  contentParagraph.textContent = 'Hello, modified JSDOM!';

  // Assert modified content
  expect(contentParagraph.textContent).toBe('Hello, modified JSDOM!');
});

JAVASCRIPT

시작하기

Node.js 환경에서 IronPDF 와 JSDOM을 사용하려면 HTML 정보를 PDF 문서로 변환하기 위해 이 두 라이브러리를 결합해야 합니다. JSDOM은 프로그래밍을 사용하여 HTML 문서를 다룰 수 있게 해주고, IronPDF HTML을 PDF로 더 쉽게 변환할 수 있도록 해줍니다. 시작하는 데 도움이 되는 사용 설명서입니다.

Node.js 용 IronPDF 란 무엇인가요?

Node.js 용 IronPDF HTML 텍스트에서 뛰어난 품질의 PDF 문서를 생성합니다. 원본 웹 콘텐츠의 무결성을 유지하면서 HTML, CSS 및 JavaScript 완전한 형식의 PDF로 변환하는 과정을 간소화합니다. 보고서, 송장, 인증서와 같이 동적으로 인쇄 가능한 문서를 생성해야 하는 웹 애플리케이션은 이 도구를 특히 유용하게 활용할 수 있습니다.

IronPDF 다양한 기능을 제공하는데, 그중에는 페이지 설정 조정, 머리글 및 바닥글 추가, 이미지 및 글꼴 삽입 기능 등이 있습니다. 생성된 PDF 파일이 의도한 디자인을 준수하도록 하기 위해 복잡한 레이아웃과 스타일을 지원합니다. 또한 IronPDF HTML 내부의 JavaScript 실행을 관리하여 동적이고 상호작용적인 콘텐츠를 정확하게 렌더링할 수 있도록 합니다.

JSDOM NPM (개발자를 위한 작동 방식): 그림 3

IronPDF 의 특징

HTML에서 PDF 생성

JavaScript, HTML, CSS 파일을 PDF로 변환합니다. 미디어 쿼리와 반응형 디자인을 지원하며, 이는 최신 웹 표준 두 가지입니다. HTML과 CSS를 사용하여 PDF 문서, 보고서 및 청구서를 동적으로 꾸미는 데 유용합니다.

PDF 편집

기존 PDF 파일에 텍스트, 이미지 및 기타 콘텐츠를 추가하거나, 반대로 PDF 파일에서 텍스트와 그림을 제거할 수 있습니다. 여러 개의 PDF 파일을 하나의 파일로 병합합니다. 여러 개의 PDF 파일을 각각 별도의 문서로 분할합니다. 워터마크, 주석, 머리글 및 바닥글을 포함하세요.

성능 및 신뢰성

산업 현장에서는 고성능과 신뢰성이 중요한 설계 요소입니다. IronPDF 대규모 문서 세트를 손쉽게 관리합니다.

IronPDF를 설치하세요

Node 프로젝트에서 PDF 작업을 위한 도구를 사용하려면 IronPDF 패키지를 설치하세요.

npm install @ironsoftware/ironpdf

npm install @ironsoftware/ironpdf

SHELL

JSDOM과 IronPDF 사용하여 HTML을 PDF로 변환합니다.

HTML 자료를 PDF로 변환할 수 있도록 준비하세요. 예를 들어 설명하자면:


<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Example Document</title>
  <style>
    body {
      font-family: Arial, sans-serif;
    }
    .content {
      margin: 20px;
    }
  </style>
</head>
<body>
  <div class="content">
    <h1>Hello, JSDOM with IronPDF!</h1>
    <p>This is a sample HTML document converted to PDF using JSDOM and IronPDF.</p>
  </div>
</body>
</html>


<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Example Document</title>
  <style>
    body {
      font-family: Arial, sans-serif;
    }
    .content {
      margin: 20px;
    }
  </style>
</head>
<body>
  <div class="content">
    <h1>Hello, JSDOM with IronPDF!</h1>
    <p>This is a sample HTML document converted to PDF using JSDOM and IronPDF.</p>
  </div>
</body>
</html>

HTML

JSDOM을 사용하여 HTML 콘텐츠를 구문 분석하고 IronPDF를 사용하여 PDF를 생성하는 convertToPdf.js라는 Node.js 스크립트를 만드세요.

const { JSDOM } = require('jsdom');
const IronPdf = require("@ironsoftware/ironpdf");
const fs = require('fs');

// Configure IronPDF with the license key (if applicable)
var config = IronPdf.IronPdfGlobalConfig;
config.setConfig({ licenseKey: '' });

// Load the HTML content from the file
const htmlContent = fs.readFileSync('example.html', 'utf8');

// Create a JSDOM instance and parse the HTML
const dom = new JSDOM(htmlContent);
const jdocument = dom.window.document;

// Convert the HTML to PDF
IronPdf.PdfDocument.fromHtml(jdocument.documentElement.outerHTML).then((pdfres) => {
  const filePath = `${Date.now()}.pdf`;
  pdfres.saveAs(filePath).then(() => {
    console.log('PDF saved successfully!');
  }).catch((e) => {
    console.log(e);
  });
});

const { JSDOM } = require('jsdom');
const IronPdf = require("@ironsoftware/ironpdf");
const fs = require('fs');

// Configure IronPDF with the license key (if applicable)
var config = IronPdf.IronPdfGlobalConfig;
config.setConfig({ licenseKey: '' });

// Load the HTML content from the file
const htmlContent = fs.readFileSync('example.html', 'utf8');

// Create a JSDOM instance and parse the HTML
const dom = new JSDOM(htmlContent);
const jdocument = dom.window.document;

// Convert the HTML to PDF
IronPdf.PdfDocument.fromHtml(jdocument.documentElement.outerHTML).then((pdfres) => {
  const filePath = `${Date.now()}.pdf`;
  pdfres.saveAs(filePath).then(() => {
    console.log('PDF saved successfully!');
  }).catch((e) => {
    console.log(e);
  });
});

JAVASCRIPT

JSDOM NPM (개발자를 위한 작동 방식): 그림 4

데이터베이스, 파일 또는 동적으로 생성된 콘텐츠에서 HTML 콘텐츠를 불러옵니다. 파싱된 HTML 콘텐츠에서 PDF 문서를 생성하려면 IronPDF 사용하십시오. IronPDF의 RenderHtmlAsPdf 함수는 HTML 문자열을 받아들이고, PDF 데이터가 담긴 Promise를 반환합니다. Node.js의 파일 시스템 모듈(fs)을 사용하여, IronPDF는 파일로 저장할 수 있는 버퍼(pdfBuffer)로 PDF 문서를 생성합니다. 오류 처리는 PDF 생성 중 HTML 손상이나 네트워크 문제와 같은 문제 발생 시 복원력을 보장합니다.

JSDOM NPM (개발자를 위한 작동 방식): 그림 5

결론

HTML 정보를 기반으로 고품질 PDF 문서를 프로그래밍 방식으로 생성하는 데 있어 JSDOM은 신뢰할 수 있는 옵션을 제공합니다. JSDOM을 사용하면 개발자는 가상 브라우저 환경에서 HTML 페이지를 쉽게 구문 분석하고 조작할 수 있으므로 DOM 요소와 상호 작용하고 정보를 동적으로 편집할 수 있습니다. 이 기능은 데이터 추출, 동적 보고서 생성 및 웹 스크래핑과 같은 작업에 필수적입니다.

IronPDF HTML 텍스트를 PDF로 변환하는 강력한 기능을 제공하며 레이아웃, 페이지 매김, 머리글, 바닥글 및 기타 PDF 관련 기능을 정확하게 제어할 수 있으므로 JSDOM에 훌륭한 추가 기능입니다. 이 기능을 사용하면 Node.js 앱에서 복잡한 HTML 구조를 인쇄 가능한 PDF 파일로 바로 변환하는 작업이 훨씬 쉬워집니다.

JSDOM과 IronPDF 결합하면 개발자는 HTML 템플릿이나 동적으로 생성된 정보를 기반으로 PDF 문서를 자동으로 생성할 수 있습니다. 이러한 특징 덕분에 해당 문서는 보고서, 증명서, 송장 등을 작성하는 등 다양한 용도로 활용될 수 있습니다. 이 통합은 두 라이브러리의 강점을 활용하여 생산성을 향상시키고 문서의 정확성을 유지함으로써 Node.js 생태계 내 문서 중심 애플리케이션의 고유한 요구 사항을 효율적으로 충족합니다.

IronPDF 와 Iron Software 사용하면 OCR, 바코드 스캔, PDF 생성, Excel 통합 및 기타 기능을 통해 .NET 개발 툴킷의 기능을 확장할 수 있습니다. IronPDF는 Iron Software의 고도로 구성 가능한 시스템과 스위트를 결합하여 개발자에게 추가 온라인 앱과 기능뿐만 아니라 더 효율적인 개발을 제공하며, 기본 에디션으로 $799만에 제공합니다.

라이선스 옵션이 명확하고 프로젝트에 맞춰져 있으면 개발자는 최적의 모델을 더 쉽게 선택할 수 있습니다. 이러한 기능들은 개발자들이 다양한 문제를 간편하고 효과적이며 통합된 방식으로 해결하는 데 도움을 줍니다.

다리우스 세란트

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

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

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

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

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