Skip to main content

Configuration

The web SDK is configured through the main configuration object: the IdvFlowProps type.

In React, it's exposed as the IdvFlow component. In vanilla JavaScript, it's exposed by the createIdvFlow function.

See the quickstart to understand how to import and invoke these functions.

Configuration object​

The basic configuration object looks like this:

{
  apiConfig: {},
  consentData: {},
  enableD2D: false,
  endResultScreen: () => {},
  mode: "classic",
  onAbort: (),
  onCardScanResult: (),
  onError: (),
  onTransactionFinished: (),
  progressScreen: () => {},
  resourcesPath: "...",
  scanTimeout: 60000,
  startScreen: () => {},
  themeOverride: {},
  translationsOverride: {}
}

Required fields​

You must set the following fields. Other fields are optional and are described in the Optional fields section.

apiConfig​

{
  apiConfig: {
    proxy: {
      baseUrl: "https://your.proxy.server"
    },
    workflowId: "example123",
  }
}

This field holds configuration options for how the SDK communicates with the Platform API. There are two different objects that you can use for it: a ProxyConfig object or a TransactionConfig object.

When creating new transactions​

Use the ProxyConfig format when you're initiating new transactions:

{
  // Only proxy and workflowId are required:
  proxy: {
    baseUrl: "https://your.proxy.server"
  },
  workflowId: "example123",
  d2d: {
    joinKey: "...",
    runAddress: "..."
  },
  formValues: {
    foo: "bar"
  },
  headers: {
    "X-custom-header": "some-custom-value"
  }
}
workflowId​

This is the ID of your workflow. You can get the workflowId from the Platform dashboard.

proxy.baseUrl​

The proxy.baseUrl value depends on how you have configured your proxy service. By default, the web SDK will append "/transaction" to the value in baseUrl when creating new transactions. If you're using our proxy (latest version), you don't need to change anything.

If using something else, make sure that your proxy expects the path configured by the SDK.

When continuing existing transactions​

Use TransactionConfig when you're resuming existing transactions (transactions that have an existing transaction ID). For example, when using your own D2D or verification links infrastructure.

{
  apiUrl: "https://api.{your_region}.platform.microblink.com/edge",
  ephemeralKey: "...",
  transactionId: "...",
  d2d: {
    joinKey: "...",
    runAddress: "..."
  }
}

consentData​

Consent data is a mandatory field where you provide a unique user identifier, and the user's consent to process their data. You provide the consent by setting the isProcessingStoringAllowed flag to true. If it is not set, we will show our own consent form to the user. If they reject, the transaction will be abandoned.

Never reuse user IDs

Never reuse the same user ID for multiple users.

Each consent to process someone's personal data must be accompanied by a unique identifier that can be used to associate this consent with the person who gave it.

{
  consentData: {
    // User ID is required
    userId: "...",
    givenOn: "2026-03-11T14:23:00.000Z",
    isProcessingStoringAllowed: true,
    isTrainingAllowed: true,
    note: "..."
  }
}

Optional fields​

{
  mode: "d2d", // or "classic" (default)
  enableD2D: true, // default is false
  scanTimeout: 60000
}

By setting mode and enableD2D, you can configure a device to be either a primary or secondary device in a D2D flow.

Read more on how to configure the web SDK for this use case in the chapter on D2D web SDK configuration.

Timeout is used mainly in the context of D2D. It's used to define how much time needs to pass before an error callback is triggered.

Read more in Timeout configuration.

Callbacks​

{
  onAbort: (),
  onCardScanResult: (),
  onError: (),
  onTransactionFinished: ()
}

You can determine what steps the SDK should perform in case of a user aborting the flow, finishing a transaction, and so on.

Read more on what you can do with different callbacks in the API reference:

resourcesPath​

{
  resourcesPath: "..."
}

Default: /resources.

You can set where the WASM files that perform the heavy computing (e.g. in extraction) are located.

As explained in the Hosting resources section of the quick start guide, you can change this value, for example if you're using a CDN to distribute the WASM files.

Customizations and overrides​

{
  themeOverride: {
    accent: 100,
    buttonBorderRadius: "3px",
    fontFamily: "Comic Sans",
    resultsScreen: {},
    startScreenIcon: "..."
  },
  translationsOverride: {
    actions: {
      start: "go go go!",
      // ...
    },
    consentDialog: {
      caption: "Store personal data, including biometrics, for the purpose of verifying your identity?",
      confirmButtonText: "I consent."
    }
    // ...
  },
  startScreen: () => {},
  progressScreen: () => {},
  endResultScreen: () => {}
}

Overrides include:

  • theme overrides, which is where you can define font, colors, icons, and other visual customizations for the UI
  • translation overrides, which is where you can define your custom translation strings for parts of the UI; for example, a consent notice in another language

You can also customize your start screen, end screen, or progress screen.

Read more about how to customize your Platform web SDK integration.

API reference​

Read the full API reference for a complete account of expected types, deprecated fields, and more.

Last updated on