Prerequisites (once per merchant/environment)

You need the following credentials and configuration elements before calling the SIBS SPG APIs:

• AuthToken : (used as Authorization: Bearer <AuthToken> for REST calls),
• TerminalId : the terminal ID assigned to the merchant, by the SIBS OnBoarding team
• X-IBM-Client-Id : merchant application identifier assigned by the SIBS OnBoarding team

Choose environment root URLs (you will use them in the API base URL and in the widget URL).

Please refer to the API Requests documentation page for more information.

API Request Flow

1) Prepare the checkout (server-to-server)

Goal: Create the checkout session in SIBS SPG and obtain the identifiers required to render the hosted Credit Card payment form.

What you do

1.1 POST Checkout Payment to:

curl -X POST "https://api.qly.sibspayments.com/sibs/spg/v2/payments" \
  --header "Authorization: Bearer <AuthToken>" \
  --header "X-IBM-Client-Id: <ClientId>" \
  --header "Content-Type: application/json" \
  --header "Accept: application/json" \
  --data '{
    "merchant": {
      "terminalId": "<terminalId>",
      "channel": "web",
      "merchantTransactionId": "teste 123"
    },
    "transaction": {
      "transactionTimestamp": "<currentDateISO>",
      "description": "Teste",
      "moto": false,
      "paymentType": "PURS",
      "amount": {
        "value": "<amount>",
        "currency": "EUR"
      },
      "paymentMethod": [
        "CARD"
      ]
    },
    "customer": {
      "customerInfo": {
        "customerName": "Onboarding",
        "customerEmail": "Onboarding@teste.com",
        "shippingAddress": {
          "street1": "Rua 123",
          "street2": "Porta 456",
          "city": "Lisboa",
          "postcode": "1200-999",
          "country": "PT"
        },
        "billingAddress": {
          "street1": "First street",
          "street2": "Menef Square",
          "city": "Lisbon",
          "postcode": "1700-123",
          "country": "PT"
        }
      }
    }
  }'

Headers

• Authorization: Bearer <AuthToken>
• X-IBM-Client-Id: <ClientId>
• Content-Type: application/json
• Accept: application/json

What you do in this step

• Create a new payment session.
• Define the payment type (PURS for one-off purchase).
• Restrict the payment method to "CARD".
• Provide customer information as required by the merchant configuration defined during onboarding.
• Send the total amount and currency.

This call registers the payment and prepares the transaction for the hosted form.

1.2. Store from the successful response:

From the Checkout response, you must store:

• transactionID : (you’ll inject it in the widget script URL)
• transactionSignature : (you’ll inject it into the HTML form attribute)
• formContext : (you’ll inject it into the HTML form attribute)
• paymentMethodList : (SIBS SPG may also return available methods)

These values are required to:

• Load the SIBS SPG widget
• Render the payment form
• Perform server-side status validation

Notes

• merchantTransactionId is your internal order identifier (max 35 characters).
• paymentType must be "PURS" for one-off purchase
• The customer.customerInfo block is required for Credit Card transactions according to the merchant configuration defined during onboarding.
• The checkout session expires after 10 minutes. If the session expires, a new checkout must be created.

2) Create the payment form link (Widget) + customization (front-end)

Goal: Render the SIBS SPG payment form and allow the customer to select Credit Card and complete the payment flow.

2.1 Include the SIBS SPG widget script (using transactionID)

Add the script tag to your checkout page:

<script src="https://spg.qly.site1.sibs.pt/assets/js/widget.js?id={transactionID}"></script>

This is the standard Form Integration approach and the script URL includes the transactionID.

2.2 Add the <form> element and inject formContext + transactionSignature + config/style

You must have a form with class paymentSPG and the SIBS SPG attributes:

<form class="paymentSPG"
      spg-context="{formContext}"
      spg-signature="{transactionSignature}"
      spg-config="{formConfig}"
      spg-style="{formStyle}">
</form>

SIBS SPG explicitly defines:

• spg-context : the formContext you received from Checkout
• spg-signature : the transactionSignature you received from Checkout
• spg-config : merchant configuration (JSON string),
• spg-style : optional styling configuration (JSON string).

2.3 formConfig – minimal config for Credit Card one-time

At minimum, your config should:

• Restrict the form to Credit Card using paymentMethodList
• Set redirectUrl (where the customer returns after the form finishes)
• The amount is defined in the Checkout request and does not need to be redefined in formConfig.
• Set language to match your checkout language.

Example (conceptual):

