IronPDF 방법 자바스크립트(사용자 지정 렌더링 지연) C#에서 JavaScript를 사용하여 HTML을 PDF로 변환하는 방법 커티스 차우 업데이트됨:1월 10, 2026 다운로드 IronPDF NuGet 다운로드 DLL 다운로드 윈도우 설치 프로그램 무료 체험 시작하기 LLM용 사본 LLM용 사본 LLM용 마크다운 형식으로 페이지를 복사하세요 ChatGPT에서 열기 ChatGPT에 이 페이지에 대해 문의하세요 제미니에서 열기 제미니에게 이 페이지에 대해 문의하세요 Grok에서 열기 Grok에게 이 페이지에 대해 문의하세요 혼란 속에서 열기 Perplexity에게 이 페이지에 대해 문의하세요 공유하다 페이스북에 공유하기 트위터에 공유하기 LinkedIn에 공유하기 URL 복사 이메일로 기사 보내기 This article was translated from English: Does it need improvement? Translated View the article in English IronPDF는 Chromium 렌더링 엔진을 사용하여 HTML을 PDF로 변환하는 동안 JavaScript 실행을 지원합니다. JavaScript 및 jQuery를 포함한 동적 웹 콘텐츠를 .NET C# 애플리케이션에서 PDF 문서로 변환할 수 있으며, 대화형 요소 및 동적 렌더링을 지원합니다. 자바스크립트는 웹 개발에 사용되는 고급스럽고 다재다능한 프로그래밍 언어입니다. 웹사이트에 상호작용적이고 동적인 기능을 구현할 수 있게 해줍니다. jQuery는 DOM 조작, 이벤트 처리, AJAX 요청과 같은 일반적인 작업을 간소화하는 JavaScript 라이브러리입니다. IronPDF는 Chromium 렌더링 엔진을 통해 JavaScript를 지원합니다. 이 문서에서는 .NET C# 프로젝트에서 JavaScript와 jQuery를 사용하여 HTML을 PDF로 변환하는 방법을 보여줍니다. IronPDF는 테스트를 위해 무료 체험판을 제공합니다. 변환 전에 HTML을 디버깅하려면 Chrome을 사용한 HTML 디버깅 가이드를 참조하세요. 빠른 시작: .NET에서 JavaScript를 사용하여 HTML을 PDF로 변환 .NET 프로젝트에서 IronPDF를 사용하여 JavaScript가 포함된 HTML 페이지를 PDF로 변환합니다. 크로뮴 렌더링 엔진 지원으로 모든 자바스크립트 요소가 정확하게 처리됩니다. 이 예제는 동적 콘텐츠를 포함하여 웹 페이지를 PDF로 렌더링하는 방법을 보여줍니다. 단 한 번의 메서드 호출로 PDF 문서를 렌더링하고 저장할 수 있습니다. 지금 바로 NuGet을 사용하여 PDF 만들기를 시작하세요. NuGet 패키지 관리자를 사용하여 IronPDF를 설치하세요. PM > Install-Package IronPdf 다음 코드 조각을 복사하여 실행하세요. new IronPdf.ChromePdfRenderer { RenderingOptions = { EnableJavaScript = true, WaitFor = IronPdf.Rendering.WaitFor.JavaScript() } } .RenderHtmlAsPdf("<h1>Start</h1><script>document.write('<h1>Generated by JS</h1>');window.ironpdf.notifyRender();</script>") .SaveAs("js-rendered.pdf"); 실제 운영 환경에서 테스트할 수 있도록 배포하세요. 지금 바로 무료 체험판을 통해 프로젝트에서 IronPDF를 사용해 보세요. 30일 무료 체험 기본 워크플로우는 어떻게 설정하나요? C# 라이브러리 다운로드 : HTML을 PDF로 변환 JavaScript 실행 활성화 : EnableJavaScript 속성을 사용합니다. HTML을 PDF로 렌더링 : JavaScript 코드가 지원되는지 확인하십시오. 사용자 지정 JavaScript 실행 : .NET C# 코드 내에서 실행 콘솔 메시지 캡처 : JavaScript 메시지 리스너 사용 HTML을 PDF로 변환할 때 JavaScript를 어떻게 렌더링하나요? HTML에서 JavaScript를 사용하면 PDF로 변환할 때에도 JavaScript가 지원됩니다. 렌더링이 즉시 이루어지기 때문에 JavaScript가 제대로 실행되지 않을 수 있습니다. JavaScript 실행 시간을 허용하려면 렌더링 옵션에서 WaitFor 클래스를 구성하십시오. 다음 코드는 최대 대기 시간 500ms로 WaitFor.JavaScript를 사용합니다. 대기 시간 및 렌더링 지연에 대한 자세한 내용은 PDF 렌더링 지연을 위한 WaitFor 사용 가이드를 참조하십시오. :path=/static-assets/pdf/content-code-examples/how-to/javascript-to-pdf-render-javascript.cs using IronPdf; string htmlWithJavaScript = @"<h1>This is HTML</h1> <script> document.write('<h1>This is JavaScript</h1>'); window.ironpdf.notifyRender(); </script>"; // Instantiate Renderer var renderer = new ChromePdfRenderer(); // Enable JavaScript renderer.RenderingOptions.EnableJavaScript = true; // Set waitFor for JavaScript renderer.RenderingOptions.WaitFor.JavaScript(500); // Render HTML contains JavaScript var pdfJavaScript = renderer.RenderHtmlAsPdf(htmlWithJavaScript); // Export PDF pdfJavaScript.SaveAs("javascriptHtml.pdf"); $vbLabelText $csharpLabel JavaScript 실행에서 waitFor가 중요한 이유는 무엇일까요? 복잡한 JavaScript 프레임워크는 .NET 환경에서 JavaScript 실행 메모리가 제한적이기 때문에 메모리 할당 조정이 필요할 수 있습니다. WaitFor는 PDF 생성 전에 JavaScript가 완전히 실행되도록 보장하는 옵션을 제공합니다. JavaScript 실행, 네트워크 유휴 상태, HTML 요소 또는 사용자 지정 렌더링 지연을 기다립니다. PDF 생성 최적화를 위한 다양한 렌더링 옵션 에 대해 알아보세요. notifyRender 메서드는 언제 사용해야 할까요? window.ironpdf.notifyRender() 메서드는 JavaScript 실행이 완료되었음을 알리며, 동적 콘텐츠의 적절한 렌더링 타이밍을 보장합니다. PDF 생성 전에 완료되어야 하는 비동기 작업이나 애니메이션에 사용하십시오. 이 방법은 정확한 렌더링 제어를 위해 WaitFor.JavaScript 설정을 사용합니다. 흔히 발생하는 자바스크립트 렌더링 문제는 무엇인가요? 복잡한 프레임워크의 경우 추가 대기 시간이나 메모리 할당이 필요할 수 있습니다. 일반적인 문제점은 다음과 같습니다. 렌더링 전에 비동기 데이터가 로드되지 않음 CSS 애니메이션이 전환되는 도중에 포착되었습니다 JavaScript 오류로 인해 렌더링이 불가능합니다. 용량이 큰 프레임워크 사용 시 메모리 제약 문제 해결을 위해 렌더링 프로세스 세부 정보를 캡처하도록 사용자 지정 로깅을 활성화하십시오. PDF 렌더링 전에 사용자 지정 JavaScript를 실행하려면 어떻게 해야 하나요? 렌더링 옵션에서 JavaScript 속성을 사용하면 렌더링 전에 사용자 지정 JavaScript를 실행할 수 있습니다. 이는 자바스크립트 삽입이 불가능한 URL을 렌더링할 때 도움이 됩니다. 렌더링 옵션의 JavaScript 속성에 JavaScript 코드를 할당합니다. 여러 문서를 처리하려면 비동기 PDF 생성 기능 과 함께 사용하십시오. :path=/static-assets/pdf/content-code-examples/how-to/javascript-to-pdf-execute-javascript.cs using IronPdf; ChromePdfRenderer renderer = new ChromePdfRenderer(); // JavaScript code renderer.RenderingOptions.Javascript = @" document.querySelectorAll('h1').forEach(function(el){ el.style.color='red'; })"; // Render HTML to PDF PdfDocument pdf = renderer.RenderHtmlAsPdf("<h1>Happy New Year!</h1>"); pdf.SaveAs("executed_js.pdf"); $vbLabelText $csharpLabel 사용자 지정 JavaScript 삽입은 언제 사용해야 할까요? 사용자 지정 JavaScript 삽입은 소스 HTML 수정이 불가능한 URL을 렌더링할 때 작동합니다. 일반적인 용도: 변환 전에 타사 페이지 수정 동적 워터마크 또는 헤더 추가 조건부로 요소 숨기기 또는 표시 인쇄 레이아웃에 맞게 스타일 조정 콘텐츠 추출 및 재구성 DOM 조작에는 어떤 유형이 있나요? 렌더링 전에 스타일을 수정하거나, 요소를 추가하거나, 콘텐츠를 변경하거나, 표준 DOM 작업을 수행할 수 있습니다. 예시: 인쇄 서식에 맞게 CSS 속성을 변경합니다. 탐색 요소 또는 광고를 제거합니다. 페이지 번호 또는 사용자 지정 머리글을 추가하세요 콘텐츠 레이아웃 재구성 추가 데이터 또는 메타데이터를 삽입합니다. PDF 생성 중에 JavaScript 콘솔에 표시되는 메시지를 어떻게 캡처할 수 있나요? IronPDF는 오류 로그 및 사용자 지정 메시지를 포함한 JavaScript 콘솔 메시지를 캡처합니다. 메시지를 캡처하려면 JavascriptMessageListener 속성을 사용하십시오. 이 예시는 사용자 지정 텍스트 및 오류 로깅을 보여줍니다. :path=/static-assets/pdf/content-code-examples/how-to/javascript-to-pdf-message-listener.cs using IronPdf; using System; ChromePdfRenderer renderer = new ChromePdfRenderer(); // Method callback to be invoked whenever a browser console message becomes available: renderer.RenderingOptions.JavascriptMessageListener = message => Console.WriteLine($"JS: {message}"); // Log 'foo' to the console renderer.RenderingOptions.Javascript = "console.log('foo');"; // Render HTML to PDF PdfDocument pdf = renderer.RenderHtmlAsPdf("<h1> Hello World </h1>"); //--------------------------------------------------// // Error will be logged // message => Uncaught TypeError: Cannot read properties of null (reading 'style') renderer.RenderingOptions.Javascript = "document.querySelector('non-existent').style.color='foo';"; // Render HTML to PDF PdfDocument pdf2 = renderer.RenderHtmlAsPdf("<h1> Hello World </h1>"); $vbLabelText $csharpLabel 자바스크립트 콘솔 메시지를 모니터링해야 하는 이유는 무엇인가요? 콘솔 모니터링은 JavaScript 오류를 디버깅하고 PDF 생성 중 실행 과정을 추적하는 데 도움이 됩니다. 필수 사항: 렌더링을 방해하는 JavaScript 오류 식별 복잡한 JavaScript 작업 진행 상황 추적 비동기 코드 실행 시간 문제 디버깅 사용자 지정 JavaScript 실행 유효성 검사 자바스크립트 성능 지표 수집 어떤 유형의 메시지를 캡처할 수 있습니까? 리스너는 사용자 지정 console.log 메시지와 JavaScript 오류를 포함하여 다음과 같은 오류를 캡처합니다. 콘솔 출력: log(), info(), warn(), error() 처리되지 않은 예외 및 런타임 오류 리소스 오류로 인한 네트워크 오류 브라우저 엔진 사용 중단 경고 사용자 지정 디버깅 정보 D3.js와 같은 자바스크립트 라이브러리를 사용하여 차트를 만드는 방법은 무엇인가요? D3.js는 차트나 이미지를 생성하는 데 IronPDF와 잘 어울립니다. D3.js( Data-Driven Documents )는 HTML5 및 CSS3에서 SVG를 사용하여 동적이고 상호작용적인 데이터 시각화를 구현하는 JavaScript 라이브러리입니다. 차트 라이브러리 사용 예시는 PDF에서 차트를 렌더링하는 방법 에 대한 가이드를 참조하세요. D3.js 차트를 생성하고 PDF로 변환하려면 다음 단계를 따르세요. 렌더러 객체를 생성합니다 JavaScript 및 CSS 속성 설정 HTML을 읽으려면 RenderHTMLFileAsPdf를 사용하세요. PDF로 저장 :path=/static-assets/pdf/content-code-examples/how-to/javascript-to-pdf-render-chart.cs using IronPdf; string html = @" <!DOCTYPE html> <html> <head> <meta charset=""utf-8"" /> <title>C3 Bar Chart</title> </head> <body> <div id=""chart"" style=""width: 950px;""></div> <script src=""https://d3js.org/d3.v4.js""></script> <!-- Load c3.css --> <link href=""https://cdnjs.cloudflare.com/ajax/libs/c3/0.5.4/c3.css"" rel=""stylesheet""> <!-- Load d3.js and c3.js --> <script src=""https://cdnjs.cloudflare.com/ajax/libs/c3/0.5.4/c3.js""></script> <script> Function.prototype.bind = Function.prototype.bind || function (thisp) { var fn = this; return function () { return fn.apply(thisp, arguments); }; }; var chart = c3.generate({ bindto: '#chart', data: { columns: [['data1', 30, 200, 100, 400, 150, 250], ['data2', 50, 20, 10, 40, 15, 25]] } }); </script> </body> </html> "; // Instantiate Renderer var renderer = new ChromePdfRenderer(); // Enable JavaScript renderer.RenderingOptions.EnableJavaScript = true; // Set waitFor for JavaScript renderer.RenderingOptions.WaitFor.JavaScript(500); // Render HTML contains JavaScript var pdfJavaScript = renderer.RenderHtmlAsPdf(html); // Export PDF pdfJavaScript.SaveAs("renderChart.pdf"); $vbLabelText $csharpLabel IronPDF와 가장 잘 호환되는 차트 라이브러리는 무엇인가요? IronPDF와 호환되는 JavaScript 차트 라이브러리: Chart.js : 기본적인 차트 작성을 위한 가벼운 도구 Highcharts : 맞춤 설정이 가능한 전문가용 차트 D3.js : 시각화를 위한 최고의 유연성 C3.js : D3 기반 재사용 가능한 차트 ApexCharts : 뛰어난 성능을 자랑하는 최신 차트 솔루션 성공적인 결과를 얻으려면 적절한 대기 전략을 사용하여 PDF 생성 전에 차트 렌더링이 완료되어야 합니다. 차트 렌더링 대기 시간은 언제 조정해야 할까요? 애니메이션이 포함된 복잡한 차트나 대규모 데이터 세트는 대기 시간이 더 오래 걸립니다. 고려하다: 데이터 용량은 처리 시간에 영향을 미칩니다. 애니메이션 재생 시간이 완료되어야 합니다 비동기 데이터에 대한 네트워크 요청 차트 복잡성 증가로 처리 속도가 빨라집니다. 차트 렌더링 문제를 어떻게 해결할 수 있나요? WaitFor 클래스의 다양한 옵션에 대해서는 'C# PDF 렌더링을 지연시키기 위해 WaitFor 클래스를 사용하는 방법 '을 참조하세요. 문제 해결 단계: JavaScript 대기 시간 늘리기 비동기 로딩을 위해 WaitFor.NetworkIdle()를 사용하세요. PDF 출력 시 애니메이션을 비활성화합니다. 콘솔에서 JavaScript 오류를 확인하세요. 먼저 브라우저에서 HTML을 테스트하세요. AngularJS 애플리케이션을 PDF로 변환하는 방법은 무엇인가요? AngularJS는 자바스크립트 기반의 오픈소스 프런트엔드 프레임워크입니다. 클라이언트 측 MVC 및 MVVM 아키텍처를 사용하여 단일 페이지 애플리케이션 개발을 간소화합니다. 자세한 내용은 Angular를 PDF로 변환하는 코드 예제를 참조하세요. 호환성을 위해 Angular Universal에서 서버 측 렌더링(SSR)을 사용하십시오. 단일 페이지 애플리케이션(SPA)은 초기 로드 후 동적 콘텐츠 생성이 필요하므로 특별한 처리가 요구됩니다. Angular PDF에서 서버 측 렌더링이 중요한 이유는 무엇일까요? 브라우저의 JavaScript 의존성 때문에 SSR이 없으면 클라이언트 측 Angular가 제대로 렌더링되지 않을 수 있습니다. 과제: 동적 콘텐츠를 포함하는 최소한의 초기 HTML 정적 HTML에 클라이언트 측 라우팅이 포함되지 않음 페이지 로드 후 데이터 바인딩 PDF 생성 전에 API 호출이 완료되지 않았습니다. 클라이언트 측 Angular의 한계점은 무엇인가요? 초기 로드 후 동적 콘텐츠는 적절한 대기 설정이 없으면 캡처되지 않을 수 있습니다. 제한 사항: 비동기적으로 로드되는 구성 요소 지연 로딩 모듈 및 경로 애니메이션 및 전환 효과 역동적인 형태와 상호작용 실시간 데이터 업데이트 대기 시간을 늘리거나 Angular 애플리케이션에 window.ironpdf.notifyRender()를 구현하세요. Angular Universal에서 서버 측 렌더링은 어떻게 작동하나요? Angular와 Angular Universal의 차이점은 무엇인가요? Angular는 브라우저의 클라이언트 측에서 실행되며, 사용자의 동작에 따라 DOM에 페이지를 렌더링합니다. Angular Universal은 서버 측에서 실행되며, 클라이언트에서 부트스트랩되는 정적 페이지를 생성합니다. 이를 통해 로딩 속도가 향상되고 완전한 상호 작용이 가능해지기 전에 레이아웃을 미리 볼 수 있습니다. PDF 생성 방식의 차이점: Angular : JavaScript 실행이 필요합니다 Angular Universal : 사전 렌더링된 HTML을 제공합니다. 성능 : 유니버설 버전 렌더링 속도가 더 빠릅니다. 신뢰성 : Universal은 콘텐츠 가용성을 보장합니다. PDF 생성을 위해 Angular Universal을 선택해야 하는 경우는 언제일까요? 클라이언트 측 JavaScript 의존성 없이 동적 콘텐츠 렌더링을 보장하려면 Angular Universal을 사용하십시오. 다음과 같은 용도에 적합합니다: API 데이터를 포함한 보고서 일관된 서식이 필요한 문서 대용량 PDF 생성 복잡한 Angular 애플리케이션 자바스크립트 실행 시간 초과 문제 Angular Universal은 IronPDF 변환 전에 서버 측 렌더링을 보장하여 타이밍 문제를 제거하고 안정성을 향상시킵니다. 자주 묻는 질문 C#에서 HTML을 PDF로 변환할 때 JavaScript를 활성화하려면 어떻게 해야 하나요? IronPDF에서 JavaScript를 사용하려면 렌더링 옵션에서 EnableJavaScript 속성을 true로 설정하십시오. 예: new ChromePdfRenderer { RenderingOptions = { EnableJavaScript = true } }. 이렇게 하면 IronPDF의 Chromium 엔진이 변환 과정 중에 JavaScript를 실행할 수 있습니다. PDF 변환에 지원되는 JavaScript 라이브러리는 무엇입니까? IronPDF는 Chromium 렌더링 엔진을 통해 jQuery, React, Vue.js, Angular를 포함한 모든 JavaScript 라이브러리를 지원합니다. 이 라이브러리는 최신 웹 브라우저처럼 DOM 조작, AJAX 요청 처리, 동적 콘텐츠 생성을 수행할 수 있습니다. PDF 생성 시 자바스크립트 실행 시간을 어떻게 처리해야 할까요? IronPDF의 렌더링 옵션에서 WaitFor 클래스를 사용하여 JavaScript 실행 시간을 제어하세요. PDF 생성 전에 JavaScript가 완료되도록 최대 대기 시간(예: 500ms)을 지정하여 WaitFor.JavaScript()를 사용할 수 있습니다. WaitFor = IronPdf.Rendering.WaitFor.JavaScript(500). HTML을 PDF로 변환하는 동안 사용자 지정 JavaScript 코드를 실행할 수 있습니까? 예, IronPDF를 사용하면 변환 과정 중에 .NET C# 애플리케이션 내에서 사용자 지정 JavaScript 코드를 실행할 수 있습니다. JavaScript를 HTML 문자열에 직접 삽입하거나 렌더링 옵션을 사용하여 사용자 지정 스크립트를 실행할 수 있습니다. PDF 렌더링 중에 JavaScript 콘솔에 표시되는 메시지를 어떻게 캡처할 수 있나요? IronPDF는 PDF 렌더링 과정 중에 콘솔 로그 메시지 및 기타 JavaScript 출력을 캡처할 수 있는 JavaScript 메시지 리스너 기능을 제공합니다. 이는 JavaScript 실행 디버깅에 유용합니다. 이 라이브러리는 자바스크립트 지원을 위해 어떤 렌더링 엔진을 사용하나요? IronPDF는 Google Chrome에서 사용하는 것과 동일한 Chromium 렌더링 엔진을 사용합니다. 이를 통해 JavaScript와의 완벽한 호환성을 보장하고 PDF 문서에서 최신 웹 기술을 정확하게 렌더링할 수 있습니다. JavaScript를 이용한 PDF 변환 기능을 테스트해 볼 수 있는 무료 체험판이 있나요? 네, IronPDF는 JavaScript를 완벽하게 지원하는 무료 평가판을 제공합니다. 라이선스를 구매하기 전에 JavaScript 실행, jQuery 렌더링, 동적 콘텐츠 생성 등 모든 기능을 테스트해 볼 수 있습니다. 커티스 차우 지금 바로 엔지니어링 팀과 채팅하세요 기술 문서 작성자 커티스 차우는 칼턴 대학교에서 컴퓨터 과학 학사 학위를 취득했으며, Node.js, TypeScript, JavaScript, React를 전문으로 하는 프론트엔드 개발자입니다. 직관적이고 미적으로 뛰어난 사용자 인터페이스를 만드는 데 열정을 가진 그는 최신 프레임워크를 활용하고, 잘 구성되고 시각적으로 매력적인 매뉴얼을 제작하는 것을 즐깁니다. 커티스는 개발 분야 외에도 사물 인터넷(IoT)에 깊은 관심을 가지고 있으며, 하드웨어와 소프트웨어를 통합하는 혁신적인 방법을 연구합니다. 여가 시간에는 게임을 즐기거나 디스코드 봇을 만들면서 기술에 대한 애정과 창의성을 결합합니다. 시작할 준비 되셨나요? Nuget 다운로드 17,527,568 | 버전: 2026.2 방금 출시되었습니다 NuGet 무료 다운로드 총 다운로드 수: 17,527,568 라이선스 보기