Card Tokenization

The Hellgate Cloud Web SDK Demo is a hosted front-end that drives the Web SDK flows end to end. Paste a session_id from your server, submit a card, and confirm the resulting token — all without building a browser integration first. Reach for it when you want to verify a session from your backend before wiring up the SDK in your own application. The workbench covers four flows, exposed as tabs at the top of the page: Card Tokenization, CVC2 Refresh, Card Elements, and 3DS. This page walks through the default Card Tokenization flow; the other tabs consume the same session and backend configuration.

Prerequisites

A session_id from your backend — see the Guardian and Commerce v2 examples on the right.

curl --request POST \
  --url https://<your-instance>.eu1.on-hellgate.cloud/api/pci/tokens \
  --header 'content-type: application/json' \
  --header 'authorization: Bearer <ACCESS_TOKEN>' \
  --data '{ "source": "session" }'

curl --request POST \
  --url https://sandbox.hellgate.io/tokens/session \
  --header 'content-type: application/json' \
  --header 'x-api-key: hlg-sbx-...'

{
  "id": "a9f4e2c0-12d0-4b73-8e8c-0f0f0f0f0f0f",
  "session_id": "7f2c9460-7e2e-403f-a08a-bc58cdcaea83",
  "status": "pending"
}

{
  "session_id": "7f2c9460-7e2e-403f-a08a-bc58cdcaea83"
}

Steps

Open the workbench

Visit https://demo.hellgate.dev/card. The page loads the same Web SDK you would embed in your own application.

Set the Backend Service URL

Use the Backend Service URL dropdown at the top of the page to match the environment that issued your session.There are built-in options (e.g. Sandbox (Shared Commerce v2)), which target the Test tier of the shared Hellgate Commerce v2 platform.For any other deployment — a dedicated Commerce v2 instance or a Guardian instance — enable the Custom URL toggle and enter the base URL of your backend (for example https://<your-instance>.eu1.on-hellgate.cloud).

Paste the Session ID

Paste the session_id into the Session ID field.

(Optional) Adjust form options

The remaining controls change how the SDK renders the card form. Leave them at their defaults unless you want to preview a specific layout:

Schemes — restrict the accepted card networks.
Card Layout — render the card fields as Single-line or Multi-line.
Expiration Fields — Combined month/year field or Separate fields.
Save my card — toggles the ephemeral flag passed to process(), so you can exercise the token lifecycle consent flow end-to-end.

Submit the card

Click Test Card, fill in the card details in the rendered form, and submit.

Inspect the result

On success the workbench shows the resulting token. Confirm the same record through your own integration — for example by fetching it through the relevant product’s API or viewing it in the Hellgate dashboard.

Next steps

Once the workbench flow succeeds, port the same session-plus-SDK pattern into your own application:

Web SDK Overview — initialize the SDK and render the card form.
Web SDK API — detailed handler and event reference.

SDKs

Testing

Prerequisites

Steps

Next steps

​Prerequisites

​Steps

​Next steps

Prerequisites

Steps

Next steps