Edge Payment Technologies, Inc {json:api} Specification (1.0)

Before starting with the API, you must create a merchant account and obtain API keys from the Developer tab in your account dashboard. You will use the “Publishable key” with Edge JavaScript SDK and the “Secret key” with any SDK or HTTP API call. The Edge HTTP API requires in every request a Authorization header with a Bearer token.

The Edge API is based upon REST principles, returns JSON responses, and uses standard HTTP response codes. We speficially use the JSON:API specification.

If you're wanting to use Edge Payment Technologies in the browser to make a charge you're going to need to include the Edge javascript SDK. The Edge JavaScript SDK is a toolkit for encrypting data in the browser. Using the Edge JavaScript SDK means your customer's data never leaves their browser unencrypted. Include this in your HTML:

<script
  src="https://assets.tryedge.io/edge.js"
  type="text/javascript"></script>

Then after that you need to initialize the client:

const edge = new Edge("<Publishable Key>");

edge.initializeForm().then(function (form) {
  // Form configuration
});

The Edge JavaScript SDK on intializeForm() exposes a form builder. The main function exposed by the form builder is the inputs function (form.inputs(…)). It initialises Edge Inputs, making it easy to collect encrypted cardholder data in a completely PCI-compliant environment.

Edge Inputs are served within an iFrame retrieved directly from Edge’s PCI-compliant infrastructure, which can reduce your PCI DSS compliance scope to the simplest form (SAQ-A) once integrated correctly.

Pass the id of the element in which the iFrame should be embedded, for example:

// form.inputs(id: String, settings: Object);
form.inputs("card-details", {
  theme: "material",
});

Themes

Inputs can be customized to match your brand’s design system. The Edge JavaScript SDK allows additional configuration for styling both the Evervault Inputs container as well as each <input> within the container.

Supported Settings

Parameter	Type	Description
theme	String	The base styling for Inputs. Currently supports default, minimal and material.
height	String	The height of the Evervault Inputs iframe.
primaryColor	String	The main theme color.
labelColor	String	The color CSS property applied to the input labels.
inputBorderColor	String	The border-color CSS property applied to inputs.
inputTextColor	String	The color CSS property applied to inputs.
inputBackgroundColor	String	The color CSS property applied to the ::placeholder CSS pseudo-element for inputs.
inputBorderRadius	String	The border-radius CSS property applied to inputs.
inputHeight	String	The height CSS property applied to inputs.
cardNumberLabel	String	The label for the card number input
expirationDateLabel	String	The label for the expiration date input
securityCodeLabel	String	The label for the security code input
expirationDatePlaceholder	String	The placeholder shown for the expiration date input
invalidCardNumberLabel	String	The message shown on an invalid card number
invalidExpirationDateLabel	String	The message shown on an invalid expiration date
invalidSecurityCodeLabel	String	The message shown on an invalid security code
fontUrl	String	Load a custom font with the Google Fonts API
fontFamily	String	Set the font-family for the fontUrl
inputFontSize	String	Set the font-size property of the input attribute
inputBoxShadow	String	Set the box-shadow property of the input attribute
labelFontSize	String	Set the font-size property of the label attribute
labelWeight	String	Set the font-weight property of the label attribute
disableCVV	Boolean	If true the CVV field will not be displayed

Default Theme

Set theme to default to use the Default theme for Inputs.

Minimal Theme

Set theme to minimal to use the Minimal theme for Inputs.

Material Theme

Set theme to material to use the Material theme for Inputs.