Create Payment Token (3DS)

<form id="payment-form"> 
    <input data-ccbill="firstName" />
    <input data-ccbill="lastName" />
    <input data-ccbill="postalCode" />   
    <input data-ccbill="amount" /> 
    <input data-ccbill="country" /> 
    <input data-ccbill="email" /> 
    <input data-ccbill="cardNumber" /> 
    <input data-ccbill="currencyCode" /> 
    <input data-ccbill="expYear" /> 
    <input data-ccbill="expMonth" /> 
    <input data-ccbill="nameOnCard" /> 
    <input data-ccbill="cvv2" /> 
</form>

<form id="payment-form">
    <input id="_ccbillId_firstName" />
    <input id="_ccbillId_lastName" />
    <input id="_ccbillId_postalCode" />    
    <input id="_ccbillId_amount" />
    <input id="_ccbillId_country" />
    <input id="_ccbillId_email" />
    <input id="_ccbillId_cardNumber" />
    <input id="_ccbillId_expYear" />
    <input id="_ccbillId_currencyCode" /> 
    <input id="_ccbillId_expMonth" />
    <input id="_ccbillId_nameOnCard" />
    <input id="_ccbillId_cvv2" />
</form>

<form id="payment-form">
    <input id="custom_firstName_id" />
    <input id="custom_lastName_id" />
    <input id="custom_postalCode_id" />
    <input id="custom_amount_id" /> 
    <input id="custom_country_id" /> 
    <input id="custom_email_id" /> 
    <input id="custom_cardNumber_id" />
    <input id="custom_currencyCode_id" /> 
    <input id="custom_expYear_id" /> 
    <input id="custom_expMonth_id" /> 
    <input id="custom_nameOnCard_id" /> 
    <input id="custom_cvv2_id" /> 
</form>
<script>
// map custom ids to relevant fields
const customIds = {
    firstName: "custom_firstName_id",
    lastName: "custom_lastName_id",
    postalCode: "custom_postalCode_id",
    amount: "custom_amount_id",
    country: "custom_country_id",
    email: "custom_email_id",
    currencyCode: "custom_currencyCode_id",
    cardNumber: "custom_cardNumber_id",
    expYear: "custom_expYear_id", 
    expMonth: "custom_expMonth_id", 
    nameOnCard: "custom_nameOnCard_id",
    cvv2: "custom_cvv2_id"
};

// pass custom ids to Widget constructor
const widget = new ccbill.CCBillAdvancedWidget("application_id", customIds);

// call the desired Widget method

</script>

curl -X POST 'https://api.ccbill.com/ccbill-auth/oauth/token' \
  -u '[Frontend_Merchant_Application_ID]:[Frontend_Secret_Key]' \
  -H 'Content-Type: application/x-www-form-urlencoded' \
  -d 'grant_type=client_credentials'

String getOAuthToken() {
    String credentials = Base64.getEncoder()
        .encodeToString(("[Frontend_Merchant_Application_ID]" + ":" + "[Frontend_Secret_Key]")
        .getBytes(StandardCharsets.UTF_8));
    String requestBody = "grant_type=client_credentials";

    HttpRequest request = HttpRequest.newBuilder()
            .uri(URI.create("https://api.ccbill.com/ccbill-auth/oauth/token"))
           .header("Authorization", "Basic " + credentials)
            .header("Content-Type", "application/x-www-form-urlencoded")
           .POST(HttpRequest.BodyPublishers.ofString(requestBody, StandardCharsets.UTF_8))
            .build();

    try {
        HttpResponse<String> response = HTTP_CLIENT.send(request, HttpResponse.BodyHandlers.ofString());
        return extractAccessToken(response.body());
    } catch (IOException | InterruptedException e) {
        e.printStackTrace();
        return null;
    }
}

<?php

