Làm cách nào để tạo trình xem pdf bằng html?

Hãy tưởng tượng tình huống này. Bạn đang điều hành một doanh nghiệp bán các khóa học trực tuyến. Bạn đã bỏ ra rất nhiều công sức để tạo ra các khóa học này và xuất bản chúng trực tuyến dưới dạng tài liệu PDF. Một vài tháng sau khi bạn bắt đầu khóa học, bạn thấy chúng tràn lan trên internet. Bạn cảm thấy thật kinh khủng và muốn tìm một giải pháp để bảo vệ tài liệu của mình

Trong bài viết này, tôi sẽ chia sẻ một số ý tưởng về cách bạn có thể bảo vệ tài liệu của mình khỏi bị tải xuống. Vậy hãy bắt đầu

Nhúng trình xem CloudPDF

CloudPDF là dịch vụ đám mây giúp bạn dễ dàng nhúng trình xem PDF vào trang web HTML của mình.  

Bạn có thể sao chép một đoạn mã HTML và dán vào trang web của mình - thật đơn giản.  

Trình xem CloudPDF có những tính năng nào khác?

• Khả năng ngăn khách truy cập tải xuống tài liệu của bạn
  Bạn đã dành nhiều thời gian để tạo tài liệu PDF và không muốn khách truy cập dễ dàng sao chép nội dung. CloudPDF tạo tệp PDF trên máy chủ để tệp PDF không thể truy cập được từ trình duyệt của khách hàng. Khi bạn tắt khả năng tải xuống, người dùng của bạn cũng không thể trích xuất tệp PDF gốc từ mã nguồn - vì vậy bạn có thể ngừng lo lắng về việc mọi người chia sẻ tệp PDF của mình.
• Xem ai đang đọc tài liệu của bạn và trong bao lâu
  Với phân tích CloudPDF, bạn có thể biết chính xác ai đang đọc tài liệu của mình và trong bao lâu. Điều này cung cấp thông tin chi tiết có giá trị - ví dụ: bạn có thể xác định những khách hàng tiềm năng có liên quan đã đọc toàn bộ tài liệu bán hàng của bạn và dành năng lượng của bạn ở đó thay vì cho những khách truy cập không tương tác với tệp PDF của bạn. Điều này sẽ làm cho bạn hiệu quả hơn.
• Thu thập thông tin về khách truy cập đang đọc tài liệu của bạn
  Bạn có thể yêu cầu thông tin cá nhân trước khi khách truy cập có thể đọc tài liệu của bạn. Điều này sẽ cung cấp cho bạn khả năng thu thập khách hàng tiềm năng và theo dõi họ. Tài liệu của bạn có thể trở thành một công cụ tạo khách hàng tiềm năng tuyệt vời.
• Trình xem có thể tùy chỉnh
  Bạn có thể tùy chỉnh cách trình xem xuất hiện để phù hợp với màu sắc của trang web của bạn và chỉ định kích thước của nó. Bạn có thể tùy chỉnh thanh công cụ để cho phép hoặc không cho phép in cũng như tải xuống.

Làm cách nào để nhúng trình xem PDF vào trang web HTML của bạn?

1. Tạo tài khoản CloudPDF

Nhấp vào “+ Thêm tài liệu” và kéo hoặc thả hoặc chọn các tệp PDF đầu tiên của bạn để tải lên

3. Đặt cài đặt nhúng của bạn

Tại màn hình nhúng, bạn sẽ phải thay đổi quyền của tài liệu thành công khai để nhúng tài liệu vào trang web HTML của bạn. Vì vậy, hãy nhấp vào nút "Thay đổi quyền" và thay đổi công tắc "Có thể truy cập công khai" thành "BẬT". Bạn cũng có thể chuyển quyền tải xuống thành "TẮT" tại đây

Ví dụ về cách thay đổi quyền tài liệu trong CloudPDF

4. Sao chép đoạn mã HTML để nhúng PDF vào trang web của bạn

