Open a document from Base64

Opening a document in WebViewer from base64 data

If you have the file data as a base64 string, the best way to load the document in WebViewer is to first convert it to a Blob and then load it as described for Blobs. Below is some example code showing how to convert base64 to a Blob.

1function base64ToBlob(base64) {
2 const binaryString = window.atob(base64);
3 const len = binaryString.length;
4 const bytes = new Uint8Array(len);
5 for (let i = 0; i < len; ++i) {
6 bytes[i] = binaryString.charCodeAt(i);
7 }
8
9 return new Blob([bytes], { type: 'application/pdf' });
10};
11
12WebViewer(...)
13 .then(instance => {
14 // `myBase64String` is your base64 data which can come
15 // from sources such as a server or the filesystem
16 instance.UI.loadDocument(base64ToBlob(myBase64String), { filename: 'myfile.pdf' });
17
18 const { documentViewer } = instance.Core;
19 documentViewer.addEventListener('documentLoaded', () => {
20 // perform document operations
21 });
22 });

See more in loading options

Did you find this helpful?

Trial setup questions?

Ask experts on Discord

Need other help?

Contact Support

Pricing or product questions?

Contact Sales