On This Page

{#jumplink-list}  
[Markdown](/docs/cybs/en-us/digital-accept-flex/developer/all/rest/digital-accept-flex/uc-intro/uc-getting-started-ss-setup/uc-capture-context-intro.md)  
Filter  
FILTER BY TAG

Capture Context {#uc-capture-context-intro}
===========================================

This section contains the information you need to set up your server. Initializing `Unified Checkout` within your webpage begins with a server-to-server call to the sessions API. This step authenticates your merchant credentials, and establishes how the frontend components will function. The sessions API request contains parameters that define how `Unified Checkout` performs.  
The server-side component provides this information:

* A transaction-specific public key is used by the customer's browser to protect the transaction.
* An authenticated context description package that manages the payment experience on the client side. It includes available payment options such as card networks, payment interface styling, and payment methods.

The functions are compiled in a JSON Web Token (JWT) object referred to as the *capture context*.  
For information on JWTs see [JSON Web Tokens](/docs/cybs/en-us/digital-accept-flex/developer/all/rest/digital-accept-flex/uc-intro/uc-appendix/uc-appendix-jwts.md ""). The capture context request is a signed JSON Web Token (JWT) that includes all of the merchant-specific parameters. This request tells the frontend JavaScript library how to behave within your payment experience. The request provides authentication, one-time keys, the target origin to the `Unified Checkout` integration in addition to allowed card networks and payment types. The capture context request includes these elements:
* allowedCardNetworks
* allowedPaymentTypes
* clientVersion
* targetOrigin
* completeMandate

Browser Support
---------------

`Unified Checkout` supports these browser versions:

* Safari 16
* Firefox 121
* Google Chrome/Chium-based browsers 118
* Microsoft Edge 118

Capture Context Example {#uc-capture-context-intro_uc-capture-context-codeblock}
--------------------------------------------------------------------------------

Use the targetOrigins and the allowedPaymentTypes fields to define the target origin and the accepted digital payment methods in your capture context. Use the completeMandate to orchestrate follow-on services such as Payments, `Decision Manager`, `Payer Authentication`, and `TMS`. For example:

```
{
  "targetOrigins" : [ "https://test.com" ],
    "clientVersion": "0.34",
    "buttonType": "CHECKOUT_AND_CONTINUE",
    "allowedCardNetworks": [
        "VISA",
        "MASTERCARD"
    ],
    "allowedPaymentTypes": [
        "PANENTRY",
        "CLICKTOPAY",
        "APPLEPAY",
        "GOOGLEPAY"
    ],
    "completeMandate": {
        "type": "CAPTURE",
        "decisionManager": true,
        "consumerAuthentication": true,
        "tms": {
            "tokenCreate": true,
            "tokenTypes": [
                "customer",
                "paymentInstrument",
                "instrumentIdentifier",
                "shippingAddress"
            ]
        }
    },
    "country": "US",
    "locale": "en_US",
    "captureMandate": {
        "billingType": "FULL",
        "requestEmail": true,
        "requestPhone": true,
        "requestShipping": true,
        "shipToCountries": [
            "US",
            "GB"
        ],
        "showAcceptedNetworkIcons": true
    },
"data":
 {
    "orderInformation": {
        "billTo": {
            "country": "US",
            "firstName": "NEW",
            "lastName": "Test",
            "phoneNumber": "1234567890",
            "address2": "Desk M3-5573",
            "address1": "901 Metro Center Blvd",
            "buildingNumber": "150",
            "postalCode": "94404",
            "locality": "Foster City",
            "administrativeArea": "CA",
            "email": "test@example.com"
        },
        "shipTo": {
            "country": "US",
            "firstName": "NEW",
            "lastName": "Test",
            "address2": "Desk M3-5573",
            "address1": "901 Metro Center Blvd",
            "buildingNumber": "150",
            "postalCode": "94404",
            "locality": "Foster City",
            "administrativeArea": "CA"
        },
        "amountDetails": {
            "totalAmount": "13.00",
            "currency": "USD"
        }
    },
    "clientReferenceInformation": {
      "code": "TAGX001"
    }
  }
}
```

Card Entry Form {#uc-capture-context-intro_uc-capture-context-diagram}
----------------------------------------------------------------------

This diagram shows how elements of the capture context request appear in the card entry form.

#### Figure:

Anatomy of a Manual Card Entry Form ![Image of the capture context request code and how it appears in the
entry form elements.](/content/dam/new-documentation/documentation/en-us/topics/payments-processing/card-processing/unified-checkout/images/anatomy-of-manual-card-entry-form-685x575.svg/jcr:content/renditions/original)  
RELATED TO THIS PAGE