Sau khi thay đổi các quyền trên tài liệu, bây giờ bạn có thể sao chép đoạn mã mà bạn sẽ tìm thấy dưới tiêu đề "Tích hợp thủ công" trông giống như thế này

      documentId: 'a9658aef-c513-4130-afbf-77f3fc19e0e7',
    CloudPDF(config, document.getElementById('viewer')).then((instance) => {

Dán đoạn mã này vào trang web HTML của bạn, làm mới trang của bạn và bạn sẽ thấy trình xem PDF ở đó

5. Bản xem trước của trình xem CloudPDF

Đây là giao diện của trình xem PDF sau khi bạn đã nhúng nó vào trang web của mình

Ví dụ về whitepaper bitcoin được nhúng vào CloudPDF

Nếu bạn muốn dùng thử CloudPDF, bạn có thể nhấp vào liên kết sau. Đăng ký

Đang tìm kiếm một giải pháp khác?

Trong html có một thẻ gọi là. Thẻ này cho phép bạn nhúng các nguồn bên ngoài vào trang web của mình - ví dụ: trình phát đa phương tiện, trang web hoặc trong trường hợp của chúng tôi là tệp PDF

Phần tích cực của giải pháp này là chúng tôi không cần bất kỳ plugin bên ngoài nào vì thẻ được hỗ trợ trong tất cả các trình duyệt chính ngoại trừ Internet Explorer. Nhược điểm của giải pháp này là về cơ bản, điều này sẽ chỉ ẩn thanh công cụ nhưng sẽ không thực sự ngăn người dùng tải xuống tệp PDF. Nếu người dùng mở trình kiểm tra phần tử trong bất kỳ trình duyệt nào, thì có thể tìm thấy URL của PDF và tải xuống

Nếu điều này là đủ đối với bạn, hãy đọc mã nguồn bên dưới để biết chính xác cách triển khai tùy chọn này. Nếu bạn đang tìm kiếm một giải pháp an toàn hơn, hãy cuộn lên để đọc về các giải pháp khác mà chúng tôi đã tìm thấy cho bạn

Google Drive cung cấp khả năng tải lên các tài liệu PDF và chia sẻ chúng công khai với các tùy chọn tắt tùy chọn tải xuống và in

Mặt tích cực của điều này là nó là một giải pháp miễn phí. Ngoài ra, PDF được hiển thị trên máy chủ Google và do đó không có sẵn trong mã nguồn

Hạn chế của tùy chọn này là nếu tài liệu được công khai, tất cả những ai biết URL đều có thể đọc nó. Ngoài ra, Google Drive không cung cấp bất kỳ tùy chọn nào để tùy chỉnh trình xem PDF cho phù hợp với thiết kế của bạn. Giải pháp này có thể không lý tưởng cho bạn nếu bạn muốn tùy chỉnh trình xem hoặc giới hạn những người có thể xem tài liệu, ví dụ: chỉ cung cấp quyền truy cập cho những người dùng cụ thể bên trong ứng dụng của bạn. Nếu đúng như vậy, bạn có thể cuộn lên giải pháp trước đó

Nếu giải pháp này là đủ cho bạn, bạn có thể làm theo các bước dưới đây

1. Tải tệp PDF của bạn lên Google Drive

Nhấp vào "Mới" và sau đó chọn "Tải tệp lên"

Nhấp chuột phải vào tài liệu và chọn "Chia sẻ"

3. Thay đổi cài đặt cho tài liệu

Nhấp vào biểu tượng "Cài đặt" ở góc trên cùng bên phải

Bỏ chọn hộp "Người xem và người bình luận có thể thấy tùy chọn tải xuống, in và sao chép"

4. Tạo liên kết công khai cho tài liệu của bạn

Nhấp vào "Bất kỳ ai có liên kết này" để công khai tài liệu này

5. Nhúng tài liệu của bạn vào iframe trên trang web của bạn

Tuyệt vời, bây giờ bạn gần như đã hoàn thành. Bây giờ bạn có thể nhúng tài liệu này vào bên trong trang web của mình. Dưới đây, bạn sẽ tìm thấy một ví dụ về cách nhúng tệp PDF này vào trong iframe

    
Example on how to embed Google Drive PDF inside website
        src="https://drive.google.com/file/d/1kJJeabYl-NH4nsNV8kLs-qTUYESbUfMx/preview"

6. Bản xem trước của Google Drive nhúng PDF

Đây là giao diện của trình xem tài liệu Google Drive sau khi bạn đã nhúng nó vào trang web của mình

Tất cả các phương pháp này đều cung cấp các tùy chọn để nhúng tệp PDF vào HTML với các mức độ riêng tư khác nhau

Trình xem CloudPDF là một công cụ có thể tùy chỉnh, dựa trên đám mây, cung cấp các giải pháp cho phép hoặc vô hiệu hóa quyền truy cập để xem, tải xuống và in tài liệu của bạn

Thẻ trong HTML là một tùy chọn đơn giản cho phép bạn ẩn các tùy chọn tải xuống và in, nhưng để lại thông tin cần thiết để làm như vậy trong mã nguồn

Phương pháp Google Drive cho phép bạn tắt tải xuống và in, nhưng cung cấp các tùy chọn tích hợp và tùy chỉnh hạn chế

Chúng tôi hy vọng bài viết này đã giúp bạn đánh giá các tùy chọn này và cung cấp hướng dẫn nhanh để thực hiện chúng