Some test text!

platform
search

Get started with PDFNetJS Full

Contents

Starting from scratch
Setting up your HTML document
Setting up your JavaScript document
Setting up your main function
Running our own code
Testing
Converting async/await code
PDFNetJS samples

PDFNetJS Full is a complete browser side PDF SDK, unlocking viewing, parsing and editing of PDF files. This guide will demonstrate how to set up a basic PDFNetJS Full project that outputs the number of pages in a PDF document.

PDFNetJS Full does not require any conversion of documents but can only view PDF documents.

linkStarting from scratch

  1. Download WebViewer, unzip the file, and move the "WebViewer" folder to a desired location within a web server folder. If you do not have a server available, you can quickly set one up with XAMPP or WAMP.

  2. Create an empty HTML file and place it in the same location as the WebViewer folder (file will be referred to as SampleTest.html).

  3. Create an empty JavaScript file and place it in the same location as the WebViewer folder (file will be referred to as SampleTest.js).

This guide uses ES7 JavaScript async/await. For more information on async/await, refer to these online explanations.

linkSetting up your HTML document

Open up SampleTest.html with a text editor and copy/paste the following code into the HTML document.

<!DOCTYPE html>
<html>
<head>
  <script src="WebViewer/lib/ui-legacy/external/jquery-3.2.1.min.js"></script>
  <script src="WebViewer/lib/core/CoreControls.js"></script>
  <script src="WebViewer/ui-legacy/core/external/FileSaver.min.js"></script>
  <script src="WebViewer/lib/core/pdf/PDFNet.js"></script>
  <script src="WebViewer/samples/full-apis/Setup.js"></script>
  <script src="SampleTest.js"></script>
</head>
<body onload="runSampleTest();">
</body>
</html>

Here we include PDFNetJS, the necessary libraries it depends on, and our currently empty SampleTest.js custom file. Adding these files in a different order may result in errors. To initialize our script, the body executes the runSampleTest() function, which we will soon add to SampleTest.js.

linkSetting up your JavaScript document

Open up SampleTest.js with a text editor and copy/paste the following code into the JavaScript document:

var runSampleTest;
(function(exports) {
  "use strict";
  var licenseKey = 'YOUR_LICENSE_KEY_HERE';

  // the path to where the PDF worker files are
  CoreControls.setWorkerPath('WebViewer/lib/core');

  runSampleTest = async function() {
    async function main() {
      // To be filled
    }

    await PDFNet.runWithCleanup(main, licenseKey);
    // Alt: PDFNet.runWithoutCleanup(main, licenseKey);
    // 'runWithoutCleanup' does not deallocate anything after finishing.
  }
})(window);

In this script, we have our runSampleTest() function wrapped inside an immediately invoked function expression. Inside the function we have an empty main() function that we pass as a callback to PDFNet.runWithCleanup(). We'll add our custom code to the main() function later. We use PDFNet.runWithCleanup() to take care of locking and memory management of our code, more detail of this can be found in the Advanced Features section. Also note that PDFNet.runWithCleanup() and PDFNet.runWithoutCleanup() don't necessarily need to be used with async/await functions. They can be use with any function that returns a promise.

linkSetting up your main function

Copy/paste the following code and use it to replace our currently empty main() function.

async function main() {
  try {
    // creates an empty pdf document
    var doc = await PDFNet.PDFDoc.create();    
    doc.initSecurityHandler();
    // Locks all PNaCl operations on the document
    doc.lock();

    // insert user code after this point
    var pgnum = await doc.getPageCount();
    alert("Test Complete! Your file has " + pgnum + " pages");
  } catch(err) {
    console.log(err.stack)
  }
}

Here we set up the basic requirements for a PDFNetJS script.

PDFNet.PDFDoc.create() - Creates an empty placeholder PDF document. All PDFNetJS functions return a promise, which means that for functions which return a value or object, we need to add an await statement in front to guarantee that the object is resolved by the time we use it. Without adding an await statement, PDFNet.PDFDoc.create() will simply return a promise rather than the document we want.

To open an existing PDF document, call PDFNet.PDFDoc.createFromURL("path/to/pdfdoc.pdf"); instead.

doc.initSecurityHander() - Initializes security handler which is used to check for and handle password-locked PDFs.

doc.lock() - Locks all PNaCl operations on the document in order to avoid editing conflicts from other processes. More information is available in the advanced guide.

linkRunning our own code

Now that we have properly set up our document, we can call read/write operations on it.

await doc.getPageCount() - Returns a promise that contains the number of pages in the PDF document. Remember to use await to resolve the promise.

linkTesting

To test if everything is working correctly, we have an alert message at the end of our try block that will output the number of pages in our PDF doc.

alert("Test Complete! Your file has " + pgnum + " pages");

Since we have not added any pages to our pdf doc, the number of pages will be 0. Try swapping out create() with createFromURL("path/to/pdfdoc.pdf") to test the getPageCount() function on an existing PDF document.

var doc = await PDFNet.PDFDoc.createFromURL("myfile.pdf");

Run SampleTest.html on a server. The "Test Complete!" alert box should pop up after a few moments.

linkConverting async/await code (important for IE usage)

This guide and all other PDFNetJS guides use ES7 async/await functions in JavaScript which are currently supported in Chrome, Firefox, Edge, Safari, and Opera but may be unsupported in other browsers. If you are working with a browser without async/await support, you will have to transpile the code from ES7 to ES5 using something like Babel.

linkPDFNetJS samples

The best way to get started with writing your own PDFNetJS code is to run the PDFNetJS samples. You can find working samples and their source code on the PDFNetJS samples page.

Get the anwsers you need: Support

Contents

Starting from scratch
Setting up your HTML document
Setting up your JavaScript document
Setting up your main function
Running our own code
Testing
Converting async/await code
PDFNetJS samples