function getOAuthToken() {
    $url = "https://api.ccbill.com/ccbill-auth/oauth/token";
    $merchantAppId = "[Frontend_Merchant_Application_ID]";
    $secretKey = "[Frontend_Secret_Key]";
    $data = http_build_query(["grant_type" => "client_credentials"]);

    try {
        $httpRequest = new HttpRequest();
        $httpRequest->setUrl($url);
        $httpRequest->setMethod(HTTP_METH_POST);
        $httpRequest->setHeaders([
            "Authorization" => "Basic " . base64_encode("$merchantAppId:$secretKey"),
            "Content-Type" => "application/x-www-form-urlencoded"
        ]);
        $httpRequest->setBody($data);

        $httpClient = new HttpClient();
        $response = $httpClient->send($httpRequest);
        
        $responseData = json_decode($response->getBody(), true);
        return $responseData['access_token'] ?? die("Error: Invalid OAuth response.");
    } catch (HttpException $ex) {
        die("Error fetching OAuth token: " . $ex->getMessage());
    }
}

?>

curl -X POST 'https://api.ccbill.com/transactions/payment-tokens/threeds/[payment_token_id]' \
  -H 'Accept: application/vnd.mcn.transaction-service.api.v.2+json' \
  -H 'Authorization: Bearer [Backend_Access_Token]' \
  -H 'Cache-Control: no-cache' \
  -H 'Content-Type: application/json' \
  -d '{
    "clientAccnum": [Your_Client_Account_Number],
    "clientSubacc": [Your_Client_Subaccount_Number],
    "initialPrice": 9.99,
    "initialPeriod": 30,
    "currencyCode": 978,
    "threedsEci": "05",
    "threedsStatus": "Y",
    "threedsSuccess": true,
    "threedsVersion": "2.2.0",
    "threedsAmount": 9.99,
    "threedsClientTransactionId": "id-wl9r6duc5zj",
    "threedsCurrency": "840",
    "threedsSdkTransId": "d535b6d1-19f9-11f0-92b9-0242ac110005",
    "threedsAcsTransId": "ca5f9649-b865-47ce-be6f-54422a0fce47",
    "threedsDsTransId": "e3693b86-8217-48c6-9628-2e8852dc60d4",
    "threedsAuthenticationType": "",
    "threedsAuthenticationValue": "Pes4aJnpT+1mjhUoBynC92iQbeg="
  }'

public ResponseEntity<String> processPurchase3ds() {
    String requestBody = """
        {
            "clientAccnum": [Your_Client_Account_Number],
            "clientSubacc": [Your_Client_Subaccount_Number],
            "initialPrice": 9.99,
            "initialPeriod": 30,
            "currencyCode": 978,
            "threedsEci": "05",
            "threedsStatus": "Y",
            "threedsSuccess": true,
            "threedsVersion": "2.2.0",
            "threedsAmount": 9.99,
            "threedsClientTransactionId": "id-wl9r6duc5zj",
            "threedsCurrency": "840",
            "threedsSdkTransId": "d535b6d1-19f9-11f0-92b9-0242ac110005",
            "threedsAcsTransId": "ca5f9649-b865-47ce-be6f-54422a0fce47",
            "threedsDsTransId": "e3693b86-8217-48c6-9628-2e8852dc60d4",
            "threedsAuthenticationType": "",
            "threedsAuthenticationValue": "Pes4aJnpT+1mjhUoBynC92iQbeg="
        }""";

    HttpRequest request = HttpRequest.newBuilder()
            .uri(URI.create("https://api.ccbill.com/transactions/payment-tokens/threeds/[payment_token_id]"))
            .header("Accept", "application/vnd.mcn.transaction-service.api.v.2+json")
            .header("Authorization", "Bearer [Backend_Access_Token]")
            .header("Cache-Control", "no-cache")
            .header("Content-Type", "application/json")
            .POST(HttpRequest.BodyPublishers.ofString(requestBody, StandardCharsets.UTF_8))
            .build();

    try {
        HttpResponse<String> response = client.send(request, HttpResponse.BodyHandlers.ofString());
        return ResponseEntity.ok(response.body());
    } catch (IOException | InterruptedException e) {
        e.printStackTrace();
        return ResponseEntity.status(500).body("Error processing payment");
    }
}

<?php

