1. Produk
  2.   Imej
  3.   Node.js
  4.   Node-HTML-to-Image
 
  

API Pengimejan Node.js Percuma untuk Menukar HTML kepada Imej

Perpustakaan Pemprosesan Imej Node.js Sumber Terbuka Sepenuhnya Menyokong Pemuatan dan Penukaran Imej, Pembangun boleh Menukar Kandungan HTML kepada Imej (JPEG, PNG, GIF) di dalam Apl Node.js.

Dalam dunia pembangunan web yang pesat berubah, keupayaan untuk menukar HTML kepada imej membuka dunia kemungkinan kreatif. Sama ada ia menjana grafik media sosial, mencipta laporan visual atau mereka bentuk kandungan tersuai untuk e-mel, menukar HTML kepada imej boleh menyelaraskan banyak proses. Pustaka Node-HTML-to-Image ialah alat sumber terbuka yang membolehkan pembangun melakukan perkara itu, menyediakan cara yang mudah untuk menjana imej daripada HTML menggunakan Node.js. Pembangun Perisian boleh mencipta visual yang menakjubkan, menjana imej kecil, dan juga mengautomasikan tugas yang memerlukan penjanaan imej. Terdapat beberapa bahagian ciri penting perpustakaan, seperti penjanaan imej baharu, memuatkan HTML daripada sumber luaran dan menukarnya kepada imej, menambah CSS dan JavaScript tersuai, menjana berbilang imej sekaligus dan seterusnya.

Pustaka Node-HTML-to-Image sangat mudah digunakan dan ia membenarkan pembangun perisian untuk memuatkan dan menukar rentetan atau fail HTML kepada imej berkualiti tinggi dengan hanya beberapa baris kod. Dibangunkan oleh Frinyvonnick, pustaka ini memanfaatkan kuasa Chromium Tanpa Kepala melalui pustaka Puppeteer untuk menjadikan HTML dan CSS ke dalam imej PNG, JPEG atau WebP. Ini membolehkan pembangun mencipta imej yang menangkap kerumitan visual penuh HTML, termasuk sokongan untuk CSS moden, fon dan juga pelaksanaan JavaScript. Anda boleh menyesuaikan output dengan menentukan pilihan seperti kualiti imej, lebar dan ketinggian. Selain itu, pengguna boleh mengekstrak imej daripada halaman web, membolehkan mereka membina aplikasi mengikis web yang berkuasa. Dengan fleksibiliti, kebolehsesuaian dan kemudahan penggunaannya, tidak hairanlah mengapa pembangun berpusu-pusu ke perpustakaan ini.

Previous Next

Bermula dengan Node-HTML-to-Image

Cara yang disyorkan untuk memasang Node-HTML-to-Image t menggunakan NPM. Sila gunakan arahan berikut untuk pemasangan yang lancar.

Pasang Node-HTML-ke-Imej melalui NPM

npm install node-html-to-image

Install Node-HTML-to-Image via Yarn

yarn add node-html-to-image

Penjanaan Imej daripada Kod HTML di dalam Node.js

Salah satu kekuatan utama perpustakaan Node-HTML-to-Image ialah kesederhanaannya serta boleh disepadukan dengan mudah dengan mana-mana aplikasi Node.js. Dengan hanya beberapa baris kod, pembangun perisian boleh mula menjana imej daripada kandungan HTML di dalam aplikasi Node.js mereka sendiri. Kemudahan penggunaan ini menjadikannya boleh diakses oleh pembangun semua peringkat kemahiran. Dalam contoh berikut, pustaka mengambil rentetan HTML ringkas dan menukarnya kepada imej PNG. Imej output, image.png, disimpan dalam direktori akar.

Bagaimana untuk Menjana Imej PNG daripada HTML di dalam Apl Node.js?

const nodeHtmlToImage = require('node-html-to-image');

nodeHtmlToImage({
  output: './image.png',
  html: '
Hello, World!
'
})
  .then(() => console.log('Image created successfully!'));

Sokongan HTML dan CSS yang Kompleks

Sumber terbuka Node-HTML-to-Image tidak terhad kepada pemprosesan HTML asas. Ia boleh mengendalikan dokumen HTML yang kompleks dengan penggayaan CSS yang meluas serta JavaScript. Sama ada anda menggunakan ciri CSS moden seperti Flexbox atau Grid, atau membenamkan fon tersuai, perpustakaan akan menjadikan kandungan anda dalam format fail imej dengan tepat seperti JPEG, PNG, WebP dan banyak lagi. Berikut ialah contoh yang menunjukkan cara pembangun boleh menjana imej daripada reka letak HTML yang lebih kompleks, termasuk gaya untuk Flexbox dan warna tersuai, menghasilkan imej yang direka bentuk dengan baik.

Bagaimana untuk Menjana Imej Daripada Kod HTML yang Lebih Kompleks dalam Apl Node.js?

const nodeHtmlToImage = require('node-html-to-image');

const htmlContent = `

  
    

      

        
Welcome to My Website

        
Building the web, one pixel at a time.

      

    

  
`;

nodeHtmlToImage({
  output: './welcome-image.png',
  html: htmlContent
})
  .then(() => console.log('Complex layout image created successfully!'));

Format Imej Output Boleh Disesuaikan

Pustaka Node-HTML-to-Image menyokong berbilang format imej output, termasuk PNG, JPEG dan WebP. Fleksibiliti ini membolehkan anda memilih format terbaik untuk kes penggunaan khusus anda, sama ada untuk prestasi web atau kualiti imej. Berikut ialah contoh yang menunjukkan cara pengguna boleh menentukan output sebagai imej JPEG, yang mungkin berguna untuk senario di mana saiz fail perlu diminimumkan tanpa menjejaskan kualiti terlalu banyak.

Bagaimana untuk Menentukan Format Imej Output kepada JPEG manakala HTML kepada Penukaran Imej dalam Node.js?

nodeHtmlToImage({
  output: './output-image.jpg',
  html: '
JPEG Image Example
',
  type: 'jpeg'
})
  .then(() => console.log('JPEG image created successfully!'));

Sokongan Pemberian Imej Terperinci dalam Node.js

Pustaka Node-HTML-to-Image telah menyediakan sokongan lengkap untuk menyesuaikan proses pemaparan secara meluas. Pembangun perisian boleh menentukan saiz port pandangan, faktor skala peranti dan juga menyuntik CSS dan JavaScript tersuai ke dalam HTML sebelum pemaparan. Contoh berikut menunjukkan cara imej dipaparkan dengan saiz port pandangan tersuai 800x600 piksel, dan kualiti ditetapkan kepada 100, memastikan kualiti imej setinggi mungkin.

Bagaimana untuk Memaparkan Imej dengan Saiz & Kualiti Viewport Tersuai dalam Aplikasi Node.js?

nodeHtmlToImage({
  output: './custom-image.png',
  html: '
Custom Viewport
',
  viewport: { width: 800, height: 600 },
  quality: 100
})
  .then(() => console.log('Image with custom viewport created successfully!'));
 Melayu