مكتبة Node.js مجانية لإنشاء الصور من HTML
مكتبة معالجة الصور المتقدمة مفتوحة المصدر لـ Node.js تتيح لمطوري البرمجيات إنشاء صور JPEG أو PNG من محتوى HTML مع دعم CSS وتوليد الصور دفعة واحدة عبر واجهة برمجة التطبيقات المجانية JS.
Node-HTML-to-Image هو جيم مفتوح المصدر لمطوري البرمجيات الذين يبحثون عن حل بسيط ولكنه قوي لتحويل محتوى HTML إلى صور. تم بناؤه على قمة Puppeteer، وهي مكتبة شائعة في Node.js توفر واجهة برمجة تطبيقات عالية المستوى للتحكم في متصفحات Chrome بدون واجهة مستخدم، تتيح هذه الأداة للمطورين إنشاء صور من قوالب HTML بأقل جهد وتكلفة. هناك العديد من الميزات المهمة التي تتضمنها المكتبة والتي تسهل على مطوري البرمجيات في عملية التطوير، مثل تحويل HTML الخام أو القوالب المصممة مسبقًا، وإنشاء صور مخصصة أو مدفوعة بالبيانات، ودعم تنسيق CSS، ودعم صيغ الصور المتعددة، وتوليد الصور بشكل دفعي، وتخصيص خيارات عرض Puppeteer والعديد من الميزات الأخرى.
مكتبة Node-HTML-to-Image هي وحدة Node.js تأخذ قوالب HTML وتحولها إلى ملفات صور ثابتة. المكتبة مفيدة جدًا في إنشاء لافتات، صور اقتباسات، أو محتوى ترويجي ديناميكي بناءً على بيانات المستخدم أو قوالب محددة مسبقًا. علاوة على ذلك، فهي مفيدة جدًا أيضًا لتصدير التصورات البيانية المعقدة، الرسوم البيانية، أو الجداول كصور ثابتة لتضمينها في العروض التقديمية أو التقارير. يمكن لمطوري البرمجيات تضمين صور محتوى ترويجي تم إنشاؤها في رسائل البريد الإلكتروني لضمان التوافق مع عملاء البريد الإلكتروني الذين يحظرون HTML أو CSS. مع واجهة برمجة تطبيقات خفيفة الوزن واعتماديات قليلة، فهي مثالية للتطبيقات التي تحتاج إلى إنشاء مرئيات ديناميكيًا. من خلال استكشاف هذه المكتبة ودمجها في مشاريعك، يمكنك فتح مستويات جديدة من الكفاءة والإبداع.
البدء باستخدام Node-HTML-to-Image
الطريقة الموصى بها لتثبيت مكتبة Node-HTML-to-Image هي استخدام NPM. يرجى استخدام الأمر التالي لتثبيت سلس.
تثبيت مكتبة Node-HTML-to-Image عبر NPM
npm install node-html-to-image تثبيت مكتبة Node-HTML-to-Image عبر Yarn
yarn add node-html-to-image يمكنك أيضًا تثبيته يدويًا؛ قم بتنزيل أحدث ملفات الإصدار مباشرة من مستودع GitHub.
إنشاء صورة من HTML في Node.js
أصبح توليد الصور من قوالب HTML نهجًا شائعًا في التطبيقات الحديثة. تجعل مكتبة Node-HTML-to-Image مفتوحة المصدر من السهل على مطوري البرمجيات تحويل HTML الخام أو القوالب المصممة مسبقًا إلى ملفات صور ثابتة مع بضع سطور من التعليمات البرمجية فقط. تلغي هذه الميزة الحاجة إلى مكتبات معالجة الرسوميات المعقدة وتوفر واجهة بسيطة لإنتاج المخرجات المرئية. إليك مثال يوضح كيف يمكن لمطوري البرمجيات تحويل سلسلة HTML بسيطة إلى صورة PNG داخل تطبيقات node.js.
كيفية تحويل سلسلة HTML إلى صورة PNG داخل تطبيقات Node.js؟
const nodeHtmlToImage = require('node-html-to-image');
nodeHtmlToImage({
output: './output.png',
html: 'Hello, World!
',
})
.then(() => console.log('Image successfully created!'));
عرض المحتوى الديناميكي عبر مكتبة Node.js
تسمح مكتبة Node-HTML-to-Image لمطوري البرمجيات بتمرير المتغيرات إلى القوالب، مما يمكّن من إنشاء صور مخصصة أو مدفوعة بالبيانات داخل تطبيقات Node.js. هذه الميزة مفيدة بشكل خاص للتطبيقات مثل الشهادات، والتقارير المخصصة، أو منشورات وسائل التواصل الاجتماعي. المثال أدناه يوضح كيف يتم استبدال متغير {{name}} ديناميكيًا بـ "أليس" قبل عرض الصورة داخل تطبيقات Node.js.
كيف تمرير المتغيرات ديناميكيًا إلى القالب وعرضها كصورة عبر مكتبة Node.js؟
const nodeHtmlToImage = require('node-html-to-image');
nodeHtmlToImage({
output: './personalized.png',
html: `
Hello, {{name}}!
`,
content: { name: 'Alice' },
})
.then(() => console.log('Personalized image created!'));
توليد الصور دفعة في Node.js
إن إنشاء صور متعددة في وقت واحد أمر سهل مع مكتبة Node-HTML-to-Image مفتوحة المصدر. مع بضع سطور من التعليمات البرمجية، يمكن لمطور البرمجيات إنشاء صور متعددة وفقًا لاحتياجاته. هذه الميزة مثالية للمهام الجماعية، مثل إنشاء سلسلة من الصور المخصصة لحملة تسويقية. يوضح المثال التالي كيفية إنشاء صور متعددة مع تغييرات بسيطة داخل المحتوى. هنا، كل عنصر في مصفوفة المحتوى ينشئ صورة منفصلة مع البيانات المقابلة.
كيف生成 صور متعددة من محتوى HTML داخل تطبيقات Node.js؟
const nodeHtmlToImage = require('node-html-to-image');
nodeHtmlToImage({
html: `Hello, {{name}}!
`,
content: [
{ name: 'Alice' },
{ name: 'Bob' },
{ name: 'Charlie' },
],
})
.then(() => console.log('Batch images created!'));
