Hướng dẫn how do i print a pdf in javascript? - làm cách nào để in pdf trong javascript?

113

Mới! Lưu câu hỏi hoặc câu trả lời và sắp xếp nội dung yêu thích của bạn. Tìm hiểu thêm.
Learn more.

Tôi đang xây dựng một danh sách các tệp PDF trong HTML. Trong danh sách tôi muốn bao gồm một liên kết tải xuống và nút/liên kết in. Có một số cách nào để mở hộp thoại in cho PDF mà không cần người dùng nhìn thấy PDF hoặc mở Trình xem PDF?

Một số biến thể của việc tải pdf vào một iframe ẩn và kích hoạt nó để in bằng javascript?

Hỏi ngày 26 tháng 4 năm 2013 lúc 15:00Apr 26, 2013 at 15:00

Hướng dẫn how do i print a pdf in javascript? - làm cách nào để in pdf trong javascript?

Craig Celestecraig CelesteCraig Celeste

11.8k9 Huy hiệu vàng41 Huy hiệu bạc48 Huy hiệu đồng9 gold badges41 silver badges48 bronze badges

Dựa trên các bình luận dưới đây, nó không còn hoạt động trong các trình duyệt hiện đại, câu hỏi này cho thấy một cách tiếp cận có thể hữu ích cho bạn: In im lặng một bản PDF nhúng
This question demonstrates an approach that might be helpful to you: Silent print an embedded PDF

Nó sử dụng thẻ để nhúng PDF vào tài liệu:


Sau đó, bạn gọi phương thức

function printDocument(documentId) {
    var doc = document.getElementById(documentId);

    //Wait until PDF is ready to print    
    if (typeof doc.print === 'undefined') {    
        setTimeout(function(){printDocument(documentId);}, 1000);
    } else {
        doc.print();
    }
}
0 trên phần tử trong JavaScript khi PDF được tải:

function printDocument(documentId) {
    var doc = document.getElementById(documentId);

    //Wait until PDF is ready to print    
    if (typeof doc.print === 'undefined') {    
        setTimeout(function(){printDocument(documentId);}, 1000);
    } else {
        doc.print();
    }
}

Bạn có thể đặt phần nhúng trong một iframe ẩn và in nó từ đó, mang lại cho bạn trải nghiệm liền mạch.

Fzs

15.2K12 Huy hiệu vàng40 Huy hiệu bạc46 Huy hiệu đồng12 gold badges40 silver badges46 bronze badges

Đã trả lời ngày 26 tháng 4 năm 2013 lúc 15:13Apr 26, 2013 at 15:13

Hướng dẫn how do i print a pdf in javascript? - làm cách nào để in pdf trong javascript?

11

Dưới đây là một chức năng để in PDF từ iframe.

Bạn chỉ cần chuyển URL của PDF cho chức năng. Nó sẽ tạo ra một bản in iframe và kích hoạt sau khi PDF tải.

Lưu ý rằng chức năng không phá hủy iframe. Thay vào đó, nó tái sử dụng nó mỗi khi hàm được gọi. Thật khó để phá hủy iframe vì nó cần thiết cho đến khi việc in hoàn thành và phương thức in không có hỗ trợ gọi lại (theo như tôi biết).

printPdf = function (url) {
  var iframe = this._printIframe;
  if (!this._printIframe) {
    iframe = this._printIframe = document.createElement('iframe');
    document.body.appendChild(iframe);

    iframe.style.display = 'none';
    iframe.onload = function() {
      setTimeout(function() {
        iframe.focus();
        iframe.contentWindow.print();
      }, 1);
    };
  }

  iframe.src = url;
}

Đã trả lời ngày 27 tháng 3 năm 2014 lúc 17:42Mar 27, 2014 at 17:42

Nicolas Badianicolas BadiaNicolas BADIA

5.3636 Huy hiệu vàng42 Huy hiệu bạc45 Huy hiệu Đồng6 gold badges42 silver badges45 bronze badges

3

Bạn có thể sử dụng Print.js (

function printDocument(documentId) {
    var doc = document.getElementById(documentId);

    //Wait until PDF is ready to print    
    if (typeof doc.print === 'undefined') {    
        setTimeout(function(){printDocument(documentId);}, 1000);
    } else {
        doc.print();
    }
}
1). Đó là 128kb chưa đóng gói và bạn có thể tìm thấy các tài liệu tại http://printjs.crabbly.com/.

