The Essential JS 2 for JavaScript (global script) is an ES5 formatted pure JavaScript framework which can be directly used in latest web browsers.
Step 1: Create an app folder myapp for the Essential JS 2 JavaScript components.
Step 2: The Essential JS 2 component’s global scripts and styles are already hosted in the below CDN link formats.
Script:
https://cdn.syncfusion.com/ej2/21.1.35/dist/ej2.min.js
Step 3: Create a HTML page (index.html) in myapp location and add the CDN link references. Now, add the Div element and initiate the Essential JS 2 PDF Viewer component in the index.html by using following code.
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>Essential JS 2</title>
<!-- Essential JS 2 material theme -->
<link href="https://cdn.syncfusion.com/ej2/21.1.35/material.css" rel="stylesheet">
<!-- Essential JS 2 PDF Viewer's script -->
<script src="https://cdn.syncfusion.com/ej2/21.1.35/dist/ej2.min.js" type="text/javascript"></script>
<script src="https://cdn.syncfusion.com/ej2/21.1.35/dist/ej2.min.js" type="text/javascript"></script>
</head>
<body>
<!--element which is going to render-->
<div id="container">
<div id="PdfViewer" style="height:580px;width:100%;">
</div>
</div>
<script>
//Initialize PDF Viewer component
var pdfviewer = new ej.pdfviewer.PdfViewer({
documentPath: "PDF_Succinctly.pdf",
serviceUrl: 'https://ej2services.syncfusion.com/production/web-services/api/pdfviewer'
});
ej.pdfviewer.PdfViewer.Inject(ej.pdfviewer.TextSelection, ej.pdfviewer.TextSearch, ej.pdfviewer.Navigation,ej.pdfviewer.Print);
//PDF Viewer control rendering starts
pdfviewer.appendTo('#PdfViewer');
</script>
<script>
var ele = document.getElementById('container');
if(ele) {
ele.style.visibility = "visible";
}
</script>
<script>
var ele = document.getElementById('container');
if(ele) {
ele.style.visibility = "visible";
}
</script>
<script src="index.js" type="text/javascript"></script>
</body></html>Step 4: Now, run the index.html in web browser, it will render the Essential JS 2 PDF Viewer component.
For PDF Viewer serviceUrl creation, follow the steps provided in the link
ASP.NET Core folder and open it in the command prompt. dotnet restore dotnet runlocalhost:5001 and navigate to the PDF Viewer Web control localhost:5001/pdfviewer which returns the default get response method. We can bind the link to the serviceUrl property of PDF Viewer as below.var pdfviewer = new ej.pdfviewer.PdfViewer({
documentPath: "PDF_Succinctly.pdf",
serviceUrl: 'https://localhost:5001/pdfviewer'
});