Βιβλιοθήκη προγράμματος προβολής PDF JavaScript ανοιχτού κώδικα

Τι είναι το PDFObject;

Το PDFObject είναι μια δωρεάν και ανοιχτού κώδικα βιβλιοθήκη JavaScript που αναπτύχθηκε για την ενσωμάτωση εγγράφων PDF σε ιστοσελίδες. Λειτουργεί δημιουργώντας ένα στοιχείο ενσωμάτωσης HTML και στη συνέχεια ενσωματώνοντάς το στη δομή HTML. Στη συνέχεια, το στοιχείο ενσωμάτωσης αποδίδει το έγγραφο PDF. Το PDFObject δεν είναι το ίδιο το renderer. Μάλλον εστιάζει στη δημιουργία του στοιχείου ενσωμάτωσης και στην τοποθέτησή του εντός του HTML. Μπορεί να δημιουργήσει στοιχεία ενσωμάτωσης για την εμφάνιση αρχείων PDF σε πλήρες μέγεθος ή εντός καθορισμένων ενοτήτων της ιστοσελίδας.

Ακολουθούν μερικά από τα κύρια χαρακτηριστικά του PDFObject:

• Μηχανισμός εναλλακτικής λύσης: Το PDFObject διαθέτει εναλλακτικό μηχανισμό, επομένως, σε περιπτώσεις όπου ένα πρόγραμμα περιήγησης δεν υποστηρίζει την ενσωμάτωση αρχείων PDF, το PDFObject ενεργοποιεί αυτόματα την εναλλακτική λογική επιτρέποντας στους προγραμματιστές να παρέχουν είτε έναν σύνδεσμο προς το PDF είτε οποιαδήποτε άλλη εναλλακτική λογική όπως απαιτείται .
• Ενσωμάτωση PDF.js: Το PDFObject παρέχει προαιρετική ενοποίηση με το PDF.js, επιτρέποντας στους προγραμματιστές να ενσωματώνουν αρχεία PDF ανεξάρτητα από το προεπιλεγμένο PDF του προγράμματος περιήγησης θεατής. Αυτή η δυνατότητα είναι χρήσιμη όταν το πρόγραμμα περιήγησης δεν υποστηρίζει την ενσωμάτωση εγγράφων PDF σε HTML.
• Παράμετροι ανοιχτού PDF: Το PDFObject υποστηρίζει τις ιδιόκτητες Παράμετροι ανοιχτού PDF της Adobe που επιτρέπουν στους προγραμματιστές να καθορίζουν παραμέτρους για την εμφάνιση PDF. Αυτό περιλαμβάνει επιλογές όπως η λειτουργία προβολής και άλλες ρυθμίσεις ειδικά για την Adobe. Μπορείτε να βρείτε όλες αυτές τις παραμέτρους εδώ.

Στατιστικά GitHub

Ονομα:
Γλώσσα:
Αστέρια:
Πιρούνια:
Αδεια:
Το αποθετήριο ενημερώθηκε τελευταία φορά στις

Ξεκινώντας με το PDFObject

Μπορούμε να κατεβάσουμε τη βιβλιοθήκη PDFObject χρησιμοποιώντας τη λειτουργική μονάδα npm:

npm i pdfobject

Ενσωματώστε το PDF σε HTML με Επαλήθευση υποστήριξης προγράμματος περιήγησης

Μπορούμε να ενσωματώσουμε ένα έγγραφο PDF σε HTML χρησιμοποιώντας τη βιβλιοθήκη PDFObject. Αρχικά θα ελέγξουμε αν το πρόγραμμα περιήγησης υποστηρίζει την ενσωμάτωση του εγγράφου PDF σε HTML χρησιμοποιώντας τη μέθοδο supportsPDFs της βιβλιοθήκης PDFObject. Εάν επιστρέψει true υποδεικνύοντας ότι υποστηρίζει την ενσωμάτωση PDF σε HTML, τότε θα ενσωματώσουμε το PDF στο HTML χρησιμοποιώντας τη μέθοδο embed("document_name.pdf","#elementid"). Αυτή η συνάρτηση θα ενσωματώσει το PDF σε ένα συγκεκριμένο στοιχείο στο HTML. Για την ενσωμάτωση PDF πλήρους μεγέθους δεν θα αναφέρουμε κανένα αναγνωριστικό στοιχείου και θα καλέσουμε τη μέθοδο ως embed("document_name.pdf"). Ωστόσο, εάν επιστρέψει false υποδεικνύοντας ότι δεν υποστηρίζει την ενσωμάτωση PDF σε HTML, τότε θα μετακινηθούμε σε άλλη εναλλακτική λογική όπως απαιτείται. Ελέγξτε το παρακάτω απόσπασμα κώδικα για λεπτομέρειες:

Παραγωγή

Η ακόλουθη έξοδος εμφανίζει το έγγραφο PDF που είναι ενσωματωμένο στο HTML:

Δημιουργήστε έναν μηχανισμό επιστροφής