Mặc dù vậy, nó không in trên IE, trong những trường hợp đó, bạn sẽ phải tải xuống PDF.

$http({
    url: "",
    method: "GET",
    headers: {
        "Content-type": "application/pdf"
    },
    responseType: "arraybuffer"
}).success(function (data, status, headers, config) {
    var pdfFile = new Blob([data], {
        type: "application/pdf"
    });
    var pdfUrl = URL.createObjectURL(pdfFile);
    //window.open(pdfUrl);
    printJS(pdfUrl);
    //var printwWindow = $window.open(pdfUrl);
    //printwWindow.print();
}).error(function (data, status, headers, config) {
    alert("Sorry, something went wrong")
});

Người Thượng cổ

2.04413 Huy hiệu bạc17 Huy hiệu đồng13 silver badges17 bronze badges

Đã trả lời ngày 2 tháng 6 năm 2017 lúc 2:58Jun 2, 2017 at 2:58

user1892203user1892203user1892203

4694 Huy hiệu bạc12 Huy hiệu đồng4 silver badges12 bronze badges

4

https://github.com/mozilla/pdf.js/

Đối với một bản demo trực tiếp http://mozilla.github.io/pdf.js/

Đó có lẽ là những gì bạn muốn, nhưng tôi không thể thấy điểm này vì các trình duyệt hiện đại bao gồm các chức năng như vậy, nó cũng sẽ chạy chậm trên các thiết bị công suất thấp như thiết bị di động, nhân tiện, có các plugin và ứng dụng được tối ưu hóa riêng của chúng .

Đã trả lời ngày 26 tháng 4 năm 2013 lúc 15:04Apr 26, 2013 at 15:04

1

Giải pháp trình duyệt chéo để in pdf từ chuỗi base64:

  • Chrome: Cửa sổ in được mở
  • FF: Tab mới với PDF được mở
  • IE11: Lời nhắc mở/lưu được mở

.

const blobPdfFromBase64String = base64String => {
   const byteArray = Uint8Array.from(
     atob(base64String)
       .split('')
       .map(char => char.charCodeAt(0))
   );
  return new Blob([byteArray], { type: 'application/pdf' });
};

const isIE11 = !!(window.navigator && window.navigator.msSaveOrOpenBlob); // or however you want to check it

const printPDF = blob => {
   try {
     isIE11
       ? window.navigator.msSaveOrOpenBlob(blob, 'documents.pdf')
       : printJS(URL.createObjectURL(blob)); // http://printjs.crabbly.com/
   } catch (e) {
     throw PDFError;
   }
};

printPDF(blobPdfFromBase64String(base64String))

Phần thưởng - Mở tệp Blob trong tab mới cho IE11

Nếu bạn có thể thực hiện một số tiền xử lý của chuỗi Base64 trên máy chủ, bạn có thể hiển thị nó dưới một số URL và sử dụng liên kết trong

function printDocument(documentId) {
    var doc = document.getElementById(documentId);

    //Wait until PDF is ready to print    
    if (typeof doc.print === 'undefined') {    
        setTimeout(function(){printDocument(documentId);}, 1000);
    } else {
        doc.print();
    }
}
2 :)

Đã trả lời ngày 4 tháng 1 năm 2019 lúc 11:47Jan 4, 2019 at 11:47

Hướng dẫn how do i print a pdf in javascript? - làm cách nào để in pdf trong javascript?

PapipapiPapi

7416 Huy hiệu bạc8 Huy hiệu đồng6 silver badges8 bronze badges

Tôi đã sử dụng chức năng này để tải xuống luồng PDF từ máy chủ.

function printPdf(url) {
        var iframe = document.createElement('iframe');
        // iframe.id = 'pdfIframe'
        iframe.className='pdfIframe'
        document.body.appendChild(iframe);
        iframe.style.display = 'none';
        iframe.onload = function () {
            setTimeout(function () {
                iframe.focus();
                iframe.contentWindow.print();
                URL.revokeObjectURL(url)
                // document.body.removeChild(iframe)
            }, 1);
        };
        iframe.src = url;
        // URL.revokeObjectURL(url)
    }

Đã trả lời ngày 16 tháng 4 năm 2019 lúc 13:35Apr 16, 2019 at 13:35

