Skip to content

Custom Pages Overview

Custom Pages enable developers to extend Vault Platform by adding custom UI to Vault.

Developers can build completely custom user interfaces in Vault using JavaScript and their preferred frameworks or libraries. Developers can also leverage the power of the Vault Java SDK to retrieve and manage Vault data.

To create a Custom Page:

  1. Develop client and server code Develop server code with Java and client code with JavaScript. The Vault Web SDK JavaScript package provides functions to validate and exchange data with your server code.

  2. Deploy code to Vault Deploy server code using the Vault Java SDK Maven plugin and deploy client code using Vault API.

  3. Configure the Custom Page in Vault: To create a Custom Page, configure a Page component. This links the client code and server code in Vault. Secured with permission sets, your code will run when a user loads the Custom Page. You can also configure a Tab or Pagelink component to display a Custom Page in Vault.

Like most web applications, Custom Pages follow the general pattern of providing a UI, a set of business logic, and a persistence layer:

  • The Vault Web SDK and JavaScript build the Custom Page in the Vault UI.
  • The Vault Java SDK adds behavior and business logic to your Vault instance.
  • Finally, the Vault API leverages the flexibility of Vault objects and documents to store and fetch data in a persistent way.

Custom Pages are best suited for specialized interfaces that go beyond Vault's standard UI capabilities. Consider using Custom Pages when standard Vault configurations and UI components cannot meet your specific business requirements or when you need a highly tailored user experience.

Understanding the Runtime Environment

Section link for Understanding the Runtime Environment

Custom Pages run in an isolated environment using the shadow DOM, which:

  • Protects your code from conflicts with Vault
  • Requires special handling for some features
  • Does not support @font-face

Register stylesheets in distribution-manifest.json instead of loading them in code. Learn more about integrating UI libraries.

Now that you have a basic understanding of Custom Pages, let's try it out and see a Custom Page running live in your sandbox Vault.