Thư viện trình xem PDF JavaScript mã nguồn mở

PDF.js là gì?

PDF.js là thư viện xem PDF dựa trên JavaScript và HTML5 mã nguồn mở do Mozilla phát triển, cho phép xem tài liệu PDF (Định dạng Tài liệu Di động) trong trình duyệt.

PDF.js hỗ trợ một số tính năng được liệt kê bên dưới:

• Kết xuất tệp PDF: Bạn có thể mở và xem, đọc hoặc hiển thị tài liệu PDF trong trình duyệt web.
• In/Lưu tệp PDF: PDF.js cũng cho phép in hoặc lưu tài liệu PDF từ trình duyệt web yêu thích của bạn.
• Chế độ trình bày: Sử dụng chế độ Trình bày, bạn có thể hiển thị các trang PDF ở chế độ toàn màn hình và có thể điều hướng đến từng trang giống như một trang trình bày.
• Điều hướng PDF: PDF.js cung cấp các điều khiển điều hướng dễ dàng hơn bằng cách sử dụng công cụ này để bạn có thể chuyển sang trang tiếp theo hoặc trang trước đó. Bạn cũng có thể nhanh chóng chuyển đến trang mong muốn bằng cách nhập số trang.
• Chú thích PDF: Bạn cũng có thể chú thích tài liệu PDF bằng cách thêm văn bản, hình ảnh hoặc hình vẽ trên trang PDF.
• Xoay trang PDF: Sử dụng PDF.js, bạn cũng có thể xoay các trang PDF theo chiều kim đồng hồ hoặc ngược chiều kim đồng hồ.
• Cuộn PDF: PDF.js cung cấp các điều khiển tuyệt vời để cuộn các trang theo chiều ngang hoặc chiều dọc, v.v.
• Thuộc tính tài liệu PDF: Cuối cùng nhưng không kém phần quan trọng, bạn cũng có thể xem các thuộc tính của tài liệu PDF trong trình duyệt bằng trình xem PDF.js.

Thống kê GitHub

Tên:
Ngôn ngữ:
Ngôi sao:
Nĩa:
Giấy phép:
Kho lưu trữ được cập nhật lần cuối lúc

Bắt đầu với PDF.js

Có ba cách để tải PDF.js và bắt đầu sử dụng nó trong các dự án web của bạn.

1. Xây dựng từ nguồn

Bạn có thể sao chép kho lưu trữ PDF.js từ GitHub và tự xây dựng nó sau khi cài đặt Node.js, gulp và phụ thuộc PDF.js bằng cách làm theo các bước dưới đây:

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. Sử dụng bản phân phối dựng sẵn

PDF.js cũng cung cấp các bản phân phối dựng sẵn cùng với mã nguồn mà bạn có thể tìm thấy tại Bản phát hành PDF.js trên GitHub . Bạn có thể tải xuống thư viện PDF.js dựng sẵn và bắt đầu sử dụng nó.

3. Sử dụng thư viện được lưu trữ qua CDN

PDF.js cũng được lưu trữ trên các máy chủ CDN miễn phí. Một số liên kết được chia sẻ dưới đây:

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

Chạy Trình xem PDF.js

Sau khi tải xuống và giải nén thư viện phân phối dựng sẵn từ GitHub, bạn sẽ tìm thấy hai thư mục: build và web. Bạn có thể tìm thấy các tệp thư viện PDF.js trong thư mục build trong đó thư mục web chứa dự án trình xem bao gồm Viewer.html, Viewer.css, Viewer.js và các tệp liên quan. Nếu bạn kiểm tra mã Viewer.html, bạn có thể thấy rằng nó tham chiếu đến thư viện pdf.js từ thư mục build và các tệp css và js có liên quan khác.

Hãy chạy view.html trong trình duyệt để xem trình xem PDF.js trông như thế nào:

Hiển thị/Xem tài liệu PDF

Để chỉ hiển thị hoặc xem tài liệu PDF trong trình duyệt bằng thư viện trình xem PDF.js, chúng tôi phải đưa thư viện PDF.js vào tiêu đề tài liệu HTML bằng thẻ script, thêm canvas vào nội dung HTML, sau đó thêm mã JavaScript cần thiết để sử dụng pdfjsLib và hứa hẹn các đối tượng sẽ xử lý việc tải và hiển thị không đồng bộ của tài liệu PDF.

Đoạn mã trên chỉ tải một tài liệu PDF trong trình duyệt mà không có bất kỳ giao diện người dùng hoặc điều khiển nào như dưới đây:

Bản trình diễn trực tuyến

Hãy dùng thử trực tuyến này. Bản demo Trình xem PDF.js để khám phá tất cả các tính năng của thư viện PDF.js.

Phần kết luận

PDF.js là thư viện trình xem PDF JavaScrpit mã nguồn mở và miễn phí với cộng đồng mạnh mẽ. Nó cung cấp hỗ trợ đa trình duyệt cho cả trình duyệt hiện đại và cũ. Có, trải nghiệm người dùng trên các trình duyệt cũ có thể không giống với các trình duyệt hiện đại nhưng nó vẫn tốt như một thư viện miễn phí. Nó an toàn và có thể tùy chỉnh. Các tính năng bị hạn chế nhưng là một trình xem PDF, nó hoạt động rất tốt.

PDF.js cung cấp các API và kiến trúc đẹp mắt để xây dựng trình xem PDF dựa trên web. Vì việc thêm nhiều điều khiển giao diện người dùng hơn cho trình xem sẽ tốn thời gian nên để tiết kiệm thời gian của nhà phát triển, PDF.js cũng cung cấp mã nguồn của trình xem PDF đầy đủ chức năng và giàu tính năng mà bạn có thể tìm thấy (kiểm tra Viewer.html, Viewer.js và Viewer.css, v.v.) trong thư mục web của gói phân phối thư viện PDF.js.

Sản Phẩm Tương Tự