ओपन सोर्स जावास्क्रिप्ट पीडीएफ व्यूअर लाइब्रेरी
इस निःशुल्क एवं मुक्त स्रोत जावास्क्रिप्ट एपीआई को पीडीएफ पार्सर, व्यूअर, रीडर और रेंडरर लाइब्रेरी के रूप में आज़माएं।
PDF.js क्या है?
PDF.js मोज़िला द्वारा विकसित एक ओपन सोर्स जावास्क्रिप्ट और HTML5 आधारित पीडीएफ व्यूअर लाइब्रेरी है जो ब्राउज़र में पीडीएफ (पोर्टेबल डॉक्यूमेंट फॉर्मेट) दस्तावेज़ों को देखने की अनुमति देता है।
PDF.js कई सुविधाओं का समर्थन करता है जो नीचे सूचीबद्ध हैं:
- पीडीएफ रेंडर करें: आप वेब ब्राउज़र में पीडीएफ दस्तावेज़ खोल और देख सकते हैं, पढ़ सकते हैं या रेंडर कर सकते हैं।
- पीडीएफ प्रिंट/सहेजें: PDF.js आपके पसंदीदा वेब ब्राउज़र से पीडीएफ दस्तावेजों को प्रिंट या सहेजने की भी अनुमति देता है।
- प्रस्तुति मोड: प्रस्तुति मोड का उपयोग करके, आप पीडीएफ पृष्ठों को पूर्ण स्क्रीन में दिखा सकते हैं और प्रस्तुति स्लाइड की तरह प्रत्येक पृष्ठ पर नेविगेट कर सकते हैं।
- पीडीएफ नेविगेशन: PDF.js आसान नेविगेशन नियंत्रण प्रदान करता है जिसका उपयोग करके आप अगले या पिछले पृष्ठों पर जा सकते हैं। आप पृष्ठ संख्या दर्ज करके किसी वांछित पृष्ठ पर भी जल्दी से जा सकते हैं।
- पीडीएफ एनोटेशन: आप पीडीएफ पृष्ठों पर पाठ, चित्र या रेखाचित्र जोड़कर पीडीएफ दस्तावेजों पर एनोटेशन भी कर सकते हैं।
- पीडीएफ पृष्ठों को घुमाएं: PDF.js का उपयोग करके, आप पीडीएफ पृष्ठों को दक्षिणावर्त या वामावर्त भी घुमा सकते हैं।
- पीडीएफ स्क्रॉल करना: PDF.js पृष्ठों को क्षैतिज या लंबवत स्क्रॉल करने के लिए अच्छे नियंत्रण प्रदान करता है।
- पीडीएफ दस्तावेज़ गुण: अंतिम लेकिन महत्वपूर्ण बात यह है कि आप PDF.js व्यूअर का उपयोग करके ब्राउज़र में पीडीएफ दस्तावेज़ों के गुण भी देख सकते हैं।
PDF.js के साथ आरंभ करना
PDF.js प्राप्त करने और अपने वेब प्रोजेक्ट्स में इसका उपयोग शुरू करने के तीन तरीके हैं।
1. स्रोत से निर्माण करें
आप GitHub से PDF.js रिपॉजिटरी को क्लोन कर सकते हैं और नीचे दिए गए चरणों का पालन करके Node.js, gulp और PDF.js निर्भरताओं को स्थापित करने के बाद इसे स्वयं बना सकते हैं:
स्थानीय मशीन पर PDF.js git रिपोजिटरी को क्लोन करें और pdf.js फ़ोल्डर पर स्विच करें
git clone https://github.com/mozilla/pdf.js.git
cd pdf.js
Node.js स्थापित करें
https://nodejs.org/en/download
गल्प पैकेज को वैश्विक स्तर पर स्थापित करें
npm install -g gulp-cli
PDF.js निर्भरताएँ स्थापित करें
npm install
गल्प सर्वर चलाएं और ब्राउज़र में http://localhost:8888/web/viewer.html पर व्यूअर खोलें
gulp server
2. पूर्व-निर्मित वितरण का उपयोग करें
PDF.js स्रोत कोड के साथ-साथ प्री-बिल्ट डिस्ट्रीब्यूशन भी प्रदान करता है जिसे आप GitHub पर PDF.js रिलीज़ पर पा सकते हैं। आप प्री-बिल्ट 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 और web। PDF.js लाइब्रेरी फ़ाइलें build फ़ोल्डर में पाई जा सकती हैं, जबकि web फ़ोल्डर में एक व्यूअर प्रोजेक्ट होता है जिसमें viewer.html, viewer.css, viewer.js और संबंधित फ़ाइलें शामिल होती हैं। यदि आप viewer.html कोड की जाँच करते हैं, तो आप देख सकते हैं कि यह build फ़ोल्डर से pdf.js लाइब्रेरी और अन्य संबंधित css और js फ़ाइलों को भी संदर्भित करता है।
आइए ब्राउज़र में viewer.html चलाकर देखें कि PDF.js व्यूअर कैसा दिखता है:
पीडीएफ दस्तावेज़ प्रस्तुत करें/देखें
PDF.js व्यूअर लाइब्रेरी का उपयोग करके ब्राउज़र में PDF दस्तावेज़ को आसानी से रेंडर या देखने के लिए, हमें script टैग का उपयोग करके अपने HTML दस्तावेज़ हेडर में PDF.js लाइब्रेरी को शामिल करना होगा, HTML बॉडी में canvas जोड़ना होगा और फिर PDF दस्तावेज़ की एसिंक्रोनस लोडिंग और रेंडरिंग को संभालने के लिए pdfjsLib और प्रॉमिस ऑब्जेक्ट्स का उपयोग करने के लिए आवश्यक जावास्क्रिप्ट कोड जोड़ना होगा।
उपरोक्त कोड नीचे दिए गए किसी भी उपयोगकर्ता इंटरफ़ेस या नियंत्रण के बिना ब्राउज़र में एक पीडीएफ दस्तावेज़ लोड करता है:
ऑनलाइन डेमो
PDF.js लाइब्रेरी की सभी विशेषताओं का पता लगाने के लिए इस पूर्ण विशेषताओं वाले online PDF.js Viewer demo को आज़माएं।
निष्कर्ष
PDF.js एक मुफ़्त और ओपन सोर्स JavaScrpit PDF व्यूअर लाइब्रेरी है, जिसका एक मज़बूत समुदाय है। यह आधुनिक और पुराने दोनों ब्राउज़र के लिए क्रॉस-ब्राउज़र समर्थन प्रदान करता है। हाँ, पुराने ब्राउज़र पर उपयोगकर्ता अनुभव आधुनिक ब्राउज़र जैसा नहीं हो सकता है, लेकिन यह एक मुफ़्त लाइब्रेरी के रूप में अभी भी अच्छा है। यह सुरक्षित और अनुकूलन योग्य है। सुविधाएँ सीमित हैं, लेकिन PDF व्यूअर के रूप में, यह बढ़िया काम करता है।
PDF.js वेब आधारित PDF व्यूअर बनाने के लिए बढ़िया API और आर्किटेक्चर प्रदान करता है। चूँकि व्यूअर में अधिक UI नियंत्रण जोड़ने में समय लगता है, इसलिए डेवलपर्स का समय बचाने के लिए PDF.js एक पूर्ण रूप से कार्यात्मक और सुविधा संपन्न PDF व्यूअर का स्रोत कोड भी प्रदान करता है जिसे आप PDF.js लाइब्रेरी वितरण पैकेज के web फ़ोल्डर में पा सकते हैं (viewer.html, viewer.js और viewer.css आदि देखें)।