function processPurchase3ds() {
    $url = "https://api.ccbill.com/transactions/payment-tokens/threeds/[payment_token_id]";
    $paymentData = json_encode([
        "clientAccnum" => [Your_Client_Account_Number],
        "clientSubacc" => [Your_Client_Subaccount_Number],
        "initialPrice" => 9.99,
        "initialPeriod" => 30,
        "threedsEci" => "05",
        "threedsStatus" => "Y",
        "threedsSuccess" => true,
        "threedsVersion" => "2.2.0",
        "threedsAmount" => 9.99,
        "threedsClientTransactionId" => "id-wl9r6duc5zj",
        "threedsCurrency" => "840",
        "threedsSdkTransId" => "d535b6d1-19f9-11f0-92b9-0242ac110005",
        "threedsAcsTransId" => "ca5f9649-b865-47ce-be6f-54422a0fce47",
        "threedsDsTransId" => "e3693b86-8217-48c6-9628-2e8852dc60d4",
        "threedsAuthenticationType" => "",
        "threedsAuthenticationValue" => "Pes4aJnpT+1mjhUoBynC92iQbeg="
    ]);

    try {
        $httpRequest = new HttpRequest();
        $httpRequest->setUrl($url);
        $httpRequest->setMethod(HTTP_METH_POST);
        $httpRequest->setHeaders([
            "Accept" => "application/vnd.mcn.transaction-service.api.v.2+json",
            "Authorization" => "Bearer [Backend_Access_Token]",
            "Cache-Control" => "no-cache",
            "Content-Type" => "application/json"
        ]);
        $httpRequest->setBody($paymentData);

        $httpClient = new HttpClient();
        $response = $httpClient->send($httpRequest);
        
        return $response->getBody();
    } catch (HttpException $ex) {
        die("Error charging payment token: " . $ex->getMessage();
    }
}

?>

async function fetchOAuthToken() {
    return (await (await fetch('https://your-website.com/api/auth-token')).json()).token;
}

async function checkIfScaRequired(widget, authToken, clientAccnum, clientSubacc) {
    const scaRequiredResponse = await widget.isScaRequired(authToken, clientAccnum, clientSubacc);
    return await scaRequiredResponse.json();
}

async function authenticate(widget, authToken, clientAccnum, clientSubacc) {
    return await widget.authenticateCustomer(authToken, clientAccnum, clientSubacc);
}

async function createPaymentToken(widget, authToken, clientAccnum, clientSubacc) {
    const paymentTokenResponse = await widget.createPaymentToken(
        authToken,
        clientAccnum,
        clientSubacc
    );
    return await paymentTokenResponse.json();
}

async function chargePaymentToken(paymentToken) {
    return await (await (fetch('https://your-website.com/api/purchase', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json'
        },
        body: JSON.stringify({
            paymentToken,
            amount: 9.99,
            currency: 840
        })
    }))).json();
}

async function chargePaymentToken3ds(paymentToken, threedsInformation) {
    return await (await (fetch('https://your-website.com/api/purchase-3ds', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json'
        },
        body: JSON.stringify({
            paymentToken,
            threedsInformation,
            amount: 9.99,
            currency: 840
        })
    }))).json();
}

async function authenticateAndPurchase() {
    const widget = new ccbill.CCBillAdvancedWidget('your-application-id');
    const clientAccnum = [Your_Client_Account_Number];
    const clientSubacc = [Your_3DS_Client_Subaccount_Number];
 
    try {
        // retrieval of the auth token from merchant provided endpoint
        // this should be done as late in the submission process as possible to avoid potential exploit.
        const authToken = await fetchOAuthToken();
 
        let threedsInformation;
        // check if 3DS is required and process the 3DS flow with the client if necessary
        const scaRequired = await checkIfScaRequired(widget, authToken, clientAccnum, clientSubacc);
        if (scaRequired) {
   // go through 3DS flow
            threedsInformation = await authenticate(widget, authToken, clientAccnum, clientSubacc);
        }
 
        // create the payment token to be submitted to the merchant owned endpoint
        const paymentToken = await createPaymentToken(widget, authToken, clientAccnum, scaRequired ? clientSubacc : [Your_Client_Subaccount_Number]);
 
        // submit the payment token and 3DS information to the back-end endpoint implementing charging of the token
        const chargeCallResponse = scaRequired ? await chargePaymentToken3ds(paymentToken, threedsInformation)
            : await chargePaymentToken(paymentToken);
        return Promise.resolve(chargeCallResponse);
    } catch (error) {
        // react to any errors that may occur during the process
        return Promise.reject({error});
    }
}

