1

I am working on an application that was created by a colleague that is no longer with the company. I am trying to open what I believe is a PDF in blob file format, but none of the tutorials is giving me the expected result.

I notice that I have some data preceding what I believe to be the blob file, leading me to wonder if I am understanding what I am working with correctly. The whole blob is too large to post here, but this is how it starts:

data:application/pdf;base64,JVBERi0xLjcNJeLjz9MNCjIxIDAgb2JqDTw8L0xpbmVhcml6ZWQgMS9MIDQyMTExNC9PIDIzL0UgMzc0MzIwL04gMi9UIDQyMDU3NC9IIFsgMjYxNiA0NDhdPj4NZW5kb2JqDSAgICAgICAgICAg

In the posts and tutorials I am reading, like this one for instance, they use code similar to this:

var file = new Blob([response], {type: 'application/pdf'});

Since my blob file includes the "application/pdf" portion as part of the string, I am starting to wonder if I misunderstood and that this is another kind of file instead of a blob. I have also seen other examples of blob files, and they also do not include the "data:application/pdf;base64,".

I am having issues opening the files in a browser if they are too large. I have outlined my problem in this post, but have yet to receive any advice, so I am trying to find a different way to approach this. The results are not as expected, which leads me to wonder if I am looking for the right thing.

Here is what I have tried and what the result is:

var file = new Blob([upload.split(',')[upload.split(',').length - 1]], { type: 'application/pdf' });
var fileURL = URL.createObjectURL(file);

I remove the "data:application/pdf;base64," portion of the string using "[upload.split(',')[upload.split(',').length - 1]]", thinking that this will leave me with only the blob data, but this invariably fails to open, giving me the below result:

enter image description here

So my question is this: Am I working with a blob file or not? If not, what kind of data file is this so I can start looking for more relevant tutorials?

Cœur
  • 37,241
  • 25
  • 195
  • 267
phunder
  • 1,607
  • 3
  • 17
  • 33
  • 1
    What you are looking at is a base 64 encoded file, not in pure blob format. You can refer to https://stackoverflow.com/questions/16245767/creating-a-blob-from-a-base64-string-in-javascript to convert a base64 string into a blob – lanxion Sep 17 '20 at 05:59
  • 1
    as others have pointed out, you know, blob, is not an actual file format. Think of it cartons or boxes in which you can put whatever you want. images, music files, whatever you want. – Jay Sep 17 '20 at 07:10
  • Thanks for everyone's comments. I realize that I am not working with blobs, and am looking into converting a binary object to PDF's instead. Again thank you for pointing me in the right direction! – phunder Sep 17 '20 at 07:14

1 Answers1

1

"Blob files" aren't really a thing. You can think of the term "blob" as "just some binary data", or if you're a database vendor, call them "Binary Large OBject"s.

Your data:application/pdf;base64,JVBERi0xLjcNJeLjz9MNCjIxIDAgb2JqDTw8L... string is a data URL; a way to represent arbitrary binary data in an URL string. Since the URI has the base64 marker, you know the data is encoded as Base64 and you can use any Base64 decoder you can find (there are plenty online) to decode the data.

Your (truncated) data begins

%PDF-1.7
%
21 0 obj
<</Linearized 1/L 421114/O 23/E 374320/N 2/T 420574/H [ 2616 448]>>
endobj

so it is representing something like a valid PDF file.

AKX
  • 152,115
  • 15
  • 115
  • 172