Bezmaksas Node.js attēlveidošanas API, lai pārveidotu HTML par attēlu
Atvērtā pirmkoda Node.js attēlu apstrādes bibliotēka, kas pilnībā atbalsta attēlu ielādi un konvertēšanu, izstrādātāji var pārvērst HTML saturu attēlos (JPEG, PNG, GIF) lietotnēs Node.js.
Strauji mainīgajā tīmekļa izstrādes pasaulē spēja pārvērst HTML attēlos paver radošu iespēju pasauli. Neatkarīgi no tā, vai tā ir sociālo mediju grafikas ģenerēšana, vizuālu atskaišu veidošana vai pielāgota satura izstrāde e-pastiem, HTML konvertēšana attēlos var racionalizēt daudzus procesus. Node-HTML-to-Image bibliotēka ir atvērtā pirmkoda rīks, kas ļauj izstrādātājiem to darīt, nodrošinot vienkāršu veidu, kā ģenerēt attēlus no HTML, izmantojot Node.js. Programmatūras izstrādātāji var izveidot satriecošus vizuālos attēlus, ģenerēt sīktēlus un pat automatizēt uzdevumus, kuriem nepieciešama attēlu ģenerēšana. Bibliotēkas daļai ir vairākas svarīgas funkcijas, piemēram, jauna attēlu ģenerēšana, HTML ielāde no ārēja avota un konvertēšana attēlā, pielāgota CSS un JavaScript pievienošana, vairāku attēlu ģenerēšana vienlaikus un tā tālāk.
Node-HTML-to-Image bibliotēka ir neticami viegli lietojama, un tā ļauj programmatūras izstrādātājiem ielādēt un pārveidot HTML virknes vai failus augstas kvalitātes attēlos, izmantojot tikai dažas koda rindiņas. Šī bibliotēka, ko izstrādājusi Frinyvonnick, izmanto Headless Chromium jaudu, izmantojot Puppeteer bibliotēku, lai HTML un CSS atveidotu PNG, JPEG vai pat WebP attēlos. Tas ļauj izstrādātājiem izveidot attēlus, kas aptver visu HTML vizuālo sarežģītību, tostarp atbalstu mūsdienu CSS, fontiem un pat JavaScript izpildei. Varat pielāgot izvadi, norādot tādas opcijas kā attēla kvalitāte, platums un augstums. Turklāt lietotāji var iegūt attēlus no tīmekļa lapām, ļaujot viņiem izveidot jaudīgas tīmekļa skrāpēšanas lietojumprogrammas. Pateicoties tās elastībai, pielāgojamībai un lietošanas vienkāršībai, nav brīnums, kāpēc izstrādātāji plūst uz šo bibliotēku.
Darba sākšana ar Node-HTML-to-Image
Ieteicamais veids, kā instalēt Node-HTML-to-Image t, ir izmantot NPM. Lūdzu, izmantojiet šo komandu, lai instalēšana noritētu vienmērīgi.
Instalējiet Node-HTML-to-Image, izmantojot NPM
npm install node-html-to-image
Instalējiet Node-HTML-to-Image, izmantojot dziju
yarn add node-html-to-image
Attēlu ģenerēšana no HTML koda iekšā Node.js
Viena no Node-HTML-to-Image bibliotēkas galvenajām priekšrocībām ir tās vienkāršība, kā arī to var viegli integrēt ar jebkuru Node.js lietojumprogrammu. Izmantojot tikai dažas koda rindiņas, programmatūras izstrādātāji var sākt ģenerēt attēlus no HTML satura savās Node.js lietojumprogrammās. Šī lietošanas vienkāršība padara to pieejamu visu prasmju līmeņu izstrādātājiem. Nākamajā piemērā bibliotēka ņem vienkāršu HTML virkni un pārvērš to par PNG attēlu. Izvades attēls image.png tiek saglabāts saknes direktorijā.
Kā ģenerēt PNG attēlu no HTML lietojumprogrammās Node.js?
const nodeHtmlToImage = require('node-html-to-image');
nodeHtmlToImage({
output: './image.png',
html: 'Hello, World!
'
})
.then(() => console.log('Image created successfully!'));
Sarežģīts HTML un CSS atbalsts
Atvērtā pirmkoda Node-HTML-to-Image funkcija neaprobežojas tikai ar pamata HTML apstrādi. Tas var apstrādāt sarežģītus HTML dokumentus ar plašu CSS stilu, kā arī JavaScript. Neatkarīgi no tā, vai izmantojat modernas CSS funkcijas, piemēram, Flexbox vai Grid, vai iegulsiet pielāgotus fontus, bibliotēka precīzi atveidos jūsu saturu attēlu failu formātos, piemēram, JPEG, PNG, WebP un daudzos citos. Šeit ir piemērs, kas parāda, kā izstrādātāji var ģenerēt attēlu no sarežģītāka HTML izkārtojuma, tostarp Flexbox stilus un pielāgotas krāsas, kā rezultātā tiek iegūts labi izstrādāts attēls.
Kā ģenerēt attēlu no sarežģītāka HTML koda lietotnēs 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!'));
Pielāgojami izvades attēlu formāti
Bibliotēka Node-HTML-to-Image atbalsta vairākus izvades attēlu formātus, tostarp PNG, JPEG un WebP. Šī elastība ļauj jums izvēlēties labāko formātu jūsu konkrētajam lietojumam neatkarīgi no tā, vai tas attiecas uz tīmekļa veiktspēju vai attēla kvalitāti. Šeit ir piemērs, kas parāda, kā lietotāji var norādīt izvadi kā JPEG attēlu, kas varētu būt noderīgs gadījumos, kad faila lielums ir jāsamazina, nepārkāpjot kvalitāti.
Kā norādīt izvades attēla formātu JPEG formātā, kamēr HTML konvertē uz attēlu pakalpojumā Node.js?
nodeHtmlToImage({
output: './output-image.jpg',
html: 'JPEG Image Example
',
type: 'jpeg'
})
.then(() => console.log('JPEG image created successfully!'));
Uzlabots attēlu renderēšanas atbalsts pakalpojumā Node.js
Node-HTML-to-Image bibliotēka ir nodrošinājusi pilnīgu atbalstu renderēšanas procesa plašai pielāgošanai. Programmatūras izstrādātāji pirms renderēšanas var definēt skata loga izmēru, ierīces mēroga faktoru un pat ievadīt pielāgotu CSS un JavaScript HTML. Nākamajā piemērā ir parādīts, kā attēls tiek renderēts ar pielāgotu skatvietas izmēru 800 x 600 pikseļi, un kvalitāte ir iestatīta uz 100, nodrošinot augstāko iespējamo attēla kvalitāti.
Kā renderēt attēlus ar pielāgotu skata loga izmēru un kvalitāti lietojumprogrammās 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!'));