let result = await authenticateAndPurchase();

import java.io.IOException;
import java.net.URI;
import java.net.http.HttpClient;
import java.net.http.HttpRequest;
import java.net.http.HttpResponse;
import java.nio.charset.StandardCharsets;
import java.time.Duration;
import java.util.Base64;
import org.springframework.web.bind.annotation.*;
import org.springframework.http.ResponseEntity;
import com.fasterxml.jackson.databind.JsonNode;
import com.fasterxml.jackson.databind.ObjectMapper;

@RestController
@RequestMapping("/api")
public class ApiController {

    private static final HttpClient HTTP_CLIENT = HttpClient.newBuilder()
            .connectTimeout(Duration.ofSeconds(10))
            .build();

    @PostMapping("/auth-token")
    public ResponseEntity<AuthTokenResponse> getAuthToken() {
        String accessToken = fetchOAuthToken("[Frontend_Merchant_Application_ID]", "[Frontend_Secret_Key]");
        if (accessToken != null) {
            return ResponseEntity.ok(new AuthTokenResponse(accessToken));
        } else {
            return ResponseEntity.status(500).body(new AuthTokenResponse(""));
        }
    }
    
    @PostMapping("/purchase")
    public ResponseEntity<String> processPurchase(@RequestBody PurchaseRequest purchaseRequest) {
        String requestBody = String.format(
                """
                {
                  "clientAccnum": %d,
                  "clientSubacc": %d,
                  "initialPrice": %.2f,
                  "initialPeriod": 30,
                  "currencyCode": %d
                }
                """,
                purchaseRequest.paymentToken().clientAccnum(),
                purchaseRequest.paymentToken().clientSubacc(),
                purchaseRequest.amount(),
                purchaseRequest.currency()
        );

        HttpRequest request = HttpRequest.newBuilder()
                .uri(URI.create("https://api.ccbill.com/transactions/payment-tokens/" 
                    + purchaseRequest.paymentToken().paymentTokenId()))
                .header("Accept", "application/vnd.mcn.transaction-service.api.v.2+json")
                .header("Authorization", "Bearer " 
                    + fetchOAuthToken("[Backend_Merchant_Application_ID]", "[Backend_Secret_Key]"))
                .header("Cache-Control", "no-cache")
                .header("Content-Type", "application/json")
                .POST(HttpRequest.BodyPublishers.ofString(requestBody, StandardCharsets.UTF_8))
                .build();

        try {
            HttpResponse<String> response = HTTP_CLIENT.send(request, HttpResponse.BodyHandlers.ofString());
            return ResponseEntity.ok(response.body());
        } catch (IOException | InterruptedException e) {
            e.printStackTrace();
            return ResponseEntity.status(500).body("Error processing payment");
        }
    }

