Hướng dẫn how to display base64 encoded pdf in html - cách hiển thị pdf được mã hóa base64 trong html

Tôi phải hiển thị base64 pdf trong tab mới. Tôi đang sử dụng mã dưới đây

 var windo = window.open["", ""];  
 var objbuilder = '';
 objbuilder += [''];
 windo.document.write[objbuilder]; 

Nó đang làm việc trong Firefox và không làm việc trong Chrome và IE. Tôi thậm chí đã thử với TAG, nhưng cùng một đầu ra, hoạt động trong FF nhưng không phải trong Chrome và IE.

Tôi xem xét bên dưới JSfiddles, đang làm việc trong FF nhưng không phải trong Chrome,

//jsfiddle.net/yLx2W/

//jsfiddle.net/yLx2W/1/

Phiên bản Chrome của tôi là: Phiên bản 54.0.2840,99 m

Phiên bản Firefox: 49.0.2

Là bất kỳ ai có bất kỳ ý tưởng, xin vui lòng chia sẻ.

Cảm ơn trước

Đã hỏi ngày 18 tháng 11 năm 2016 lúc 10:19Nov 18, 2016 at 10:19

Dnyaneshwardnyaneshwardnyaneshwar

1.2263 huy hiệu vàng15 Huy hiệu bạc26 Huy hiệu đồng3 gold badges15 silver badges26 bronze badges

1

Đối với những người vẫn không thể làm điều đó, tôi đã tìm thấy điều này trong câu trả lời của người khác, nhưng tôi không nhớ ai ...

var objbuilder = '';
objbuilder += [''];
objbuilder += [''];
objbuilder += [''];

var win = window.open["#","_blank"];
var title = "my tab title";
win.document.write[''+ title +''];
win.document.write[objbuilder];
win.document.write[''];
layer = jQuery[win.document];

Bằng cách này, chúng tôi mở tệp PDF trong một tab mới.

Đã trả lời ngày 28 tháng 9 năm 2017 lúc 20:26Sep 28, 2017 at 20:26

ChacochacoCHACO

3892 Huy hiệu bạc12 Huy hiệu Đồng2 silver badges12 bronze badges

7

Nó sẽ hoạt động với Chrome mà bạn có thể sử dụng

Tôi đã phải đối mặt với vấn đề tương tự với IE: không thể hiển thị PDF với chuỗi base64.IE: it's impossible to display a pdf with a base64 string.

Tôi đã phải tạo các tệp tạm thời trên máy chủ để hiển thị chúng với IE anh ta chỉ hiển thị tệp hiện có bằng cách sử dụng đường dẫn.IE he only display existing file by using a path.

Bạn vẫn có thể sử dụng thư viện JS để hiển thị pdf của bạn như PDF.js.JS library to display your pdf like PDF.js.

Đã trả lời ngày 18 tháng 11 năm 2016 lúc 10:25Nov 18, 2016 at 10:25

AlexisalexisAlexis

5.5411 Huy hiệu vàng28 Huy hiệu bạc43 Huy hiệu đồng1 gold badge28 silver badges43 bronze badges

3

function printPreview[data]{
        var type = 'application/pdf';
        let blob = null;
        const blobURL = URL.createObjectURL[ pdfBlobConversion[data, 'application/pdf']];
        const theWindow = window.open[blobURL];
        const theDoc = theWindow.document;
        const theScript = document.createElement['script'];
        function injectThis[] {
            window.print[];
        }
        theScript.innerHTML = 'window.onload = ${injectThis.toString[]};';
        theDoc.body.appendChild[theScript];
    }
  //converts base64 to blob type for windows
    function pdfBlobConversion[b64Data, contentType] {
          contentType = contentType || '';
          var sliceSize = 512;
          b64Data = b64Data.replace[/^[^,]+,/, ''];
          b64Data = b64Data.replace[/\s/g, ''];
          var byteCharacters = window.atob[b64Data];
          var byteArrays = [];

          for [ var offset = 0; offset < byteCharacters.length; offset = offset + sliceSize ] {
            var slice = byteCharacters.slice[offset, offset + sliceSize];

            var byteNumbers = new Array[slice.length];
            for [var i = 0; i < slice.length; i++] {
              byteNumbers[i] = slice.charCodeAt[i];
            }

            var byteArray = new Uint8Array[byteNumbers];

            byteArrays.push[byteArray];
          }

          var blob = new Blob[byteArrays, { type: contentType }];
          return blob;
        }

Vượt qua dữ liệu Base64 cho chức năng này và nó sẽ hiển thị PDF trong cửa sổ mới. Điều này đang hoạt động trong Chrome và Firefox không có trong IE. Xin vui lòng giúp đỡ. Tôi cũng muốn nó hoạt động trong IE. Lỗi cho nó trong đó tôi đưa cho bloburl vào cửa sổ.

Đã trả lời ngày 21 tháng 11 năm 2019 lúc 21:33Nov 21, 2019 at 21:33

