Computop

Computop provides two payment button providers that route through the Computop payment gateway.

Computop:GooglePay

Renders a Google Pay button where gateway is fixed to 'computop' internally.

Options — ComputopGooglePayOptions

Based on GooglePayOptions with the following fields removed (Computop enforces them internally):

• gateway — always 'computop'
• billingAddressRequired — always true
• billingAddressParameters — always { format: 'FULL', phoneNumberRequired: true }

Field	Type	Required	Default	Description
totalAmount	number	Yes	—	Amount in minor units
currencyCode	string	Yes	—	ISO 4217 uppercase currency code
gatewayMerchantId	string	Yes	—	Merchant ID at Computop
countryCode	string	No	—	ISO 3166-1 alpha-2 merchant country code
merchantId	string	No	—	Google Pay merchant ID (required in production)
merchantName	string	No	—	Merchant name in payment sheet
allowedCardNetworks	string[]	No	['AMEX','DISCOVER','INTERAC','JCB','MASTERCARD','VISA']	Accepted card networks
allowedCardAuthMethods	string[]	No	['PAN_ONLY','CRYPTOGRAM_3DS']	Accepted auth methods
emailRequired	boolean	No	false	Request buyer's email
shippingAddressRequired	boolean	No	false	Request shipping address
callbackIntents	string[]	No	['PAYMENT_AUTHORIZATION']	Google Pay callback intents

Example

<div id="computop-googlepay-container"></div>

import { ExpressButtons } from 'collana-pay-js';

const buttons = ExpressButtons({
  providers: [
    {
      providerProtocolType: 'Computop',
      paymentMethodType: 'GooglePay',
      container: '#computop-googlepay-container',
      style: {
        buttonColor: 'black',
        buttonType: 'buy',
        buttonSizeMode: 'fill',
      },
      options: {
        totalAmount: 19300,       // €193.00
        currencyCode: 'EUR',
        countryCode: 'DE',
        gatewayMerchantId: 'mac_test',
        merchantName: 'My Shop',
        emailRequired: true,
      },
    },
  ],

  onClick: async (identity, paymentMethodData) => {
    const res = await fetch('/api/orders', {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify({ provider: identity, paymentMethodData }),
    });
    const order = await res.json();
    return { orderId: order.id };
  },

  onApprove: (data) => {
    window.location.href = `/order/success?id=${data.orderId}`;
  },

  onCancel: (identity) => {
    console.log('Computop Google Pay cancelled', identity);
  },

  onError: (error) => {
    console.error('Computop Google Pay error', error);
  },
});

buttons.render();

---

Computop:ApplePay

Renders an Apple Pay button via the Computop gateway using the W3C Payment Request API.

Requirement: HTTPS and Apple Pay domain validation are required. See Known Constraints — Apple Pay Requires HTTPS.

Options — ComputopApplePayOptions

Identical to ApplePayOptions. All fields are fully configurable.

Field	Type	Required	Default	Description
totalAmount	number	Yes	—	Amount in minor units
currencyCode	string	Yes	—	ISO 4217 currency code
countryCode	string	Yes	—	ISO 3166-1 alpha-2 merchant country code
merchantIdentifier	string	Yes	—	Apple Pay merchant identifier
merchantDisplayName	string	Yes	—	Displayed in the Apple Pay sheet
validateMerchantUrl	string	Yes	—	Backend URL for merchant session validation
supportedNetworks	string[]	No	['amex','discover','masterCard','visa']	Accepted card networks
billingAddressRequired	boolean	No	false	Request billing address
shippingAddressRequired	boolean	No	false	Request shipping address
requestPayerName	boolean	No	true	Request payer's name
requestPayerEmail	boolean	No	true	Request payer's email
requestPayerPhone	boolean	No	true	Request payer's phone

Example

<div id="computop-applepay-container"></div>

{
  providerProtocolType: 'Computop',
  paymentMethodType: 'ApplePay',
  container: '#computop-applepay-container',
  style: { buttonstyle: 'black', type: 'buy' },
  options: {
    totalAmount: 19300,
    currencyCode: 'EUR',
    countryCode: 'DE',
    merchantIdentifier: 'merchant.com.myshop',
    merchantDisplayName: 'My Shop',
    validateMerchantUrl: 'https://api.myshop.com/applepay/validate-merchant',
    billingAddressRequired: true,
  },
}