    @PostMapping("/purchase-3ds")
    public ResponseEntity<String> processPurchase3ds(@RequestBody PurchaseRequest3ds purchaseRequest3ds) {
        String requestBody = String.format(
                """
                {
                  "clientAccnum": %d,
                  "clientSubacc": %d,
                  "initialPrice": %.2f,
                  "initialPeriod": 10,
                  "currencyCode": "%s",
                  "threedsEci": "%s",
                  "threedsStatus": "%s",
                  "threedsSuccess": %b,
                  "threedsVersion": "%s",
                  "threedsAmount": %.2f,
                  "threedsClientTransactionId": "%s",
                  "threedsCurrency": "%s",
                  "threedsSdkTransId": "%s",
                  "threedsAcsTransId": "%s",
                  "threedsDsTransId": "%s",
                  "threedsAuthenticationType": "%s",
                  "threedsAuthenticationValue": "%s"
                }
                """,
                purchaseRequest3ds.paymentToken().clientAccnum(),
                purchaseRequest3ds.paymentToken().clientSubacc(),
                purchaseRequest3ds.amount(),
                purchaseRequest3ds.currency(),
                purchaseRequest3ds.threedsInformation().eci(),
                purchaseRequest3ds.threedsInformation().status(),
                purchaseRequest3ds.threedsInformation().success(),
                purchaseRequest3ds.threedsInformation().protocolVersion(),
                purchaseRequest3ds.threedsInformation().amount(),
                purchaseRequest3ds.threedsInformation().clientTransactionId(),
                purchaseRequest3ds.threedsInformation().currency(),
                purchaseRequest3ds.threedsInformation().sdkTransId(),
                purchaseRequest3ds.threedsInformation().acsTransId(),
                purchaseRequest3ds.threedsInformation().dsTransId(),
                purchaseRequest3ds.threedsInformation().authenticationType(),
                purchaseRequest3ds.threedsInformation().authenticationValue()
        );

        HttpRequest request = HttpRequest.newBuilder()
                .uri(URI.create("https://api.ccbill.com/transactions/payment-tokens/threeds/"
                    + purchaseRequest.paymentToken().paymentTokenId()))
                .header("Accept", "application/vnd.mcn.transaction-service.api.v.2+json")
                .header("Authorization", "Bearer " 
                    + fetchOAuthToken("[Backend_Merchant_Application_ID]", "[Backend_Secret_Key]"))
                .header("Cache-Control", "no-cache")
                .header("Content-Type", "application/json")
                .POST(HttpRequest.BodyPublishers.ofString(requestBody, StandardCharsets.UTF_8))
                .build();

        try {
            HttpResponse<String> response = HTTP_CLIENT.send(request, HttpResponse.BodyHandlers.ofString());
            return ResponseEntity.ok(response.body());
        } catch (IOException | InterruptedException e) {
            e.printStackTrace();
            return ResponseEntity.status(500).body("Error processing payment");
        }
    }

    private static String fetchOAuthToken(String merchantAppId, String sercretKey) {
        String credentials = Base64.getEncoder()
            .encodeToString((merchantAppId + ":" + sercretKey).getBytes(StandardCharsets.UTF_8));
        String requestBody = "grant_type=client_credentials";

        HttpRequest request = HttpRequest.newBuilder()
                .uri(URI.create("https://api.ccbill.com/ccbill-auth/oauth/token"))
                .header("Authorization", "Basic " + credentials)
                .header("Content-Type", "application/x-www-form-urlencoded")
                .POST(HttpRequest.BodyPublishers.ofString(requestBody, StandardCharsets.UTF_8))
                .build();

        try {
            HttpResponse<String> response = HTTP_CLIENT.send(request, HttpResponse.BodyHandlers.ofString());
            return extractAccessToken(response.body());
        } catch (IOException | InterruptedException e) {
            e.printStackTrace();
            return null;
        }
    }

    private static String extractAccessToken(String responseBody) {
        try {
            ObjectMapper objectMapper = new ObjectMapper();
            JsonNode jsonNode = objectMapper.readTree(responseBody);
            return jsonNode.has("access_token") ? jsonNode.get("access_token").asText() : null;
        } catch (IOException e) {
            e.printStackTrace();
            return null;
        }
    }

    private record AuthTokenResponse(String token) {}
    private record PurchaseRequest(double amount, String currency, PaymentToken paymentToken) {}
    private record PurchaseRequest3ds(double amount, String currency, PaymentToken paymentToken, 
        ThreedsInformation threedsInformation) {}
    private record PaymentToken(String paymentTokenId, Integer clientAccnum, Integer clientSubacc) {}
    private record ThreedsInformation(String eci, String status, boolean success, String protocolVersion, 
        double amount, String clientTransactionId, String currency, String sdkTransId, String acsTransId, 
        String dsTransId, String authenticationType, String authenticationValue) {}
}