---
title: Install and configure AuthorizeTokenEx
slug: commerce-connect-15/docs/install-and-configure-authorizetokenex
docTags: 
createdAt: 2026-07-30T20:34:40.000Z
---

AuthorizeTokenEx is a payment provider for Optimizely Commerce Connect that combines Authorize.Net for payment processing with TokenEx for PCI-compliant tokenization. To install and deploy the AuthorizeTokenEx payment provider, follow the steps in this article.

:::hint{type="info"}
**Note**
The AuthorizeTokenEx payment provider does not support subscriptions (payment plans).
:::

## Download the source packages

Download or clone the [Commerce Connect Payment Providers repository on GitHub](https://github.com/episerver/CommercePaymentGateways). It contains open-sourced payment gateways for Optimizely Commerce Connect, including the AuthorizeTokenEx payment provider projects described in this article.

:::hint{type="info"}
**Note**
AuthorizeTokenEx requires Commerce Connect version 13.29.0 or later.
:::

The repository contains the following AuthorizeTokenEx projects:

- `EPiServer.Commerce.Payment.AuthorizeTokenEx` — Contains `AuthorizeTokenExPayment` and `AuthorizeTokenExGateway`. Deploy to both Commerce Manager and the front-end site.
- `EPiServer.Commerce.Payment.AuthorizeTokenEx.CSR` — Contains the API controller and React components. Deploy to the front-end site.

To add the projects to your solution, follow the steps in the next sections.

## Build the AuthorizeTokenEx project

1. Open the `AuthorizeTokenEx` project and save the solution.
2. Rebuild the solution and confirm that the `AuthorizeNet` and `EPiServer.Commerce.Core` packages are installed from NuGet. To install them manually, run the following Package Manager Console commands:

```powershell
Install-Package AuthorizeNet -version 1.9.4
Install-Package EPiServer.Commerce.Core
```

3. Rebuild the `AuthorizeTokenEx` project. The build produces `EPiServer.Commerce.Payment.AuthorizeTokenEx.dll` and `AuthorizeNet.dll`.

### Project structure

The project contains the following files and folders:

![](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/RS1S9pS_CIWcKZB_1acLa-20260723-094600.png)

- `AuthorizeTokenExService.cs` — Performs Authorize.Net operations integrated with TokenEx.
- `AuthorizeNetTokenExCimBasedManager.cs` — Implements the operations used by `AuthorizeTokenExGateway`.
- `AuthorizeTokenExGateway.cs` — Main payment gateway implementation.
- `ConfigurePayment.ascx` — Commerce Manager payment-method editor UI.

## Build the AuthorizeTokenEx.CSR project

1. Open the `AuthorizeTokenEx.CSR` project and save the solution.
2. Rebuild the solution. NuGet should restore the `AuthorizeNet` and `EPiServer.Commerce.Core` packages automatically. If they are not restored, install them manually with the Package Manager Console commands shown above.
3. Rebuild the `EPiServer.Commerce.Payment.AuthorizeTokenEx.CSR` project. The build produces `EPiServer.Commerce.Payment.AuthorizeTokenEx.CSR.dll`.

The key build artifact is `CSRExtensibility/react-app/dist/tokenExPayment.min.js`, deployed to the front-end site. It contains the TokenEx payment-method component for the Order Management (CSR) user interface and the `TokenExConfiguration` registration shown below.

Register the TokenEx scripts with the Order Management UI by adding a configuration class:

```csharp
using EPiServer.Commerce.UI.CustomerService.Extensibility;
using EPiServer.ServiceLocation;

namespace EPiServer.Commerce.Payment.AuthorizeTokenEx.CSR
{
    [ServiceConfiguration(typeof(CSRUIExtensionConfiguration))]
    public class TokenExConfiguration : CSRUIExtensionConfiguration
    {
        public TokenExConfiguration() => ResourceScripts = new string[]
        {
            "/CSRExtensibility/react-app/dist/tokenExPayment.min.js",
            "https://htp.tokenex.com/Iframe/iframe-v3.min.js"
        };
    }
}
```

### Project structure

The project contains the following files and folders:

![](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/nNp5ky18zvreNKS-WzYw8-20260723-094600.png)

- `Controllers/TokenExApiController.cs` — Generates the TokenEx configuration on demand.
- `Controllers/TokenExPaymentsControllerBase.cs` — Base controller for processing TokenEx payments.
- `Controllers/OrderTokenExPaymentsController.cs` — Processes TokenEx payments for an order. TokenEx does not support subscriptions.
- `CSRExtensibility/` — Contains the React application for the TokenEx component, built on the Order Management (CSR) extensibility feature.
- `Models/TokenExIframeConfigModel.cs` — Model for the TokenEx iFrame configuration sent to the client.
- `Models/TokenizationPaymentModel.cs` — Model representing a tokenized payment.
- `TokenExConfiguration.cs` — Registers TokenEx scripts with the Order Management (CSR) user interface (the same class shown in the code block above).

## Set up Commerce Manager

1. Open the `Commerce Manager Apps` folder in the `Optimizely Commerce Manager` project.
2. Deploy `ConfigurePayment.ascx` to the `Apps/Order/Payments/Plugins/AuthorizeTokenEx` folder. If the `AuthorizeTokenEx` folder does not exist, create it.
3. Deploy `AuthorizeNet.dll` and `EPiServer.Business.Commerce.Payment.Authorize.dll` to the `bin` folder of your Commerce Manager site.
4. In your solution's Commerce Manager project, add references to the deployed DLLs and rebuild.

### Configure AuthorizeTokenEx in Commerce Manager

After you deploy the files described in the previous section, open the Commerce Manager back-end site and follow these steps:

1. Go to **Administration** > **Order System** > **Payments**, then select the language for which you want to enable the AuthorizeTokenEx payment method (for example, **English (United States)**).
2. Click **New** to create a payment method.
   - For **System Keyword**, enter `AuthorizeTokenEx` (the name of the folder you created during deployment).
   - For **Class Name**, select `EPiServer.Business.Commerce.Payment.Authorize.AuthorizeTokenizationGateway` from the drop-down list.
   - For **Payment Class**, select `EPiServer.Commerce.Order.Payments.Internal.TokenizationPayment` from the drop-down list.

![](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/jlCsPFWQbFiDG_yKihzur_4e5ce7cce0c2392de15c732e2c9da239db19ab16008ee57ed20674369bfa2b43-image.png)

3. Click **OK** to save the AuthorizeTokenEx payment method.
4. Open the AuthorizeTokenEx payment method for additional editing.
5. Go to the **Parameters** tab and enter the following:
   - **API UserId** — The API user name that Authorize.Net provides when you register for API access.
   - **Transaction Key** — Your Authorize.Net API user password.

## Configure AuthorizeTokenEx on the front-end site

1. Open your front-end site project.
2. Deploy `AuthorizeNet.dll`, `EPiServer.Commerce.Payment.Authorize.dll`, and `EPiServer.Commerce.Payment.AuthorizeTokenEx.CSR.dll` to the `bin` folder of your front-end site.
3. In your front-end site project of your solution, add references to the deployed DLLs and rebuild.
4. In the root folder of the front-end site project, create the folder path `CSRExtensibility/react-app/dist` and copy `tokenExPayment.min.js` into it.

:::hint{type="info"}
**Note**
You can change the location for `tokenExPayment.min.js`, but remember to update `TokenExConfiguration.cs` correspondingly.
:::

5. Edit the `appSettings` section of `web.config` to add the following keys:
   - `episerver:tokenization.TokenizationId` — Your TokenEx account ID.
   - `episerver:tokenization.ClientSecretKey` — Your TokenEx client secret key.
   - `episerver:tokenization.ApiKey` — Your TokenEx API key.
   - `episerver:tokenization.TestMode` — `true` for the TokenEx sandbox, `false` for production.

:::hint{type="info"}
**Note**
The front-end site must run on HTTPS to use AuthorizeTokenEx.
:::