Khi câu trả lời trên không hoạt động do giới hạn kích thước, bạn có thể thử giải pháp này, nó đã hoạt động với tôi khi tôi đang cố gắng chuyển đổi các tệp PDF 16+ từ Base64 trở lại PDF trong Chrome.

Cách khắc phục là để chuyển đổi base64 trở lại thành nhị phân, đóng gói bên trong một đốm màu, và sau đó đặt "SRC" của iframe thành một blob-uri trỏ đến blob đó.

var base64 = ["yourBase64StringVariable"]
const blob = base64ToBlob[ base64, 'application/pdf' ];
const url = URL.createObjectURL[ blob ];
const pdfWindow = window.open[""];
pdfWindow.document.write[""];

function base64ToBlob[ base64, type = "application/octet-stream" ] {
  const binStr = atob[ base64 ];
  const len = binStr.length;
  const arr = new Uint8Array[len];
  for [let i = 0; i < len; i++] {
    arr[ i ] = binStr.charCodeAt[ i ];
  }
  return new Blob[ [ arr ], { type: type } ];
}

Nguồn gốc của câu trả lời này - Mở tệp PDF được mã hóa Base64 bằng JavaScript. Vấn đề với kích thước tệp lớn hơn 2 MB

Dharman ♦

Phù hiệu vàng 28K2121 gold badges75 silver badges127 bronze badges

Đã trả lời ngày 12 tháng 10 năm 2021 lúc 8:51Oct 12, 2021 at 8:51

1

Ở đây '@model.binarydocument' là dữ liệu cơ sở64

1] theo mô hình


   

2] bởi JS

  $[document].ready[function [] {
    var b64Data = "@Model.binaryDocument";
    var contentType = "application/pdf";
     const blob = b64toBlob[b64Data, contentType];
    const blobUrl = URL.createObjectURL[blob];

    window.location = blobUrl;
  }]

const b64toBlob = [b64Data, contentType = '', sliceSize = 512] => {
    const byteCharacters = atob[b64Data];
    const byteArrays = [];

    for [let offset = 0; offset < byteCharacters.length; offset += sliceSize] 
       {
        const slice = byteCharacters.slice[offset, offset + sliceSize];

        const byteNumbers = new Array[slice.length];
        for [let i = 0; i < slice.length; i++] {
            byteNumbers[i] = slice.charCodeAt[i];
        }

        const byteArray = new Uint8Array[byteNumbers];
        byteArrays.push[byteArray];
    }

    const blob = new Blob[byteArrays, { type: contentType }];
    return blob;
}

Giải pháp đầu tiên tốt hơn để ngăn chặn tự động tải xuống pdf.First solution is better for prevent auto downloading pdf.

Đã trả lời ngày 20 tháng 5 năm 2021 lúc 9:43May 20, 2021 at 9:43

Bạn có thể mã hóa Base64 PDF không?

Mã hóa Base64 được sử dụng để mã hóa dữ liệu nhị phân, chẳng hạn như tệp PDF, thành định dạng chuỗi ASCII tương thích với các hệ thống chỉ có thể xử lý văn bản. Ví dụ: tệp đính kèm email và tải lên nhị phân trong các biểu mẫu HTML được chuyển đổi và truyền dưới dạng dữ liệu được mã hóa BASE64., into an ASCII string format that is compatible with systems that can only handle text. For example, email attachments and binary uploads in HTML forms are converted and transmitted as Base64 encoded data.

Làm cách nào để tái cấu trúc PDF từ Base64?

Cách chuyển đổi Base64 sang PDF..
Mở trang web Base64 miễn phí và chọn Chuyển đổi ứng dụng ..
Nhấp vào bên trong khu vực thả tệp để tải lên các tệp base64 hoặc kéo và thả các tệp base64 ..
Bạn có thể tải lên tối đa 10 tệp cho hoạt động ..
Nhấp vào nút Chuyển đổi. ....
Tải xuống liên kết của các tệp kết quả sẽ có sẵn ngay sau khi chuyển đổi ..

Làm cách nào để tạo trình xem pdf trong HTML?

Trình xem JS kết thúc UI dựa trên phản ứng hiện đại xung quanh PDF nguồn mở.JS kết xuất động cơ ...
Bước 1 - Tải xuống PDF.JS Express Viewer.Bạn có thể bấm vào đây để tải xuống PDF.....
Bước 2 - Tích hợp PDF.JS thể hiện vào ứng dụng của bạn.Di chuyển PDF chiết xuất.....
Bước 3 - Sử dụng PDF.JS Express Viewer API để tùy chỉnh trình xem ..

Làm cách nào để đọc một tệp Base64?

Giải mã các tệp để giải mã một tệp có nội dung được mã hóa base64, bạn chỉ cần cung cấp đường dẫn của tệp với cờ mã hóa.Cũng như các tệp mã hóa, đầu ra sẽ là một chuỗi rất dài của tệp gốc.Bạn có thể muốn xuất trực tiếp stdout vào một tệp.provide the path of the file with the --decode flag. As with encoding files, the output will be a very long string of the original file. You may want to output stdout directly to a file.

Bài Viết Liên Quan

Chủ Đề