JavaScript ile C# dilinde HTML'den PDF'ye nasıl dönüştürülür
IronPDF, HTML'den PDF'ye dönüşüm sırasında JavaScript yürütmeyi, Chromium işleme motorunu kullanarak mümkün kılar. Dinamik web içeriklerini, interaktif öğeleri ve dinamik işlemleri destekleyen .NET C# uygulamalarında JavaScript ve jQuery'yi PDF belgelerine dönüştürün.
JavaScript, web geliştirmede kullanılan yüksek seviyeli, çok yönlü bir programlama dilidir. Web sitelerinde etkileşimli ve dinamik özellikler sunar. jQuery, DOM manipülasyonu, olay işleme ve AJAX talepleri gibi yaygın görevleri basitleştiren bir JavaScript kütüphanesidir.
IronPDF, JavaScript'i Chromium işleme motoru aracılığıyla destekler. Bu makale, .NET C# projelerinde HTML'den PDF'ye dönüşümde JavaScript ve jQuery'nin nasıl kullanılacağını gösterir. IronPDF'i test etmek için IronPDF'in ücretsiz deneme sürümünü sunarız. Dönüşüm öncesinde HTML hata ayıklama için, HTML hata ayıklama için kılavuzumuza bakın.
HTML'yi JavaScript ile PDF'ye dönüştürmek için .NET içinde hızlı başlangıç yapın.
IronPDF kullanarak .NET projelerinde JavaScript içeren HTML sayfalarını PDF'ye dönüştürün. Chromium işleme motoru desteği ile tüm JavaScript öğeleri doğru şekilde işlenir. Bu örnek, dinamik içeriğe sahip bir web sayfasının PDF'ye nasıl dönüştürüleceğini gösterir. Tek bir yöntem çağrısı, PDF belgenizi işler ve kaydeder.
-
NuGet Paket Yöneticisi ile https://www.nuget.org/packages/IronPdf yükleyin
PM > Install-Package IronPdf -
Bu kod parçasını kopyalayıp çalıştırın.
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"); -
Canlı ortamınızda test etmek için dağıtın
Bugün projenizde IronPDF kullanmaya başlayın ücretsiz deneme ile
Temel İş Akışını Nasıl Kurabilirim?
- C# kütüphanesini indirin: HTML'yi PDF'ye Dönüştür
- JavaScript yürütmeyi etkinleştir:
EnableJavaScriptözelliğini kullanın - HTML'den PDF'ye dönüştürün: JavaScript kodunun desteklendiğinden emin olun
- Özelleştirilmiş JavaScript yürütün: .NET C# kodunuzda
- Konsol mesajlarını yakalayın: JavaScript mesaj dinleyicisi kullanarak
HTML'den PDF'ye Dönüşümde JavaScript Nasıl İşlenir?
HTML içindeki JavaScript, PDF'ye dönüştürmede desteklenir. İşleme hemen gerçekleştiğinden, JavaScript düzgün bir şekilde çalışmayabilir. WaitFor sınıfını, JavaScript yürütme süresine izin vermek için render ayarlarında yapılandırın. Aşağıdaki kod, WaitFor.JavaScript'i 500 ms maksimum bekleme süresi ile kullanır. Bekleme süreleri ve render gecikmeleri hakkında detaylar için, PDF renderini geciktirmek için WaitFor kullanma rehberimize bakın.
: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");
Imports IronPdf
Private htmlWithJavaScript As String = "<h1>This is HTML</h1>
<script>
document.write('<h1>This is JavaScript</h1>');
window.ironpdf.notifyRender();
</script>"
' Instantiate Renderer
Private renderer = New ChromePdfRenderer()
' Enable JavaScript
renderer.RenderingOptions.EnableJavaScript = True
' Set waitFor for JavaScript
renderer.RenderingOptions.WaitFor.JavaScript(500)
' Render HTML contains JavaScript
Dim pdfJavaScript = renderer.RenderHtmlAsPdf(htmlWithJavaScript)
' Export PDF
pdfJavaScript.SaveAs("javascriptHtml.pdf")
JavaScript Yürütme için WaitFor Neden Önemli?
Karmaşık JavaScript çerçeveleri, .NET'te sınırlı JavaScript yürütme belleği nedeniyle bellek tahsis ayarlamalarını gerektirebilir. WaitFor, PDF oluşturma öncesinde tam JavaScript yürütmesini sağlamak için seçenekler sunar. JavaScript yürütmesini, ağ bekleme durumlarını, HTML öğelerini veya özel işleme gecikmelerini bekleyin. PDF oluşturmayı optimize etmek için mevcut işleme seçeneklerini öğrenin.
notifyRender Yöntemini Ne Zaman Kullanmalıyım?
window.ironpdf.notifyRender() yöntemi, dinamik içerik için doğru render zamanlamasını sağlamak amacıyla JavaScript yürütmenin tamamlandığını sinyaller. Asenkron işlemler veya PDF oluşturma öncesi tamamlanması gereken animasyonlar için kullanın. Yöntem, kesin render kontrolü için WaitFor.JavaScript ayarlarıyla çalışır.
Sık Karşılaşılan JavaScript İşleme Sorunları Nelerdir?
Karmaşık çerçeveler, ek bekleme süresi veya bellek tahsisi gerektirebilir. Yaygın sorunlar şunları içerir:
- İşlem öncesi asenkron veri yüklenmeme
- Geçiş sırasında yakalanmış CSS animasyonları
- İşlemeyi engelleyen JavaScript hataları
- Ağır çerçevelerle bellek kısıtlamaları
Sorun giderme için, işleme sürecinin ayrıntılarını yakalamak üzere özel günlüğünü etkinleştirin.
PDF İşlemeden Önce Özelleştirilmiş JavaScript Nasıl Yürütülür?
Render edilmeden önce özel JavaScript yürütmek için render ayarlarındaki JavaScript özelliğini kullanın. Bu, JavaScript enjeksiyonunun mümkün olmadığı URL'leri işlerken yardımcı olur. JavaScript kodunu render ayarlarının JavaScript özelliğine atayın. asenkron PDF oluşturma ile birleştirerek birden çok belge işleyin.
: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");
Imports IronPdf
Private renderer As New ChromePdfRenderer()
' JavaScript code
renderer.RenderingOptions.Javascript = "
document.querySelectorAll('h1').forEach(function(el){
el.style.color='red';
})"
' Render HTML to PDF
Dim pdf As PdfDocument = renderer.RenderHtmlAsPdf("<h1>Happy New Year!</h1>")
pdf.SaveAs("executed_js.pdf")
Özelleştirilmiş JavaScript Enjeksiyonunu Ne Zaman Kullanmalıyım?
Özelleştirilmiş JavaScript enjeksiyonu, kaynak HTML değişikliğinin mümkün olmadığı URL'leri işlerken çalışır. Yaygın kullanımlar:
- Dönüştürmeden önce üçüncü taraf sayfaları değiştirme
- Dinamik filigranlar veya başlıklar ekleme
- Koşullu olarak öğeleri gizleme veya gösterme
- Yazdırma düzenleri için stilleri ayarlama
- İçeriği çıkarma ve yeniden düzenleme
Hangi Türde DOM Manipülasyonları Yapılabilir?
Stilleri değiştirme, öğeler ekleme, içeriği değiştirme veya işleme öncesi standart DOM işlemleri yapın. Örnekler:
- Yazdırma formatı için CSS özelliklerini değiştirme
- Gezinme öğeleri veya reklamları kaldırma
- Sayfa numaraları veya özelleştirilmiş başlıklar ekleme
- İçerik düzenini yeniden yapılandırma
- Ekstra veri veya meta veri enjeksiyonu
PDF Oluşturma Sırasında JavaScript Konsol Mesajlarını Nasıl Yakalayabilirim?
IronPDF, hata günlükleri ve özel mesajlar da dahil olmak üzere JavaScript konsol mesajlarını yakalar. Mesajları yakalamak için JavaScriptMessageListener özelliğini kullanın. Bu örnek, özel metin ve hataları günlüğe kaydetmeyi gösterir.
: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>");
Imports IronPdf
Imports System
Private renderer As New ChromePdfRenderer()
' Method callback to be invoked whenever a browser console message becomes available:
renderer.RenderingOptions.JavascriptMessageListener = Sub(message) Console.WriteLine($"JS: {message}")
' Log 'foo' to the console
renderer.RenderingOptions.Javascript = "console.log('foo');"
' Render HTML to PDF
Dim pdf As PdfDocument = 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
Dim pdf2 As PdfDocument = renderer.RenderHtmlAsPdf("<h1> Hello World </h1>")