AdnanadnanAdnan

1.36310 Huy hiệu bạc14 Huy hiệu đồng10 silver badges14 bronze badges

Bạn có thể tải xuống tệp PDF bằng

function printDocument(documentId) {
    var doc = document.getElementById(documentId);

    //Wait until PDF is ready to print    
    if (typeof doc.print === 'undefined') {    
        setTimeout(function(){printDocument(documentId);}, 1000);
    } else {
        doc.print();
    }
}
3 và in nó bằng print.js

fetch("url").then(function (response) {
    response.blob().then(function (blob) {
        var reader = new FileReader();
        reader.onload = function () {

            //Remove the data:application/pdf;base64,
            printJS({
                printable: reader.result.substring(28),
                type: 'pdf',
                base64: true
            });
        };
        reader.readAsDataURL(blob);
    })
});

Hướng dẫn how do i print a pdf in javascript? - làm cách nào để in pdf trong javascript?

Henry Ecker

32.7K17 Huy hiệu vàng30 Huy hiệu bạc51 Huy hiệu Đồng17 gold badges30 silver badges51 bronze badges

Đã trả lời ngày 23 tháng 12 năm 2020 lúc 18:27Dec 23, 2020 at 18:27

DiegodiegoDiego

6797 Huy hiệu bạc13 Huy hiệu Đồng7 silver badges13 bronze badges

Đơn giản hóa câu trả lời của @nicolas Badia:

function printPDF (url)
{
    let pdfFrame = document.body.appendChild(document.createElement('iframe'));
    pdfFrame.style.display = 'none';
    pdfFrame.onload = () => (void pdfFrame.contentWindow.print());
    pdfFrame.src = url;
}

Đã trả lời ngày 21 tháng 8 năm 2021 lúc 6:49Aug 21, 2021 at 6:49

trinalbadger587trinalbadger587trinalbadger587

1.6421 Huy hiệu vàng17 Huy hiệu bạc34 Huy hiệu đồng1 gold badge17 silver badges34 bronze badges

Tôi giải quyết vấn đề -_- hehe

function PrintPdf (pdf) {
        var iframe = document.createElement('iframe');
        iframe.style.display = "none";
        iframe.src = pdf;
        document.body.appendChild(iframe);
        iframe.contentWindow.focus();
        iframe.contentWindow.print();
}

Đã trả lời ngày 27 tháng 7 lúc 4:51Jul 27 at 4:51

hgiahuyyhgiahuyyhgiahuyy

711 huy hiệu bạc2 huy hiệu đồng1 silver badge2 bronze badges

Làm thế nào để bạn in bằng JavaScript?

JavaScript không có bất kỳ đối tượng in hoặc phương thức in. Bạn không thể truy cập các thiết bị đầu ra từ JavaScript. Ngoại lệ duy nhất là bạn có thể gọi phương thức Window.print () trong trình duyệt để in nội dung của cửa sổ hiện tại.call the window.print() method in the browser to print the content of the current window.

Làm cách nào để in PDF trong HTML?

Cách chuyển đổi các trang HTML thành các tệp PDF:..
Trên máy tính Windows, hãy mở một trang web HTML trong Internet Explorer, Google Chrome hoặc Firefox. ....
Nhấp vào nút Chuyển đổi thành PDF trong thanh công cụ Adobe PDF để khởi động chuyển đổi PDF ..
Nhập tên tệp và lưu tệp PDF mới của bạn vào một vị trí mong muốn ..

Làm cách nào để xem PDF trong JavaScript?

Cách sử dụng PDF ...
Bước 1 - Tải xuống và trích xuất PDF. Gói JS. ....
Bước 2 - Nhúng trình xem PDF vào trang web. ....
Trình xem PDF toàn màn hình. ....
Tùy chỉnh PDF. ....
Tài liệu tham khảo ID phần tử cho tùy chỉnh giao diện người dùng PDF.JS. ....
Bước tiếp theo. ....
Conclusion..

Bạn có thể tạo PDF trong JavaScript không?

Trường hợp sử dụng JS. Thư viện html2pdf.js dựa trên JavaScript thuần túy để tạo PDF. Do đó, HTML2PDF nhúng phía máy khách trực tiếp, trong trình duyệt.The html2pdf. js library relies on pure JavaScript to create a PDF. As a result, html2pdf embeds directly client-side, in the browser.