Altbilgi içeriğine atla
NODE YARDıM

JsdomNPM (Geliştiriciler İçin Nasıl Çalışır)

Node.js'de JSDOM ve IronPDF birleştirildiğinde, programcılar PDF belgeleri oluşturmak ve değiştirmek için kapsamlı bir araç setine erişirler. W3C DOM'un saf JavaScript uygulaması olan JSDOM, HTML ve XML belgelerini tarayıcıda mümkün olan bir şekilde sunucu tarafında işleyebilmenizi mümkün kılıyor. Öte yandan, IronPDF, HTML içeriğinden yüksek kaliteli PDF oluşturmayı daha basit hale getirmek için basit Node.js API'leri kullanır.

JSDOM ve IronPDF'in birleşimi, geliştiricilerin Node.js uygulamaları içinde web sayfalarını kolayca PDF'lere dönüştürmesine, mevcut PDF'leri değiştirmesine ve HTML şablonlarından hızlıca PDF belgeleri oluşturmasına olanak tanır. Bu kombinasyon, sadece modern web teknolojileriyle uyumluluğu sağlamakla kalmayıp, belge oluşturma işlemlerini de hızlandırdığı için güçlü PDF oluşturma yetenekleri gerektiren projeler için harika bir seçenektir.

JSDOM NPM Nedir?

JSDOM NPM (Node Package Manager), Node.js'i kullanarak HTML belgelerini analiz edip çalışmanıza olanak tanıyan bir JavaScript kitaplığıdır. Node.js içinde tarayıcı benzeri bir ortam sunar ve W3C DOM (Belge Nesne Modeli) destekler. Sonuç olarak, HTML ve XML belgelerinin özelliklerini ve içeriğini programatik olarak değiştirebilirsiniz. Hatta tıklama ve form gönderimleri gibi eylemleri simüle edebilirsiniz.

⟨IMG⟩ JSDOM NPM (Geliştiriciler İçin Nasıl Çalışır): Şekil 1 ⟨/IMG⟩

JSDOM, HTML tabanlı raporlar oluşturma, web sitelerini test etme ve doğrulama ve web kazıma gibi faaliyetlerde çok yardımcıdır. Standart tarayıcı işlevlerinin bulunmadığı bir sunucu tarafı ortamında HTML sayfalarıyla çalışırken geliştiricilere yardımcı olur. JSDOM NPM paketi, HTML manipülasyonu ve etkileşimini işleyerek istemci tarafı tarayıcı işlevi ile sunucu tarafı JavaScript arasındaki boşluğu doldurur.

Node.js ortamlarında HTML ve XML belgeleri ile çalışan geliştiriciler için güçlü bir araç olarak, birçok sağlam web yeteneği uygulaması ile JSDOM yararlı bir araçtır. JSDOM'un belirgin özellikleri şunlardır:

W3C DOM Uygulaması

JSDOM, W3C DOM ve HTML spesifikasyonlarının birçoğunun kapsamlı bir JavaScript uygulamasını sunar. Bu, HTML ve XML belgelerini programatik olarak değiştirmek için tanınmış DOM API'lerini kullanmanızı sağlar.

Tarayıcıya Benzer Ortam

JSDOM, Node.js içinde bir tarayıcı ortamını taklit ettiği için, HTML sayfalarını tıpkı tarayıcıda JavaScript çalışıyor olsaydı olduğu gibi değiştirmenize olanak tanır. Bu, belge nesne modeli ile çalışma, olayları yönetme, betikleri yürütme ve nesnelere erişip onları değiştirme gibi işlemleri kapsar.

Standartlara Destek

HTML5, CSS3 ve en yeni JavaScript özellikleri gibi modern web standartları desteklenmektedir. Bu, çoğu web içeriğiyle uyumluluğu garanti eder ve karmaşık sayfaların doğru bir şekilde manipüle edilmesi ve çözümlenmesini mümkün kılar.

Çözümleme ve Seri Haline Getirme

HTML dizgeleri JSDOM tarafından DOM yapılarında çözümlenebilir ve DOM düğümleri HTML dizgelerine seri hale getirilebilir. Bu, sayfa içinde betiklerin çalıştırılmasını ve web sayfalarından güncellenmiş HTML çıktısı üretme ve editlemeyi sağlar.

Özelleştirilebilir Yapılandırma

JSDOM, dış kaynakların işlenmesi (dış betikleri yükleme veya dış betiklerin ya da stil dosyalarının yürütülmesi gibi), farklı JavaScript motorları arasında geçiş (V8 veya SpiderMonkey gibi) gibi birçok tarayıcıyla ilişkili özelliği taklit edecek şekilde yapılandırılabilir.

Test Çerçeveleriyle Entegrasyon

JSDOM, Jest ve Mocha gibi test çerçevelerinde DOM manipülasyonu içeren birim testleri ve entegrasyon testlerini yazmak için popüler bir araçtır. Tüm bir tarayıcı ortamına ihtiyaç duymadan başsız web uygulamalarını test etmenizi mümkün kılar.