JavaScript Konsol Mesajlarını Neden İzlemeliyim?
Konsol izleme, JavaScript hatalarını ayıklamaya ve PDF oluşturma sırasında yürütmeyi izlemeye yardımcı olur. Önemlidir çünkü:
- JavaScript hatalarını tespit ederek render engelini kaldırma
- Karmaşık JavaScript işlemlerinin ilerlemesini izleme
- Asenkron kod zamanlama sorunlarını ayıklama
- Özel JavaScript yürütmesini doğrulama
- JavaScript performans metriklerini toplama
Hangi Tür Mesajlar Yakalanabilir?
Dinleyici, özel console.log mesajlarını ve JavaScript hatalarını, şunlar dahil olmak üzere yakalar:
- Konsol çıktıları: log(), info(), warn(), error()
- Yakalanmayan istisnalar ve çalışma zamanı hataları
- Başarısız kaynaklardan ağ hataları
- Tarayıcı motoru sona erme uyarıları
- Özel hata ayıklama bilgileri
JavaScript Kütüphaneleri ile Grafik Nasıl Oluştururum?
D3.js, grafik veya resim oluşturmak için IronPDF ile iyi çalışır. D3.js (Veri Odaklı Belgeler), SVG içinde HTML5 ve CSS3 kullanarak dinamik, etkileşimli veri görselleştirmeleri için bir JavaScript kütüphanesidir. Daha fazla grafik kütüphanesi örneği için PDF'lerde grafik oluşturmaya rehberimize bakın.
Bir D3.js grafik oluşturup PDF'ye dönüştürmek için:
- Bir render nesnesi oluşturun
- JavaScript ve CSS özelliklerini ayarlayın
- HTML okumak için
RenderHTMLFileAsPdfkullanın - PDF olarak kaydedin
: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");
Imports IronPdf
Private html As String = "
<!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
Private renderer = New ChromePdfRenderer()
' Enable JavaScript
renderer.RenderingOptions.EnableJavaScript = True
' Set waitFor for JavaScript
renderer.RenderingOptions.WaitFor.JavaScript(500)
' Render HTML contains JavaScript
Dim pdfJavaScript = renderer.RenderHtmlAsPdf(html)
' Export PDF
pdfJavaScript.SaveAs("renderChart.pdf")
Hangi Grafik Kütüphaneleri IronPDF ile En İyi Çalışır?
IronPDF ile uyumlu JavaScript grafik kütüphaneleri:
- Chart.js: Temel grafikler için hafif
- Highcharts: Özelleştirme ile profesyonel grafikler
- D3.js: Görselleştirmeler için maksimum esneklik
- C3.js: D3 tabanlı yeniden kullanılabilir grafikler
- ApexCharts: Performanslı modern grafikler
Başarı için, uygun bekleme stratejilerini kullanarak PDF oluşturma öncesi grafiğin tamamlanması gerekir.
Grafik Oluşturmada Bekleme Sürelerini Ne Zaman Ayarlamalıyım?
Animasyonlar veya büyük veri kümeleri içeren karmaşık grafikler daha uzun bekleme süreleri gerektirir. Dikkate alın:
- Veri hacmi işlem süresini etkiler
- Animasyon sürelerinin tamamlanması gerekir
- Async veriler için ağ talepleri
- Grafik karmaşıklığı işlemeyi artırır
Grafik Oluşturma Sorunlarını Nasıl Çözebilirim?
Daha fazla WaitFor seçenekleri için 'C# PDF Oluşturmayı Geciktirmek için WaitFor Sınıfını Nasıl Kullanırım' bölümüne bakın. Sorun giderme adımları:
- JavaScript bekleme süresini artır
- Asenkron yükleme için
WaitFor.NetworkIdle()kullanın - PDF çıktısı için animasyonları devre dışı bırak
- JavaScript hataları için konsolu kontrol et
- Öncelikle tarayıcıda HTML'yi test et
AngularJS Uygulamalarını PDF'ye Nasıl Dönüştürürüm?
AngularJS, JavaScript tabanlı açık kaynaklı bir ön uç framework'tür. İstemci tarafı MVC ve MVVM mimarileri kullanarak tek sayfa uygulama geliştirmeyi basitleştirir. Angular to PDF kod örneği için detayları görün.
Uyumluluk için Angular Universal ile sunucu tarafı render (SSR) kullanın. Dinamik içerik üretimi nedeniyle tek sayfa uygulamaları (SPA'lar) özel işleme ihtiyaç duyar.
Angular PDF'ler için Sunucu Tarafı Render Neden Önemlidir?
Tarayıcı JavaScript bağımlılığı nedeniyle, client-side Angular SSR olmadan düzgün render edilemeyebilir. Zorluklar:
- Dinamik içerikle minimal başlangıç HTML'i
- Statik HTML'de istemci tarafı yönlendirme yok
- Sayfa yüklemesi sonrası veri bağlama
- PDF oluşturma öncesi API çağrıları tamamlanmamış
Client-Side Angular ile Hangi Kısıtlamalar Var?
Başlangıç yüklemesinden sonra dinamik içerik, doğru bekleme yapılandırması olmadan yakalanmayabilir. Kısıtlamalar:
- Asenkron olarak yüklenen bileşenler
- Tembel yüklenen modüller ve yönlendirmeler
- Animasyonlar ve geçişler
- Dinamik formlar ve etkileşimler
- Gerçek zamanlı veri güncellemeleri
Angular uygulamanızda daha uzun bekleme süreleri kullanın veya window.ironpdf.notifyRender() uygulayın.
Angular Universal ile Sunucu Tarafı Render Nasıl Çalışır?
Angular ile Angular Universal Arasındaki Fark Nedir?
Angular, tarayıcıda istemci tarafında çalışır, kullanıcı eylemlerine bağlı olarak sayfaları DOM'da render eder. Angular Universal, sunucu tarafında çalışır ve istemci üzerinde yüklenen statik sayfalar üretir. Bu, yüklemeyi iyileştirir ve tam etkileşimsellik öncesi düzen görünümünü sağlar.
PDF oluşturma farklılıkları:
- Angular: JavaScript çalıştırılması gerektirir
- Angular Universal: Önceden render edilmiş HTML sağlar
- Performans: Universal daha hızlı render eder
- Güvenilirlik: Universal, içerik erişimini garanti altına alır
PDF Oluşturma için Ne Zaman Angular Universal Tercih Edilmeli?
Client-side JavaScript bağımlılığı olmadan dinamik içerik renderini garantilemek için Angular Universal kullanın. Şunlar için idealdir:
- API verileri ile raporlar
- Tutarlı formatlama gereken belgeler
- Yüksek hacimli PDF oluşturma
- Karmaşık Angular uygulamaları
- JavaScript yürütme zaman aşımı endişeleri
Angular Universal, IronPDF dönüşümü öncesi sunucu tarafında render yaparak zamanlama sorunlarını ortadan kaldırır ve güvenilirliği artırır.
Sıkça Sorulan Sorular
HTML'yi PDF'ye dönüştürürken C# dilinde JavaScript'i nasıl etkinleştiririm?
IronPDF'de JavaScript'i etkinleştirmek için işleme seçeneklerinde EnableJavaScript özelliğini true olarak ayarlayın: new ChromePdfRenderer { RenderingOptions = { EnableJavaScript = true } }. Bu, dönüşüm sürecinde JavaScript'i yürütmek için IronPDF'nin Chromium motorunu sağlar.
PDF dönüştürme için hangi JavaScript kütüphaneleri destekleniyor?
IronPDF, jQuery, React, Vue.js ve Angular dahil olmak üzere tüm JavaScript kütüphanelerini Chromium işleme motoru aracılığıyla destekler. Bu kütüphane DOM manipülasyonunu, AJAX isteklerini ve dinamik içerik oluşturmayı modern bir web tarayıcısı gibi işleyebilir.
PDF oluşturma sırasında JavaScript yürütme zamanlamasını nasıl ele alırım?
JavaScript yürütme zamanlamasını kontrol etmek için IronPDF'nin işleme seçeneklerindeki WaitFor sınıfını kullanın. PDF oluşturma işleminden önce JavaScript'in tamamlanmasını sağlamak için maksimum bekleme süresi (örneğin, 500 ms) ile WaitFor.JavaScript() kullanabilirsiniz: WaitFor = IronPdf.Rendering.WaitFor.JavaScript(500).
HTML'den PDF'ye dönüşüm sırasında özel JavaScript kodunu çalıştırabilir miyim?
Evet, IronPDF, dönüşüm süreci sırasında .NET C# uygulamanız içinde özel JavaScript kodu çalıştırmanıza izin verir. JavaScript'i doğrudan HTML dizgisine enjekte edebilir veya özel betikleri çalıştırmak için işleme seçeneklerini kullanabilirsiniz.
PDF işlemesi sırasında JavaScript konsol mesajlarını nasıl yakalarım?
IronPDF, PDF işlemesi sırasında console.log mesajlarını ve diğer JavaScript çıktısını yakalamanıza olanak tanıyan bir JavaScript mesaj dinleyici özelliği sağlar. Bu, JavaScript yürütmeyi hata ayıklamak için yararlıdır.
Kütüphane, JavaScript desteği için hangi işleme motorunu kullanıyor?
IronPDF, Google Chrome'u güçlendiren Chromium işleme motorunu kullanır. Bu, PDF belgelerinizde modern web teknolojilerinin tam JavaScript uyumluluğunu ve doğru işlenmesini sağlar.
JavaScript'ten PDF'ye dönüşüm için test etmek amacıyla ücretsiz bir deneme mevcut mu?
Evet, IronPDF, tüm JavaScript desteğini içeren ücretsiz bir deneme sunar. JavaScript yürütme, jQuery işleme ve dinamik içerik oluşturmayı içeren tüm özellikleri lisans satın almadan önce test edebilirsiniz.