const formConfig = JSON.stringify({
  paymentMethodList: ["CARD"],
  redirectUrl: "https://merchant.example.com/payment-return",
  language: "en"
});

Supported values for paymentMethodList include MBWAY, REFERENCE, CARD (display depends on merchant permissions).

2.4 formStyle – optional UI customization

If you want to align the SIBS SPG form with your brand, SIBS SPG supports a style object with parameters like layout/theme/colors/font.
Example (conceptual):

const formStyle = JSON.stringify({
  layout: "default",
  theme: "light",
  color: { 
      primary: "#0033A1" 
  }
});

Optional: react to “Pay” click events in real time

SIBS SPG supports event monitoring via window.postMessage from the iframe so you can show a spinner / tracking / UX actions when the user clicks “Pay”.

What Happens After Form Submission?

1. The customer enters card details in the hosted form.
2. The transaction is sent to the acquiring network.
3. Strong Customer Authentication (3D Secure) may be automatically triggered by the issuer.
4. The issuing bank approves or declines the transaction.
5. The customer is redirected to the configured redirectUrl.
6. The final payment status must be confirmed server-to-server (Step 3).

Credit Card Behaviour

• Credit Card is a real-time payment method.
• Authorization response is typically immediate in non-3DS scenarios.
• 3D Secure authentication may introduce a short processing period.
• The transaction may temporarily remain in Pending only while the 3D Secure authentication result is being processed by SPG.
• The payment must only be considered completed when paymentStatus = Success.

Notes

• The hosted form is PCI DSS compliant and securely handled by SIBS SPG.
• All cardholder data (PAN, secureCode, validationDate, cardholderName) is collected exclusively inside the SIBS SPG environment.
• Card data never touches the merchant server, significantly reducing PCI DSS scope.
• If the checkout session expires (10 minutes), the hosted form will no longer load correctly, and a new checkout session must be created.
• Even after redirection, the final transaction result must always be validated via the status endpoint.

3) CHECK PAYMENT STATUS (BACK-END)

Goal: Confirm the final payment outcome after the customer completes the Credit Card payment flow.

Even though Credit Card is a real-time payment method, the final result must always be validated server-to-server.

3.1 When to check status

You should verify the transaction status:

• After the customer is redirected to the redirectUrl
• After receiving a Merchant Notification (if configured)

Unlike Multibanco Reference, Credit Card payments do not remain pending for extended periods.

However:

• During 3D Secure authentication, the transaction may temporarily remain in Pending while the authentication result is being processed by SPG.

The transaction must only be considered finalized after confirming the status via API.

3.2 Status endpoints you can use

SIBS SPG documents two common options:

• GET /api/v2/payments/{id}/status (where {id} is transactionID)
• GET /api/v2/payments/status?merchantTransactionId=... (query by your merchant transaction id)

curl -v -X GET "https://api.qly.sibspayments.com/sibs/spg/v2/payments/{transactionID}/status" \
--header "X-IBM-Client-Id: b824198a-321c-4f53-9bcb-832281d95735" \
--header "Authorization: ••••••" \
--header "Accept: application/json" \
--header "Content-Type: application/json"

Where s2iCzUbsAAs5CSjzSFVE is the transactionID is the value obtained in the checkout request.

3.3 Required headers (status call)

• Authorization: Bearer <AuthToken>
• X-IBM-Client-Id: <clientid>
• Content-Type: application/json
• Accept: application/json

3.4 What statuses to expect (high level)

The response includes paymentStatus, typically with values such as:

• Success
• Declined
• Error
• Pending
• InProcessing
• Timeout

Credit Card behaviour

• Success : Authorization approved and funds captured (for paymentType = PURS)
• Declined : Transaction refused by issuer
• Error : Technical or processing error
• Pending : Temporary state during authentication or processing (e.g., 3D Secure challenge flow)

The transaction must only be considered completed when paymentStatus = Success.

3.5 Recommended validation strategy

For Credit Card Form Integration:

• After redirection, immediately call the /status endpoint.
• Do not rely solely on front-end redirection parameters.
• If Pending, retry status after a short delay (few seconds).
• Stop when a final state is reached (Success, Declined, Error).

Polling for Credit Card should be short-lived and limited to the authentication window.

Important Notes

• Credit Card is a real-time payment method, except when Strong Customer Authentication (3D Secure) introduces an authentication step.
• There is no extended waiting period (unlike Multibanco Reference).
• The final payment confirmation must always be validated server-to-server.