Erişilebilirlik ve Uyumluluk

Erişilebilirlik özellikleri gibi ekran okuyucularla uyumluluk ve ARIA özelliklerini destekleme gibi erişilebilirlik standartlarına uyulması gereken uygulamalar için uygundur.

Node.js Ekosistemi Entegrasyonu

JSDOM, diğer kütüphaneler ve daha geniş Node.js ekosistemiyle iyi çalışır. Daha karmaşık web kazıma ve otomasyon görevleri için Puppeteer gibi paketlerle veya etkili HTML çözümleme için Cheerio ile birlikte kullanılabilir.

JSDOM Node.js'yi Oluştur ve Yapılandır

Bir Node.js uygulamasında JSDOM'u oluşturmak ve yapılandırmak için aşağıdaki adımlar kullanılabilir:

JSDOM'u Yükle

Öncelikle, bilgisayarınıza npm ve Node.js'nin kurulu olduğundan emin olun. npm, JSDOM kurulumunda kullanılabilir:

npm install jsdom
npm install jsdom
SHELL

Temel JSDOM Kullanımı

Bu, bir JSDOM ortamının ayarlanması ve bir HTML belgesiyle çalışmanın basit bir örneğidir:

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 (Geliştiriciler İçin Nasıl Çalışır): Şekil 2

Yapılandırma Seçenekleri

JSDOM yapıcısı, işlevselliğinin farklı parçalarını özelleştirmek için sağlayabileceğiniz seçenekleri kabul eder. Bunlar, genellikle yapılan birkaç kurulum seçimidir:

Dış kaynaklardan gelen betiklerin ve stil sayfalarının JSDOM nesne API'si tarafından nasıl yüklenmesi gerektiğini düzenler. Parçalanmış HTML'deki betiklerin JSDOM tarafından yürütülüp yürütülmeyeceğine karar verin. JSDOM içinde çalışan betiklerin konsol çıktılarının yakalanmasına izin verir. Tarayıcı ortamının görsel ortamını taklit eder, bu da birkaç CSS ve yerleşim hesaplamasını etkileyebilir.

Bu, seçenekler kullanılarak JSDOM kodunun ayarlanmasının bir örneğidir.

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

Gelişmiş Kullanım

Daha karmaşık durumlarda, test kodunun test çerçeveleriyle birleştirilmesi veya kullanıcı etkileşimlerinin taklit edilmesi gibi durumlarda da JSDOM uygulanabilir. İşte JSDOM ve Jest'in test için nasıl kullanılacağına dair bir örnek:

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

Başlarken

IronPDF ve JSDOM'un Node.js üzerinde çalışmasını sağlamak, HTML bilgisini PDF belgelerine dönüştürmek için bu kütüphanelerin birleştirilmesini gerektirir. JSDOM, HTML belgeleriyle programlama yoluyla çalışmanıza izin verirken, IronPDF, HTML'yi PDF'ye dönüştürmeyi kolaylaştırır. İşte başlamanız için bir kullanım kılavuzu.

IronPDF for Node.js Nedir?

IronPDF for Node.js, HTML metninden üstün kaliteye sahip PDF belgeleri üretir. Özgün web içeriğinin bütünlüğünü korurken, HTML, CSS ve JavaScript'i tam biçimlendirilmiş PDF'lere dönüştürme sürecini kolaylaştırır. Dinamik, yazdırılabilir belgeler oluşturması gereken raporlar, faturalar ve sertifikalar gibi web uygulamaları bu araçtan özellikle fayda sağlayabilir.

IronPDF'nin sunduğu birçok özellik arasında, ayarlanabilir sayfa ayarları, başlıklar, altlıklar ve görüntü ve yazı tiplerini gömme yeteneği bulunmaktadır. Üretilen PDF'lerin hedeflenen tasarım standartlarına uygun olmasını sağlamak amacıyla karmaşık düzenler ve stillere izin verir. Ayrıca, IronPDF HTML içinde JavaScript'i yürütmeyi yönetir ve dinamik, etkileşimli materyallerin kesin olarak sunulmasına olanak tanır.

JSDOM NPM (Geliştiriciler İçin Nasıl Çalışır): Şekil 3

IronPDF'nin Özellikleri

HTML'den PDF Üretimi

[79] JavaScript, HTML ve CSS'yi PDF'ye dönüştürün. Modern web standartlarının iki önemli özelliği olan medya sorgularını ve duyarlı tasarımı destekler. HTML ve CSS kullanarak PDF belgeleri, raporları ve faturaları dinamik olarak dekore etmek için yararlıdır.

PDF Düzenleme

Mevcut olan PDF'lere metin, görüntüler ve diğer içerikler eklenebilir veya alternatif olarak, bu PDF dosyalarından metin ve resimler çıkarılabilir. Çok sayıda PDF'yi bir dosyada birleştirin. PDF dosyalarını birden çok ayrı belgeye ayırın. [85] Filigranlar, yorumlamalar, sayfa üst bilgileri ve alt bilgiler dahil edin.

