Skip to content

SDK

Low-Code

Workflow

DWS API
Nutrient Web SDK

Add PDF functionality with Laravel

Nutrient Web SDK is a JavaScript PDF library for viewing, annotating, and editing PDFs directly in the browser. Use it to add PDF capabilities to any web app.

This guide walks you through the steps to integrate Nutrient into your project. By the end, you'll be able to render a PDF document in the UI.

Test without installing You can test the SDK capabilities in our playground.
Jump to example Prefer to jump straight to code? View the example repo on GitHub.

Installation

Install Nutrient into your existing Laravel project.

  1. Add the Nutrient Web SDK (@nutrient-sdk/viewer) dependency:

    Terminal window
    npm i @nutrient-sdk/viewer

  2. Copy the Nutrient Web SDK distribution to the /public/assets/ directory in your project’s folder:

    Terminal window
    mkdir public/assets && cp -R ./node_modules/nutrient-sdk/viewer/dist ./public/assets/

  3. Make sure your /public/assets/ directory contains the nutrient-viewer.js file and a nutrient-viewer-lib directory with the library assets.

  4. Make sure your server has the Content-Type: application/wasm MIME typeset. Read more about this in the troubleshooting section of our guides.

Render a PDF

  1. Rename the PDF document you want to display in your application to document.pdf, and place it in the public directory. You can use this demo document as an example.

  2. In resources/views/welcome.blade.php, add an empty <div> element with a defined height to where Nutrient will be mounted:

    <div id="nutrient" style="height: 100vh"></div>

  3. Include nutrient-viewer.js on the welcome.blade.php page:

    <script src="assets/nutrient-viewer.js"></script>

  4. Initialize Nutrient Web SDK in Laravel by calling NutrientViewer.load():

    <script>
      NutrientViewer.load({
        container: "#nutrient",
          document: "document.pdf" // Add the path to your document here.
      })
      .then(function(instance) {
        console.log("Nutrient loaded", instance);
      })
      .catch(function(error) {
        console.error(error.message);
      });
    </script>

  5. Run php artisan serve. You should see the PDF rendered in the browser.

Troubleshooting

Example View the example repo on GitHub.
Facing issues? Visit the troubleshooting guide for solutions to some common errors.