Set up a subscription management process
You can use a customer's saved payment details to set up a subscription management solution for your business. This guide will explain how you can store more information about your customers to handle recurring charges.
Make sure you clarify and update your service's Terms and Conditions about handling sensitive data and recurring payments to comply with local regulations.
It's your responsibility as a merchant to meet local legislation requirements and be PCI DSS compliant.
Overview
Check the following high-level procedure to implement a subscription management process, using the Revolut Checkout Widget and the Merchant API:
- Save payment details on Revolut during the first payment
- (Optional) Get payment details from Revolut to be stored on your server
- Set up a job to handle recurring payments
- (Optional) Allow your customers to manage their subscription
Step 1. Save customer's card or Revolut account details on Revolut during the first payment
To save a customer's payment details by completing an order, see: Save the card details of a customer.
In case of a subscription management system, you (as the merchant) will initiate the payments, so you have to save the payment method for yourself (Revolut Checkout Widget: savePaymentMethodFor: "merchant", Revolut Pay: savePaymentMethodForMerchant: true). This way, your customers only need to authorise the payment the first time.
You have two options to authorise the first payment:
- Create an order with
0amount to pay, so the customer only authorises their payment method for future payments. This is helpful when you have a separate process to save payment methods. - Create an order with the first amount to be paid, so the customer both pays the initial amount and authorises their payment method for future payments.
Revolut Pay
See an example of the Payments.revolutPay instance:
import RevolutCheckout from '@revolut/checkout'
const { revolutPay } = await RevolutCheckout.payments({
locale: 'en' ,// Optional, defaults to 'auto'
mode: 'prod', // Optional, defaults to 'prod'
publicToken: '<yourPublicApiKey>', // Merchant public API key
})
const paymentOptions = {
currency: 'USD', // 3-letter currency code
totalAmount: number, // in lowest denomination e.g., cents
savePaymentMethodForMerchant: true,
// Put other parameters here
}
revolutPay.mount(target, paymentOptions)
The example above is not complete, it is intended to demonstrate the savePaymentMethodForMerchant parameter. To see the full implementation process, visit: Accept payments via Revolut Pay - Web.
By initialising the Revolut Pay widget with the savePaymentMethodForMerchant option customers can grant permission to the merchant to initiate transactions without further action required from the customer. Customers are able to save both their Revolut account and card details via Revolut Pay.
For more information about configuring and mounting the Revolut Pay widget, see: Configure Revolut Pay button and Mount Revolut Pay button.
Only merchant initiated transactions are supported with Revolut Pay on the Pay for an order endpoint.
Revolut Checkout Widget
See an example with the createCardField instance:
RevolutCheckout("<token>").then(function (instance) {
var card = instance.createCardField({
target: document.getElementById("card-field"),
onSuccess() {
window.alert("Thank you!");
},
onError(message) {
window.alert("Oh no :(");
},
});
document
.getElementById("button-submit")
.addEventListener("click", function () {
card.submit({
savePaymentMethodFor: "merchant",
});
});
});
You can also use the payWithPopup instance of the Revolut Checkout Widget to save a customer's payment method.
(Optional) Step 2. Get payment details from Revolut to be stored on your server
Storing payment details (Revolut account, or card details) can be helpful when you have more websites, and you want to provide a faster subscription experience across all your sites. However, if you choose to store payment details, you must ensure that these are in sync with the ones on the Merchant API.
Use the last paid order of the customer to retrieve a customer's Revolut account or card details stored on Revolut's server. Fetch and save the information from the response of the Retrieve payment list of an order endpoint.
See an example of a saved payment_method JSON object, returned by the endpoint:
[
{
"id": "64905d4b-a205-aac3-a5ef-dab978b1b7ee",
"order_id": "64905d0f-3f95-a2ac-91ea-57c77f9dbe69",
"state": "completed",
"payment_method": {
"type": "revolut_pay",
"id": "648334a8-9546-a983-a81a-efc6d5bdd0be",
"subtype": "revolut_account"
}
}
]
If you don't receive payment_method.id, that means the payment method was not saved during checkout. Check your Revolut Pay or Revolut Checkout Widget configuration. If everything seems right, reach out to Revolut for further support.
You can use this JSON object to retrieve and save a customer's payment details on your server.
Step 3. Set up a job to handle recurring payments
To manage a customer's subscription plan, you need to handle the following tasks:
- Notifying the customer about the upcoming payment and possibilities of cancelling the subscription
- Creating an order at the start of each subscription period
- Initiating a payment for this order using the
/paymentsendpoint - Tracking payment status
- Handling payment completion
- Handling payment errors
Set up an automated job on your backend that triggers these tasks at the expected time, and use calculations based on the subscription's start date. This job should run at the start of every subscription period until cancelled.
Step 3.1. Notify the customer about the upcoming payment
Configure a task which will send a notification (e.g. email) to the customer containing the following:
- Detailed information about subscription fee (including tax rates applied)
- Information about the payment method to be charged and how to change it
- Date when the subscription fee will be collected
- Information about the cancellation process
Local regulations may differ in what is required for such notification. It is your responsibility to consider the requirements of local regulators and comply with the relevant laws.
Step 3.2. Set up a task to create order
When it's time to charge the customer for the subscription fee, use your automation to create an order with the amount, currency, customer.email (or customer.id) parameters in the body of the request.
You can use the metadata object (optional, but recommended) to add any additional custom parameters.
Step 3.3. Set up a task to initiate payment
Set up another task in your automation job, which initiates a payment by sending a POST request to the Pay for an order endpoint.
Use the order_id from the response of the previous call and send a request with the following payload to charge the customer's saved payment method.
{
"saved_payment_method": {
"type": "<type of the saved payment method>",
"id": "<ID of the saved payment method>",
"initiator": "<initiator of the payment>"
}
}
Make sure to pass initiator: merchant in the request body to take the payment without further actions required from your customer.