Open Source JavaScript PDF Viewer-bibliotek

Hvad er PDF.js?

PDF.js er et open source JavaScript- og HTML5-baseret PDF-fremviserbibliotek udviklet af Mozilla, der tillader visning af PDF-dokumenter (Portable Document Format) i browseren.

PDF.js understøtter flere funktioner, som er anført nedenfor:

• Gengiv PDF-filer: Du kan åbne og se, læse eller gengive PDF-dokumenter i webbrowsere.
• Udskriv/Gem PDF'er: PDF.js giver også mulighed for at udskrive eller gemme PDF-dokumenter fra din foretrukne webbrowser.
• Præsentationstilstand: Ved at bruge præsentationstilstand kan du vise PDF-sider i fuld skærm og kan navigere til hver side som et præsentationsdias.
• PDF-navigation: PDF.js giver nemmere navigationskontroller, som du kan bruge til at flytte til næste eller forrige sider. Du kan også hurtigt springe til en ønsket side ved at indtaste nummeret på siden.
• PDF-anmærkning: Du kan også kommentere PDF-dokumenter ved at tilføje tekst, billeder eller tegning på PDF-siderne.
• Rotér PDF-sider: Ved at bruge PDF.js kan du også rotere PDF-sider med eller mod uret.
• Rulning af PDF: PDF.js tilbyder gode kontroller til at rulle sider vandret eller lodret osv.
• PDF-dokumentegenskaber: Sidst, men ikke mindst, kan du også se egenskaber for PDF-dokumenter i browseren ved hjælp af PDF.js viewer.

GitHub-statistik

Navn:
Sprog:
Stjerner:
Forgafler:
Licens:
Repository blev sidst opdateret kl

Kom godt i gang med PDF.js

Der er tre måder at få PDF.js og begynde at bruge det i dine webprojekter.

1. Byg fra kilden

Du kan klone PDF.js-lageret fra GitHub og bygge det selv efter installation af Node.js, gulp og PDF.js-afhængigheder ved at følge nedenstående trin:

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. Brug præ-bygget distribution

PDF.js tilbyder også forudbyggede distributioner sammen med kildekode, som du kan finde på PDF.js-udgivelser på GitHub . Du kan downloade det forudbyggede PDF.js-bibliotek og begynde at bruge det.

3. Brug hostet bibliotek via CDN

PDF.js hostes også på gratis CDN-servere. Nogle links er delt nedenfor:

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

Kør PDF.js Viewer

Når du har downloadet og udtrukket et forudbygget distributionsbibliotek fra GitHub, finder du to mapper: build og web. PDF.js-biblioteksfiler kan findes i mappen build, hvor mappen web indeholder et fremviserprojekt, der inkluderer viewer.html, viewer.css, viewer.js og relaterede filer. Hvis du tjekker viewer.html-koden, kan du se, at den også refererer til pdf.js-biblioteket fra build-mappen og andre relaterede css- og js-filer.

Lad os køre viewer.html i browseren for at se, hvordan PDF.js viewer ser ud:

Gengiv/se PDF-dokumenter

For blot at gengive eller se et PDF-dokument i browseren ved hjælp af PDF.js viewer-bibliotek, skal vi inkludere PDF.js-biblioteket i vores HTML-dokumenthoved ved hjælp af script-tag, tilføje et lærred > til HTML-tekst, og tilføj derefter den nødvendige JavaScript-kode for at bruge pdfjsLib og lover objekter til at håndtere asynkron indlæsning og gengivelse af PDF-dokumentet.

Ovenstående kode indlæser bare et PDF-dokument i browseren uden nogen brugergrænseflade eller kontrol som nedenfor:

Online demo

Prøv denne fuldt udbyggede online PDF.js Viewer-demo for at udforske alle funktionerne i PDF.js-biblioteket.

Konklusion

PDF.js er gratis og open source JavaScrpit PDF-fremviserbibliotek med et stærkt fællesskab. Det giver support på tværs af browsere til både moderne og ældre browsere. Ja, brugeroplevelsen på ældre browsere er måske ikke den samme som de moderne, men den er stadig god som et gratis bibliotek. Det er sikkert og kan tilpasses. Funktionerne er begrænsede, men som PDF-fremviser fungerer det godt.

PDF.js giver gode API'er og arkitektur til at bygge en webbaseret PDF-fremviser. Da det er tidskrævende at tilføje flere UI-kontroller til fremviseren for at spare udviklernes tid, leverer PDF.js også kildekoden til en fuldt funktionel og funktionsrig PDF-visning, som du kan finde (tjek viewer.html, viewer.js og viewer.css etc.) i mappen web i PDF.js-bibliotekets distributionspakke.

Lignende Produkter