---
title: "Import data into PDF from database | Nutrient SDK"
canonical_url: "https://www.nutrient.io/guides/web/forms/fill-form-fields/import-from-database/"
md_url: "https://www.nutrient.io/guides/web/forms/fill-form-fields/import-from-database.md"
last_updated: "2026-05-15T15:53:41.685Z"
description: "Learn how to use Nutrient Web SDK to prefill form fields with user data from your database. Enhance user experience with automated data integration."
---

# Import data into PDFs from a database

With Nutrient Web SDK, you can easily fill in the form fields using the data stored in your database as soon as you [open a document](https://www.nutrient.io/guides/web/open-a-document.md). You just need to make sure you expose that data to your application over HTTP.

For example, assume your backend application exposes a `/profile` endpoint that returns the current user’s profile information, including the first name and the last name. That data is returned in a JSON format, like this:

```json

{
  "firstName": "John",
  "lastName": "Appleseed"
}

```

If you want to prefill the first name and the last name in the document that the user opens, insert the form field values into the [Instant JSON](https://www.nutrient.io/guides/web/json.md) object and import it when the document is opened:

```js

try {
  // This loads the profile information from your server which, in turn, imports it from the database.
  const profileResponse = await fetch('https://your-server.example.com/profile');

  if (!profileResponse.ok) {
    throw new Error(`Failed to load profile: ${profileResponse.status}`);
  }

  const { firstName, lastName } = await profileResponse.json();

  // Insert the form field values into Instant JSON.
  const instantJSON = {
    format: "https://pspdfkit.com/instant-json/v1",
    formFieldValues: [
      { v: 1, type: "pspdfkit/form-field-value", name: "firstNameField", value: firstName },
      { v: 1, type: "pspdfkit/form-field-value", name: "lastNameField", value: lastName }
    ]
  };

  // Open a document and immediately import Instant JSON into it.
  const instance = await NutrientViewer.load({ instantJSON: instantJSON, /* required options */ });
} catch (error) {
  console.error("Failed to load document with profile data:", error.message);
}

```

Try this example in our [Playground](https://www.nutrient.io/demo/sandbox?p=eyJqcyI6ImNvbnN0IGZpcnN0TmFtZSA9IFwiSm9oblwiO1xuY29uc3QgbGFzdE5hbWUgPSBcIkFwcGxlc2VlZFwiO1xuXG5jb25zdCBpbnN0YW50SlNPTiA9IHtcbiAgZm9ybWF0OiBcImh0dHBzOi8vcHNwZGZraXQuY29tL2luc3RhbnQtanNvbi92MVwiLFxuICBmb3JtRmllbGRWYWx1ZXM6IFtcbiAgICB7XG4gICAgICB2OiAxLFxuICAgICAgdHlwZTogXCJwc3BkZmtpdC9mb3JtLWZpZWxkLXZhbHVlXCIsXG4gICAgICBuYW1lOiBcIkNsaWVudCBDb250YWN0IEZpcnN0IE5hbWVcIixcbiAgICAgIHZhbHVlOiBmaXJzdE5hbWUsXG4gICAgfSxcbiAgICB7XG4gICAgICB2OiAxLFxuICAgICAgdHlwZTogXCJwc3BkZmtpdC9mb3JtLWZpZWxkLXZhbHVlXCIsXG4gICAgICBuYW1lOiBcIkNsaWVudCBDb250YWN0IExhc3QgTmFtZVwiLFxuICAgICAgdmFsdWU6IGxhc3ROYW1lLFxuICAgIH0sXG4gIF0sXG59O1xuXG5OdXRyaWVudFZpZXdlci5sb2FkKHtcbiAgLi4uYmFzZU9wdGlvbnMsXG4gIGRvY3VtZW50OiBcImZvcm0ucGRmXCIsXG4gIGluc3RhbnRKU09OLFxufSkudGhlbigoaW5zdGFuY2UpID0%2BIHtcbiAgY29uc29sZS5sb2coaW5zdGFuY2UuZ2V0Rm9ybUZpZWxkVmFsdWVzKCkpO1xufSk7XG4iLCJjc3MiOiIvKiBBZGQgeW91ciBDU1MgaGVyZSAqL1xuIiwic2V0dGluZ3MiOnsiZmlsZU5hbWUiOiJiYXNpYy5wZGYiLCJ1c2VEeW5hbWljRm9udHMiOnRydWUsImN1c3RvbUZvbnRGaWxlTmFtZXMiOltdfSwidiI6MX0%3D).

> Note that this approach only works with Nutrient Web SDK. If you use Web SDK with Document Engine, see [this guide](https://www.nutrient.io/guides/web/forms/fill-form-fields/import-from-server-backed.md) to learn how to fill the form fields.

This example assumes there are form fields in the document called `firstNameField` and `lastNameField`. If you want to retrieve the information about what form fields are present in the document and what their current values are, you can use the [`NutrientViewer.Instance.getFormFieldValues`](https://www.nutrient.io/api/web/classes/NutrientViewer.Instance.html#getformfieldvalues) method:

```js

const formFieldValues = instance.getFormFieldValues();
console.log(formFieldValues);
// => { firstNameField: "John", lastNameField: "Appleseed" }

```
---

## Related pages

- [Adding an image to a PDF form using JavaScript](/guides/web/forms/fill-form-fields/add-image.md)
- [Attach a file to a PDF form using JavaScript](/guides/web/forms/fill-form-fields/attach-a-file.md)
- [Detecting user inputs in PDF forms](/guides/web/forms/fill-form-fields/detect-user-input.md)
- [Dynamic font loading in PDF forms using Nutrient Web SDK](/guides/web/forms/fill-form-fields/dynamic-font-loading.md)
- [Headless form fill](/guides/web/forms/fill-form-fields/headless.md)
- [Import data into PDF form using Web SDK with Document Engine](/guides/web/forms/fill-form-fields/import-from-server-backed.md)
- [Import data into PDF forms using Instant JSON](/guides/web/forms/fill-form-fields/import-from-instant-json.md)
- [Import data into PDF forms using XFDF](/guides/web/forms/fill-form-fields/import-from-xfdf.md)
- [Customizing PDF form permissions](/guides/web/forms/fill-form-fields/permissions.md)
- [Fill PDF form fields using our JavaScript viewer UI](/guides/web/forms/fill-form-fields/using-the-ui.md)
- [Fill PDF forms programmatically using JavaScript](/guides/web/forms/form-filling.md)