SDK Javascript

Integration

<script
  src="https://cdn.aplazame.com/aplazame.js?public-key=api_public_key&sandbox=true"
  async defer>
</script>
Parameter Type Required Description
public-key string yes your public key
sandbox boolean yes Set if the requests will be in sandbox mode (true) or production (false).

The value of sandbox must be false for production environment

Check available financing products

To display the Aplazame payment button based on the products configured in your account

HTML

<button type="button"
  data-aplazame-button
  data-amount="12050"
  data-currency="EUR"></button>

<div data-aplazame-payment-info="">
  Information about payment with Aplazame that will appear and be hidden with the button
</div>

aplazame.js

(window.aplazame = window.aplazame || []).push(function (aplazame) {
  aplazame.button({
    selector: '#some-button-or-wrapper-id', // accepts any valid CSS selector
    amount: 12050,
    currency: 'EUR'
  })
})

HTTP

Request:

GET /checkout/button?amount=12050&currency=EUR
Accept: application/vnd.aplazame.v1+json
Authorization: Bearer api_public_key
Host: api.aplazame.com

Response (available for this credit):
HTTP/1.1 201 OK

Response (not available for this credit):
HTTP/1.1 403 Forbidden
Parameter Type Required Description
selector css selector no CSS selector to display/hide Aplazame’s payment method.
amount decimal yes Quantity to be financed.
currency ISO 4217 yes The currency code of the order.

Check Instalments availability

To display the payment button with Aplazame based on the limits set in your account

HTML

<button type="button"
  data-aplazame-button
  data-amount="12050"
  data-currency="EUR"></button>

<div data-aplazame-payment-info="">
  Information about payment with Aplazame that will appear and be hidden with the button
</div>

aplazame.js

(window.aplazame = window.aplazame || []).push(function (aplazame) {
  aplazame.button({
    selector: '#some-button-or-wrapper-id', // accepts any valid CSS selector
    amount: 12050,
    currency: 'EUR',
    product: {
     type: 'instalments'
    }
  })
})

HTTP

Request:

GET /checkout/button?amount=12050&currency=EUR&product[type]=instalments
Accept: application/vnd.aplazame.v1+json
Authorization: Bearer api_public_key
Host: api.aplazame.com

Response (available for this credit):
HTTP/1.1 201 OK

Response (not available for this credit):
HTTP/1.1 403 Forbidden
Parameter Type Required Description
selector css selector no CSS selector to display/hide Aplazame’s payment method.
amount decimal yes Quantity to be financed.
currency ISO 4217 yes The currency code of the order.

Check availability of Pay in 15 days

To display the payment button with Aplazame based on the limits set in your account

HTML

<button type="button"
 data-aplazame-button
 data-amount="12050"
 data-currency="EUR"
 data-product-type="pay_later"></button>

<div data-aplazame-payment-info="">
  Information about payment with Aplazame that will appear and be hidden with the button
</div>

aplazame.js

(window.aplazame = window.aplazame || []).push(function (aplazame) {
 aplazame.button({
   selector: '#some-button-or-wrapper-id', // accepts any valid CSS selector
   amount: 12050,
   currency: 'EUR'
   product: {
       type: 'pay_later'
   }
 })
})

HTTP

Request:

GET /checkout/button?amount=12050&currency=EUR&product[type]=pay_later
Accept: application/vnd.aplazame.v1+json
Authorization: Bearer api_public_key
Host: api.aplazame.com

Response (available for this credit):
HTTP/1.1 201 OK

Response (not available for this credit):
HTTP/1.1 403 Forbidden
Parameter Type Required Description
selector css selector no CSS selector to display/hide Aplazame’s payment method.
amount decimal yes Quantity to be financed.
currency ISO 4217 yes The currency code of the order.

Check availability of Pay in 4

To display the payment button with Aplazame based on the limits set in your account

HTML

<button type="button"
 data-aplazame-button
 data-amount="12050"
 data-currency="EUR"
 data-product-type="pay_in_4"></button>

<div data-aplazame-payment-info="">
  Information about payment with Aplazame that will appear and be hidden with the button
</div>

aplazame.js

(window.aplazame = window.aplazame || []).push(function (aplazame) {
 aplazame.button({
   selector: '#some-button-or-wrapper-id', // accepts any valid CSS selector
   amount: 12050,
   currency: 'EUR'
   product: {
       type: 'pay_in_4'
   }
 })
})

HTTP

Request:

GET /checkout/button?amount=12050&currency=EUR&product[type]=pay_in_4
Accept: application/vnd.aplazame.v1+json
Authorization: Bearer api_public_key
Host: api.aplazame.com

Response (available for this credit):
HTTP/1.1 201 OK

Response (not available for this credit):
HTTP/1.1 403 Forbidden
Parameter Type Required Description
selector css selector no CSS selector to display/hide Aplazame’s payment method.
amount decimal yes Quantity to be financed.
currency ISO 4217 yes The currency code of the order.

Initiating the checkout

Here you can see how to integrate the SDK

<script>
(window.aplazame = window.aplazame || []).push(function (aplazame) {
  // This function is executed when aplazame.js is ready

  aplazame.checkout(checkout_id, {
    // callbacks ...
  })
})
</script>

Show result

(window.aplazame = window.aplazame || []).push(function (aplazame) {
  // This function is executed when aplazame.js is ready

  aplazame.checkout(checkout_id, {
    onStatusChange: function (result_status) {
      console.log('IMPORTANT: THE CHECKOUT IS STILL OPEN')

      switch(result_status) {
        case 'success':
          console.log('the checkout has been completed successfully')
          break
        case 'pending':
          console.log('the checkout has been completed but is pending validation')
          break
        case 'ko':
          console.log('the payment process has been rejected by Aplazame')
          break
      }
    },
    onClose: function (result_status) {
      switch(result_status) {
        case 'success':
          console.log('the checkout has been completed successfully')
          break
        case 'pending':
          console.log('the checkout has been completed but is pending validation')
          break
        case 'error':
          console.log('an error occurred while loading the checkout')
          break
        case 'dismiss':
          console.log('the user closed the checkout without completing it')
          break
        case 'ko':
          console.log('the payment process has been rejected by Aplazame')
          break
      }
    },
  })
})
Parameter Type Required Description
onStatusChange function no Function to be called when the Checkout changes its status.

function onStatusChange (status) { /**/ }

Possible statuses: success, pending, ko

( ⚠ When sending this signal, the checkout will remain open until a callback is made, as mentioned below)
onClose function no Function to be called when the Checkout closes.

function onClose (status) { /**/ }

Possible statuses: success, pending, ko, dismiss
onSuccess function no Function to be called when the payment is completed. When defining this function the success_url value is ignored
onPending function no Function to be called when the payment is pending confirmation. When defining this function the pending_url value is ignored
onKO function no Function to be called when the payment is denied. When defining this function the ko_url value is ignored
onError function no Function to be called when an error occurs. When defining this function the error_url value is ignored
onDismiss function no Function to be called when the user chooses to return to the store. When defining this function the dismiss_url value is ignored