Skip to content

Commit

Permalink
381112: get base 64 sample
Browse files Browse the repository at this point in the history
  • Loading branch information
SF4524LogeshKumar committed Nov 25, 2024
1 parent ba2f745 commit e19ea97
Show file tree
Hide file tree
Showing 2 changed files with 65 additions and 0 deletions.
38 changes: 38 additions & 0 deletions How to/Get Base 64 string of the loaded PDF document/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
<!DOCTYPE html><html lang="en"><head>
<title>EJ2 PDF Viewer</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Typescript PDF Viewer Control">
<meta name="author" content="Syncfusion">
<link href="https://cdn.syncfusion.com/ej2/27.1.57/ej2-base/styles/material.css" rel="stylesheet">
<link href="https://cdn.syncfusion.com/ej2/27.1.57/ej2-pdfviewer/styles/material.css" rel="stylesheet">
<link href="https://cdn.syncfusion.com/ej2/27.1.57/ej2-buttons/styles/material.css" rel="stylesheet">
<link href="https://cdn.syncfusion.com/ej2/27.1.57/ej2-popups/styles/material.css" rel="stylesheet">
<link href="https://cdn.syncfusion.com/ej2/27.1.57/ej2-navigations/styles/material.css" rel="stylesheet">
<link href="https://cdn.syncfusion.com/ej2/27.1.57/ej2-dropdowns/styles/material.css" rel="stylesheet">
<link href="https://cdn.syncfusion.com/ej2/27.1.57/ej2-lists/styles/material.css" rel="stylesheet">
<link href="https://cdn.syncfusion.com/ej2/27.1.57/ej2-inputs/styles/material.css" rel="stylesheet">
<link href="https://cdn.syncfusion.com/ej2/27.1.57/ej2-splitbuttons/styles/material.css" rel="stylesheet">
<link href="https://cdn.syncfusion.com/ej2/27.1.57/ej2-notifications/styles/material.css" rel="stylesheet">

<!-- Essential JS 2 PDF Viewer's script -->
<script src="https://cdn.syncfusion.com/ej2/27.1.57/dist/ej2.min.js" type="text/javascript"></script>
<script src="https://cdn.syncfusion.com/ej2/syncfusion-helper.js" type ="text/javascript"></script>

<script src="https://cdn.syncfusion.com/ej2/syncfusion-helper.js" type ="text/javascript"></script>
</head>
<body>
<button id="getBase64">getBase64</button>
<div id="container">
<div id="PdfViewer" style="height:500px;width:100%;"></div>
</div>


<script>
var ele = document.getElementById('container');
if(ele) {
ele.style.visibility = "visible";
}
</script>
<script src="index.js" type="text/javascript"></script>
</body></html>
27 changes: 27 additions & 0 deletions How to/Get Base 64 string of the loaded PDF document/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
var pdfviewer = new ej.pdfviewer.PdfViewer({
documentPath: 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf',
//serviceUrl: 'https://services.syncfusion.com/js/production/api/pdfviewer',
resourceUrl: "https://cdn.syncfusion.com/ej2/23.2.6/dist/ej2-pdfviewer-lib",
});
ej.pdfviewer.PdfViewer.Inject(ej.pdfviewer.TextSelection, ej.pdfviewer.TextSearch, ej.pdfviewer.Print, ej.pdfviewer.Navigation, ej.pdfviewer.Toolbar,
ej.pdfviewer.Magnification, ej.pdfviewer.Annotation, ej.pdfviewer.FormDesigner, ej.pdfviewer.FormFields, ej.pdfviewer.PageOrganizer);
pdfviewer.appendTo('#PdfViewer');

document.getElementById('getBase64').addEventListener('click', function() {
base64ofloadedDocument(); // Call the function to get the Base64 string
});
function base64ofloadedDocument() {
pdfviewer.saveAsBlob().then(function(value) {
var data = value;

var reader = new FileReader();

reader.readAsDataURL(data);

reader.onload = function() {
var base64data = reader.result;

console.log(base64data);
};
});
}

0 comments on commit e19ea97

Please sign in to comment.