Step 2: Generate a client token for use with Embed

Before adding Embed to the web checkout, create a client token that can be used to authenticate the transaction.

Install a server-side SDK

Use the package manager in the preferred programming language to install the server-side SDK. Token generation can only be done server side and doing this client side is not recommended as it exposes the API key to customers.

C#

dotnet add package Gr4vy

Please always check and install the latest release of the preferred SDK.

Initialize the SDK client

Next, initialize the SDK with the ID of the instance and the private key.

C#

using Gr4vy;
using Gr4vy.Models.Components;
using System.Collections.Generic;

// Loaded the key from a file, env variable, 
// or anywhere else
var privateKey = "..."; 

var sdk = new Gr4vySDK(
    id: "example",
    server: SDKConfig.Server.Sandbox,
    bearerAuthSource: Auth.WithToken(privateKey),
    merchantAccountId: "default"
);

The instance ID is the unique identifier for the deployment of the system and is included in every API call. Together with the environment (sandbox or production) it is used to connect to the right APIs, as well as dashboard.

Generate a token

The next step is to create a new token for frontend authentication. The SDK comes with a helper function for exactly that purpose. It requires an amount and currency for the transaction to be created and additionally accepts either the ID of a buyer or an external identifier for a buyer to link the transaction to.

C#

using Gr4vy;

// Loaded the key from a file, env variable, 
// or anywhere else
var privateKey = "..."; 

var sdk = new Gr4vySDK(
    id: "example",
    server: SDKConfig.Server.Sandbox,
    bearerAuthSource: Auth.WithToken(privateKey),
    merchantAccountId: "default"
);

var checkoutSession = await sdk.CheckoutSessions.CreateAsync()

auth.get_embed_token(
    privatekey,
    embedParams=new Dictionary<string, object>
    {
        ["amount"]: 1299,
        ["currency"]: 'USD',
        ["buyer_external_identifier"]: 'user-1234',
    },
    checkoutSessionId=checkoutSession.ID
)

This token can now be served to the frontend where it is used by the SDK.

If generating the client token without using a server-side SDK is preferred, then please read the guide on manually generating a JWT.

Checkout sessions

Passing a checkout session ID to the Embed token function is recommended. This ID can be used to help identify multiple transaction attempts. This is useful to identify if one or more failed/declined transactions eventually result in a successful transaction. Checkout sessions can store also store cart_items, metadata, airline data, and more, removing the need to pass these values on the transaction request.

C#

using Gr4vy;
using Gr4vy.Models.Components;
using NodaTime;
using System;
using System.Collections.Generic;

// Init SDK

var res = await sdk.CheckoutSessions.CreateAsync(checkoutSessionCreate: new CheckoutSessionCreate() {
    CartItems = new List<CartItem>() {
        new CartItem() {
            Name = "GoPro HD",
            Quantity = 2,
            UnitAmount = 1299,
            DiscountAmount = 0,
            TaxAmount = 0,
            ExternalIdentifier = "goprohd",
            Sku = "GPHD1078",
            ProductUrl = "https://example.com/catalog/go-pro-hd",
            ImageUrl = "https://example.com/images/go-pro-hd.jpg",
            Categories = new List<string>() {
                "camera",
                "travel",
                "gear",
            },
            ProductType = "physical",
            SellerCountry = "GB",
        },
        new CartItem() {
            Name = "GoPro HD",
            Quantity = 2,
            UnitAmount = 1299,
            DiscountAmount = 0,
            TaxAmount = 0,
            ExternalIdentifier = "goprohd",
            Sku = "GPHD1078",
            ProductUrl = "https://example.com/catalog/go-pro-hd",
            ImageUrl = "https://example.com/images/go-pro-hd.jpg",
            Categories = new List<string>() {
                "camera",
                "travel",
                "gear",
            },
            ProductType = "physical",
            SellerCountry = "GB",
        },
        new CartItem() {
            Name = "GoPro HD",
            Quantity = 2,
            UnitAmount = 1299,
            DiscountAmount = 0,
            TaxAmount = 0,
            ExternalIdentifier = "goprohd",
            Sku = "GPHD1078",
            ProductUrl = "https://example.com/catalog/go-pro-hd",
            ImageUrl = "https://example.com/images/go-pro-hd.jpg",
            Categories = new List<string>() {
                "camera",
                "travel",
                "gear",
            },
            ProductType = "physical",
            SellerCountry = "US",
        },
    },
    Metadata = new Dictionary<string, string>() {
        { "cohort", "cohort-a" },
        { "order_id", "order-12345" },
    },
    Buyer = new GuestBuyerInput() {
        DisplayName = "John Doe",
        ExternalIdentifier = "buyer-12345",
        BillingDetails = new BillingDetailsInput() {
            FirstName = "John",
            LastName = "Doe",
            EmailAddress = "[e-mail]",
            PhoneNumber = "[phone]",
            Address = new Address() {
                City = "San Jose",
                Country = "US",
                PostalCode = "94560",
                State = "California",
                StateCode = "US-CA",
                HouseNumberOrName = "10",
                Line1 = "Stafford Appartments",
                Line2 = "29th Street",
                Organization = "Gr4vy",
            },
            TaxId = new TaxId() {
                Value = "12345678931",
                Kind = "ar.cuit",
            },
        },
        ShippingDetails = new ShippingDetailsCreate() {
            FirstName = "John",
            LastName = "Doe",
            EmailAddress = "[e-mail]",
            PhoneNumber = "[phone]",
            Address = new Address() {
                City = "San Jose",
                Country = "US",
                PostalCode = "94560",
                State = "California",
                StateCode = "US-CA",
                HouseNumberOrName = "10",
                Line1 = "Stafford Appartments",
                Line2 = "29th Street",
                Organization = "Gr4vy",
            },
        },
    },
});

// handle response

Checkout session expiry

Checkout sessions expire after 1 hour by default. Updating a checkout session does not extend the time.

Summary

In this step:

• Created a signed JWT token using a server-side SDK.
• Served the JWT token to the front-end app, where it is used by Embed.