Μπορούμε να δημιουργήσουμε έναν εναλλακτικό μηχανισμό κατά την ενσωμάτωση ενός PDF σε μια ιστοσελίδα χρησιμοποιώντας το PDFObject που ενεργοποιείται όταν το πρόγραμμα περιήγησης δεν υποστηρίζει την ενσωμάτωση PDF σε HTML. Το PDFObject χρησιμοποιεί μια παράμετρο που ονομάζεται fallbackLink η οποία περιέχει μια εναλλακτική λογική κατά την κλήση της συνάρτησης ενσωμάτωση. Επομένως, εάν ένα πρόγραμμα περιήγησης δεν υποστηρίζει την ενσωμάτωση αρχείων PDF, ο κώδικας που υπάρχει στο fallbackLink εκτελείται στο καθορισμένο στοιχείο div. Ελέγξτε το παρακάτω απόσπασμα κώδικα για λεπτομέρειες:

Παραγωγή

Το στιγμιότυπο οθόνης εξόδου εμφανίζει το περιεχόμενο που εμφανίζεται από τον εναλλακτικό μηχανισμό. Ο εναλλακτικός μηχανισμός ενεργοποιήθηκε όταν το πρόγραμμα περιήγησης δεν υποστήριζε την ενσωμάτωση αρχείων PDF σε HTML.

Ενσωματώστε το PDF με τις Ανοικτές Παραμέτρους PDF της Adobe

Μπορούμε να ενσωματώσουμε αρχεία PDF μαζί με ορισμένες παραμέτρους ανοίγματος χρησιμοποιώντας τη βιβλιοθήκη PDFObject. Θα χρησιμοποιήσουμε τη μέθοδο PDFObject.embed("myfile.pdf", "#my-container", {pdfOpenParams: { parameters }}) για να ενσωματώσουμε το έγγραφο PDF στο HTML μαζί με τις παραμέτρους ανοίγματος . Αυτές οι Παράμετροι ανοιχτού PDF περιλαμβάνουν λειτουργίες όπως το άνοιγμα του PDF και η κύλιση σε έναν συγκεκριμένο αριθμό σελίδας. Ελέγξτε το παρακάτω απόσπασμα κώδικα για λεπτομέρειες:

Παραγωγή

Το ακόλουθο στιγμιότυπο οθόνης δείχνει το έγγραφο PDF που είναι ενσωματωμένο στο HTML με πρόσθετες παραμέτρους που κάνουν το στοιχείο ενσωμάτωσης να μετακινείται στη σελίδα με τον αριθμό 3 μετά την απόδοση του:

Ενσωματώστε το PDF ενσωματώνοντας το PDF.js

Όπως γνωρίζουμε, το PDFObject εξαρτάται από την υποστήριξη του προγράμματος περιήγησης για την ενσωμάτωση αρχείων PDF σε HTML, αλλά παρέχει μια εναλλακτική μέθοδο απόδοσης αρχείων PDF εάν το πρόγραμμα περιήγησης δεν την υποστηρίζει. Η εναλλακτική μέθοδος είναι η ενσωμάτωση του PDF.js με το PDFObject. Για να το κάνουμε, θα πρέπει να ρυθμίσουμε το PDF.js στον διακομιστή μας και μετά θα περάσουμε τα ForcePDFJS: true και PDFJS_URL: path/to/viewer.html/in/pdf.js στη συνάρτηση ενσωμάτωση.

Σημείωση: Στο παρακάτω παράδειγμα απόσπασμα κώδικα, δημιουργήσαμε και ξεκινήσαμε έναν διακομιστή που περιέχει τη βιβλιοθήκη PDF.js, οπότε το http://localhost:8888 οδηγεί στη βιβλιοθήκη PDF.js.

Παραγωγή

Το ακόλουθο στιγμιότυπο οθόνης δείχνει το αποδοθέν έγγραφο PDF ενσωματώνοντας το PDFObject με το PDF.js:

συμπέρασμα

Συμπερασματικά, το PDFObject είναι μια εύχρηστη βιβλιοθήκη JavaScript για την ενσωμάτωση εγγράφων PDF σε HTML. Αν και δεν λειτουργεί ως renderer και βασίζεται στην υποστήριξη του προγράμματος περιήγησης για στοιχεία ενσωμάτωσης που μπορεί να προκαλέσουν προβλήματα όπως ένα σπασμένο περιβάλλον εργασίας χρήστη σε προγράμματα περιήγησης που δεν υποστηρίζουν στοιχείο ενσωμάτωσης, αλλά η βιβλιοθήκη διαθέτει λειτουργίες για την επίλυση τέτοιων προβλημάτων μέσω του εντοπισμού υποστήριξης για ενσωμάτωση στοιχείου και μηχανισμού επιστροφής. Μπορούμε επίσης να αποδώσουμε αρχεία PDF σε προγράμματα περιήγησης που δεν υποστηρίζουν στοιχεία ενσωμάτωσης ενσωματώνοντας το PDF.js με το PDFObject. Παρά τους περιορισμούς του, το PDFObject ξεχωρίζει ως πολύτιμο εργαλείο για την ενσωμάτωση και απόδοση εγγράφων PDF σε ιστοσελίδες.

Παρόμοια Προϊόντα