مكتبة عارض JavaScript PDF مفتوحة المصدر

ما هو PDF.js؟

PDF.js عبارة عن مكتبة عارض PDF مفتوحة المصدر تعتمد على JavaScript وHTML5 تم تطويرها بواسطة Mozilla والتي تسمح بعرض مستندات PDF (تنسيق المستندات المحمولة) في المتصفح.

يدعم PDF.js العديد من الميزات المدرجة أدناه:

• عرض ملفات PDF: يمكنك فتح وعرض أو قراءة أو عرض مستندات PDF في متصفحات الويب.
• طباعة/حفظ ملفات PDF: يسمح PDF.js أيضًا بطباعة أو حفظ مستندات PDF من متصفح الويب المفضل لديك.
• وضع العرض التقديمي: باستخدام وضع العرض التقديمي، يمكنك عرض صفحات PDF في وضع ملء الشاشة ويمكنك التنقل إلى كل صفحة مثل شريحة العرض التقديمي.
• التنقل عبر ملفات PDF: يوفر PDF.js عناصر تحكم أسهل في التنقل والتي يمكنك من خلالها الانتقال إلى الصفحات التالية أو السابقة. يمكنك أيضًا الانتقال بسرعة إلى الصفحة المطلوبة عن طريق إدخال رقم الصفحة.
• تعليق توضيحي لملف PDF: يمكنك أيضًا إضافة تعليق توضيحي إلى مستندات PDF عن طريق إضافة نص أو صور أو رسم على صفحات PDF.
• تدوير صفحات PDF: باستخدام PDF.js، يمكنك أيضًا تدوير صفحات PDF في اتجاه عقارب الساعة أو عكس اتجاه عقارب الساعة.
• تمرير ملف PDF: يوفر PDF.js عناصر تحكم رائعة لتمرير الصفحات أفقيًا أو رأسيًا وما إلى ذلك.
• خصائص مستند PDF: وأخيرًا وليس آخرًا، يمكنك أيضًا عرض خصائص مستندات PDF داخل المتصفح باستخدام عارض PDF.js.

إحصائيات جيثب

اسم:
لغة:
النجوم:
الشوك:
رخصة:
تم تحديث المستودع آخر مرة في

الشروع في العمل مع PDF.js

هناك ثلاث طرق للحصول على PDF.js والبدء في استخدامه في مشاريع الويب الخاصة بك.

1. البناء من المصدر

يمكنك استنساخ مستودع PDF.js من GitHub وإنشائه بنفسك بعد تثبيت Node.js، gulp وPDF.js التبعيات باتباع الخطوات التالية:

git clone https://github.com/mozilla/pdf.js.git
cd pdf.js

https://nodejs.org/en/download

npm install -g gulp-cli

npm install

gulp server

2. استخدم التوزيع المبني مسبقًا

يقدم PDF.js أيضًا توزيعات معدة مسبقًا بالإضافة إلى كود المصدر الذي يمكنك العثور عليه على إصدارات PDF.js على GitHub . يمكنك تنزيل مكتبة PDF.js المعدة مسبقًا والبدء في استخدامها.

3. استخدم المكتبة المستضافة عبر CDN

تتم استضافة PDF.js أيضًا على خوادم CDN المجانية. تتم مشاركة بعض الروابط أدناه:

• https://cdnjs.com/libraries/pdf.js
• https://www.jsdelivr.com/package/npm/pdfjs-dist
• https://unpkg.com/pdfjs-dist

قم بتشغيل عارض PDF.js

بعد تنزيل واستخراج مكتبة التوزيع المعدة مسبقًا من GitHub، ستجد مجلدين: build والويب. يمكن العثور على ملفات مكتبة PDF.js في مجلد build حيث يحتوي مجلد web على مشروع عارض يتضمن viewer.html وviewer.css وviewer.js والملفات ذات الصلة. إذا قمت بفحص كود viewer.html، فيمكنك أن ترى أنه يشير إلى مكتبة pdf.js من مجلد البناء وملفات CSS وJS الأخرى ذات الصلة أيضًا.

لنقم بتشغيل viewer.html في المتصفح لنرى كيف يبدو عارض PDF.js:

عرض/عرض مستندات PDF

لعرض أو عرض مستند PDF في المتصفح باستخدام مكتبة عارض PDF.js، يجب علينا تضمين مكتبة PDF.js في رأس مستند HTML الخاص بنا باستخدام علامة script، وإضافة لوحة canvas إلى نص HTML ثم قم بإضافة تعليمات JavaScript البرمجية الضرورية لاستخدام pdfjsLib والكائنات الواعدة للتعامل مع التحميل والعرض غير المتزامنين لمستند PDF.

يقوم الكود أعلاه بتحميل مستند PDF في المتصفح دون أي واجهة مستخدم أو عناصر تحكم على النحو التالي:

العرض التوضيحي عبر الإنترنت

جرّب هذا عبر الإنترنت العرض التجريبي لعارض PDF.js لاستكشاف جميع ميزات مكتبة PDF.js.

خاتمة

PDF.js هي مكتبة عارض JavaScrpit PDF مجانية ومفتوحة المصدر ولها مجتمع قوي. يوفر دعمًا عبر المتصفحات لكل من المتصفحات الحديثة والقديمة. نعم، قد لا تكون تجربة المستخدم على المتصفحات القديمة مثل المتصفحات الحديثة ولكنها لا تزال جيدة كمكتبة مجانية. إنها آمنة وقابلة للتخصيص. الميزات محدودة ولكن كمتصفح PDF، فهو يعمل بشكل رائع.

يوفر PDF.js واجهات برمجة التطبيقات والهندسة المعمارية الرائعة لإنشاء عارض PDF قائم على الويب. نظرًا لأن إضافة المزيد من عناصر تحكم واجهة المستخدم إلى العارض يستغرق وقتًا طويلاً لتوفير وقت المطورين، فإن PDF.js يوفر أيضًا كود مصدر لبرنامج PDF يعمل بكامل طاقته وغني بالميزات والذي يمكنك العثور عليه (راجع viewer.html وviewer.js و viewer.css وما إلى ذلك) في مجلد الويب الخاص بحزمة توزيع مكتبة PDF.js.

منتجات مماثلة