ওপেন সোর্স জাভাস্ক্রিপ্ট পিডিএফ ভিউয়ার লাইব্রেরি
পিডিএফ ডকুমেন্ট দেখার জন্য ফ্রি ও ওপেন সোর্স জাভাস্ক্রিপ্ট লাইব্রেরি।
PDFObject কি?
PDFObject হল একটি বিনামূল্যের এবং ওপেন সোর্স জাভাস্ক্রিপ্ট লাইব্রেরি যা ওয়েব পেজে পিডিএফ ডকুমেন্ট এম্বেড করার জন্য তৈরি করা হয়েছে। এটি একটি এইচটিএমএল এম্বেড উপাদান তৈরি করে এবং তারপর এটিকে এইচটিএমএল কাঠামোতে একীভূত করে কাজ করে। এমবেড উপাদান তারপর PDF নথি রেন্ডার করে। PDFObject নিজেই একটি রেন্ডারার নয়; বরং এটি এমবেড এলিমেন্ট তৈরি এবং HTML এর মধ্যে স্থাপন করার উপর ফোকাস করে। এটি সম্পূর্ণ আকারে বা ওয়েবপৃষ্ঠার নির্দিষ্ট বিভাগের মধ্যে PDF প্রদর্শনের জন্য এম্বেড উপাদান তৈরি করতে পারে।
PDFObject-এর কিছু প্রধান বৈশিষ্ট্য নিম্নরূপ:
- ফলব্যাক মেকানিজম: PDFObject-এর একটি ফলব্যাক মেকানিজম আছে তাই যে ক্ষেত্রে একটি ব্রাউজার PDF এম্বেড করা সমর্থন করে না, PDFObject স্বয়ংক্রিয়ভাবে ফলব্যাক লজিক সক্রিয় করে যা ডেভেলপারদের প্রয়োজন অনুযায়ী PDF বা অন্য কোনো বিকল্প লজিক প্রদান করতে দেয়। .
- PDF.js ইন্টিগ্রেশন: PDFObject PDF.js এর সাথে ঐচ্ছিক ইন্টিগ্রেশন প্রদান করে, যা ডেভেলপারদের ব্রাউজারের ডিফল্ট PDF নির্বিশেষে PDF এম্বেড করতে সক্ষম করে দর্শক এই বৈশিষ্ট্যটি কার্যকর যখন ব্রাউজার HTML এ পিডিএফ নথি এম্বেড করা সমর্থন করে না।
- PDF ওপেন প্যারামিটার: PDFObject Adobe-এর মালিকানাধীন PDF ওপেন প্যারামিটার সমর্থন করে যা ডেভেলপারদের PDF প্রদর্শনের জন্য প্যারামিটার নির্দিষ্ট করতে দেয়। এর মধ্যে ভিউ মোড এবং অন্যান্য অ্যাডোব-নির্দিষ্ট সেটিংসের মত বিকল্প রয়েছে। এই সমস্ত প্যারামিটার এখানে পাওয়া যাবে।
PDFObject দিয়ে শুরু করা
আমরা npm মডিউল ব্যবহার করে PDFObject লাইব্রেরি ডাউনলোড করতে পারি:
NPM ব্যবহার করে ইনস্টল করুন
npm i pdfobject
ব্রাউজার সমর্থন যাচাইকরণের সাথে HTML এ পিডিএফ এম্বেড করুন
আমরা PDFObject লাইব্রেরি ব্যবহার করে HTML এ একটি PDF ডকুমেন্ট এম্বেড করতে পারি। প্রাথমিকভাবে আমরা পরীক্ষা করব যে ব্রাউজার PDFObject লাইব্রেরির supportsPDFs পদ্ধতি ব্যবহার করে HTML-এ PDF নথি এম্বেড করা সমর্থন করে কিনা। যদি এটি সত্য দেখায় যে এটি HTML-এ PDF এম্বেডিং সমর্থন করে তাহলে আমরা embed("document_name.pdf","#elementid") পদ্ধতি ব্যবহার করে HTML-এ PDF এম্বেড করব৷ এই ফাংশনটি HTML-এর একটি নির্দিষ্ট উপাদানে PDF এম্বেড করবে। পূর্ণ-আকারের PDF এম্বেডের জন্য আমরা কোনো এলিমেন্ট আইডি উল্লেখ করব না এবং পদ্ধতিটিকে embed("document_name.pdf") হিসেবে কল করব। যাইহোক, যদি এটি মিথ্যা নির্দেশ করে যে এটি HTML এ পিডিএফ এম্বেডিং সমর্থন করে না তাহলে আমরা প্রয়োজন অনুসারে অন্য বিকল্প যুক্তিতে চলে যাব। বিস্তারিত জানার জন্য নিচের কোড স্নিপেট দেখুন:
আউটপুট
নিম্নলিখিত আউটপুট HTML এ এমবেড করা PDF নথি প্রদর্শন করে:
একটি ফলব্যাক মেকানিজম তৈরি করুন
PDFObject ব্যবহার করে একটি ওয়েবপেজে PDF এম্বেড করার সময় আমরা একটি ফলব্যাক মেকানিজম স্থাপন করতে পারি যা সক্রিয় হয় যখন ব্রাউজারটি HTML এ PDF এম্বেড করা সমর্থন করে না। PDFObject fallbackLink নামক একটি প্যারামিটার ব্যবহার করে যাতে এম্বেড ফাংশন কল করার সময় একটি বিকল্প যুক্তি থাকে। সুতরাং, যদি একটি ব্রাউজার PDF এম্বেড করা সমর্থন না করে, fallbackLink-এ উপস্থিত কোডটি মনোনীত div উপাদানে কার্যকর করা হয়। বিস্তারিত জানার জন্য নিচের কোড স্নিপেট দেখুন:
আউটপুট
আউটপুট স্ক্রিনশট ফলব্যাক প্রক্রিয়া দ্বারা প্রদর্শিত বিষয়বস্তু প্রদর্শন করে। ফলব্যাক প্রক্রিয়াটি সক্রিয় করা হয়েছিল যখন ব্রাউজারটি HTML এ পিডিএফ এম্বেড করা সমর্থন করে না।
Adobe এর PDF ওপেন প্যারামিটার সহ PDF এম্বেড করুন
আমরা PDFObject লাইব্রেরি ব্যবহার করে কিছু খোলার পরামিতি সহ PDF এম্বেড করতে পারি। আমরা খোলার পরামিতি সহ HTML-এ PDF নথি এম্বেড করতে PDFObject.embed("myfile.pdf", "#my-container", {pdfOpenParams: { parameters }}) পদ্ধতি ব্যবহার করব . এই PDF ওপেন প্যারামিটার এর মধ্যে PDF খোলা এবং একটি নির্দিষ্ট পৃষ্ঠা নম্বরে স্ক্রোল করার মতো বৈশিষ্ট্য রয়েছে। বিস্তারিত জানার জন্য নিচের কোড স্নিপেট দেখুন:
আউটপুট
নিম্নলিখিত স্ক্রিনশটটি অতিরিক্ত প্যারামিটার সহ HTML এ এমবেড করা PDF ডকুমেন্ট দেখায় যা এম্বেড উপাদানটিকে রেন্ডার করার পরে পৃষ্ঠা নম্বর 3 এ স্ক্রোল করে:
PDF.js সংহত করে PDF এম্বেড করুন
আমরা জানি যে PDFObject HTML-এ PDF এম্বেড করার জন্য ব্রাউজারের সমর্থনের উপর নির্ভর করে কিন্তু ব্রাউজার যদি এটি সমর্থন না করে তবে এটি PDF রেন্ডার করার জন্য একটি বিকল্প পদ্ধতি প্রদান করে। বিকল্প পদ্ধতি হল PDFObject-এর সাথে PDF.js একীভূত করা। এটি করার জন্য, আমাদের সার্ভারে PDF.js সেট আপ করতে হবে এবং তারপরে আমরা ForcePDFJS: true এবং PDFJS_URL: path/to/viewer.html/in/pdf পাস করব .js প্যারামিটারগুলি এম্বেড ফাংশনে।
দ্রষ্টব্য: নীচের উদাহরণে কোড স্নিপেটে, আমরা PDF.js লাইব্রেরি ধারণকারী একটি সার্ভার তৈরি এবং শুরু করেছি যাতে http://localhost:8888 PDF.js লাইব্রেরিতে পয়েন্ট করে।
আউটপুট
নিম্নলিখিত স্ক্রিনশট PDF.js এর সাথে PDFObject একত্রিত করে রেন্ডার করা PDF নথি দেখায়:
উপসংহার
উপসংহারে, PDFObject হল একটি সহজে ব্যবহারযোগ্য JavaScript লাইব্রেরি যা HTML-এ PDF নথি এম্বেড করার জন্য। যদিও এটি একটি রেন্ডারার হিসাবে কাজ করে না এবং এম্বেড উপাদানগুলির জন্য ব্রাউজারের সমর্থনের উপর নির্ভর করে যা ব্রাউজারগুলিতে একটি ভাঙা UI এর মতো সমস্যা সৃষ্টি করতে পারে যা এম্বেড উপাদান সমর্থন করে না তবে লাইব্রেরিতে তার সমর্থন সনাক্তকরণের মাধ্যমে এই জাতীয় সমস্যাগুলি সমাধান করার বৈশিষ্ট্য রয়েছে এম্বেড উপাদান এবং ফলব্যাক প্রক্রিয়া। পিডিএফ অবজেক্টের সাথে PDF.js সংহত করে আমরা এমন ব্রাউজারগুলিতে PDF রেন্ডার করতে পারি যেগুলি এম্বেড উপাদান সমর্থন করে না। এর সীমাবদ্ধতা থাকা সত্ত্বেও, PDFObject একটি মূল্যবান টুল হিসাবে দাঁড়িয়েছে, ওয়েব পৃষ্ঠাগুলিতে PDF নথি এম্বেড এবং রেন্ডার করার জন্য।