Performans ve Güvenilirlik

[87] Endüstriyel ortamlarda istenen yüksek performans ve güvenilirlik tasarım nitelikleridir. IronPDF büyük belge setlerini kolaylıkla yönetir.

IronPDF Yükleyin

Node projelerinde PDF'lerle çalışmak için ihtiyaç duyduğunuz araç gereçleri almak için IronPDF paketini yükleyin.

npm install @ironsoftware/ironpdf
npm install @ironsoftware/ironpdf
SHELL

JSDOM ve IronPDF Kullanarak HTML'yi PDF'ye Dönüştürün

PDF'ye dönüştürülecek HTML materyalini hazırlayın. Bir örnek olarak:


<!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 kullanarak HTML icerigini ayrıştıran ve IronPDF kullanarak bir PDF oluşturan convertToPdf.js adinda bir Node.js betigi yapin.

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 (Geliştiriciler İçin Nasıl Çalışır): Şekil 4

HTML içeriğini bir veritabanından, dosyadan veya dinamik olarak oluşturulan içerikten yükleyin. IronPDF'yi kullanarak ayrıştırılmış HTML içeriğinden bir PDF belgesi oluşturun. HTML dizesi IronPDF'nin RenderHtmlAsPdf işlevi tarafından kabul edilir ve ardından PDF verilerini içeren bir Promise döndürür. Node.js'in dosya sistemi modulu (fs) kullanılarak, IronPDF bir tampon (pdfBuffer) olarak PDF belgesini oluşturur ve bu bir dosyaya kaydedilebilir. Hata yonetimi, PDF'lerin oluşturulmasi sırasında bozulmuş HTML veya ağ zorlukları gibi sorunlar durumunda dayanıklılığı garanti eder.

JSDOM NPM (Geliştiriciler İçin Nasıl Çalışır): Şekil 5

Sonuç

Programlamayla HTML bilgisinden yüksek kaliteli PDF belgeleri oluşturmak için JSDOM güvenilir bir seçenek sunar. JSDOM ile geliştiriciler, simüle edilmiş bir tarayıcı ortamında HTML sayfalarını daha kolay bir şekilde ayrıştırarak DOM elemanlarıyla etkileşime geçebilir ve bilgileri dinamik olarak düzenleyebilirler. Bu özellik, veri çıkarma, dinamik rapor oluşturma ve web kazıma gibi işler için gereklidir.

IronPDF, HTML metinlerini PDF'lere dönüştürmek için size düzen, sayfalandırma, başlıklar, altlıklar ve diğer PDF'ye özel özellikler üzerinde kesin kontrol sağlayan güçlü yetenekleriyle JSDOM'a harika bir katkıdır. Node.js uygulamalarından karmaşık HTML yapılarının doğrudan yazdırılabilir, hazırlanmış PDF dosyalarına dönüştürülmesini kolaylaştırır.

JSDOM ve IronPDF'yi birleştirerek geliştiriciler, HTML şablonlarından veya dinamik olarak üretilen bilgiden otomatik olarak PDF belgeleri oluşturabilirler. Bu, raporlar, sertifikalar, faturalar ve daha fazlasının üretilmesi gibi çeşitli kullanım durumları için belgeleri faydalı hale getirir. Bu entegrasyon, her iki kütüphanenin güçlü yönlerini kullanarak Node.js ekosisteminde belge odaklı uygulamaların benzersiz gereksinimlerini etkin bir şekilde karşılar, yazar verimliliğini artırır ve belge bütünlüğünü korur.

IronPDF ve Iron Software, OCR, barkod tarama, PDF oluşturma, Excel entegrasyonu ve diğer özelliklerle .NET geliştirme araç setinizi genişletmenizi sağlar. IronPDF, Iron Software'in son derece yapılandırılabilir sistemlerini ve suiti çekirdek destek ile birleştirerek geliştiricilere ek çevrimiçi uygulamalar ve özellikler, daha verimli gelişim sağlar, bunların hepsi sadece temel sürüm için $799'ye sunulur.

Lisans seçeneklerinin net ve projeye uygun olduğunda, geliştiriciler en uygun modeli daha kolay seçebilirler. Bu özellikler, geliştiricilerin geniş bir yelpazedeki sorunları doğrudan, etkili ve iyi bir şekilde entegre bir şekilde çözmelerine yardımcı olur.

Darrius Serrant
Tam Yığın Yazılım Mühendisi (WebOps)

Darrius Serrant, Miami Üniversitesi'nden Bilgisayar Bilimleri lisans derecesine sahiptir ve Iron Software'de Tam Yığın WebOps Pazarlama Mühendisi olarak çalışmaktadır. Küçük yaşlardan itibaren kodlamaya ilgi duyan Darrius, bilişimi hem gizemli hem de erişilebilir buldu ve onu yaratıcılık ve problem çö...

Daha Fazlasını Oku

Iron Destek Ekibi

Haftanın 5 günü, 24 saat çevrimiçiyiz.
Sohbet
E-posta
Beni Ara