Integration Steps
To implement the basic Hosted Checkout solution in your system, follow the instructions below.
Prerequisites
Before implementing a Hosted Checkout solution, check with your payment service provider to ensure you meet the following prerequisites:
- Ensure that you have a merchant account and that your merchant profile is enabled for the Hosted Checkout service.
- Select and set up your API authentication method.
- If you want to be notified of successful payments, enable the Notifications service. It allows the Mastercard Gateway to send email or Webhook notifications to you, and email notifications to the payer on your behalf.
Implementing a Hosted Checkout solution
The Hosted Checkout solution works through API operations (requests and responses), which are used to, for example, initiate or retrieve information about various payment transactions and store card details. You also need the Checkout JavaScript library to implement the Hosted Payment Page in your app or web page, when payer participation is needed to gather payment details for a transaction.
You can use all the API operations available for the REST Server APIs. However, you have no need for the Hosted Session-related API operations, as they are only needed for the related integration method. For general information about making server API requests, see Making a Server API Request.
The operations available to you are limited to the capability of the acquirers configured on your merchant profile with the gateway. If a functionality is not supported for the acquirer on the gateway, any operation requests to execute that functionality are rejected by the gateway (for that acquirer).
When payer participation is needed, each task you perform with Hosted Checkout consists of the following steps:
- Establish a checkout session
Request a checkout session using the INITIATE CHECKOUT operation. - Implement the Hosted Payment Page
Show the payer either an Embedded Page or a Payment Page and start the payment process. Optionally, include callbacks for handling events that occur during the payment interaction, such as the payer cancelling the payment, the session timing out, or redirecting the payer to another website to finish payment (such as when using PayPal). - Interpret the response
Receive the results of the payment from the gateway and update your system with the payment details. Return the payer to your web site and display the payment receipt to them.
For a collection of example requests covering the common transaction operation requests, download the Postman collection.
After your integration is completed and you are able to manage the initial transaction with the payer using the Hosted Payment Page to provide their payment details and authorization:
- Determine any customizations you need to make based on the specific payment methods you want to support on the Hosted Payment Page.
- Define any customizations you want to use in the Hosted Payment Page Checkout.
- Consider what kind of security or other additional features you want to offer or use in your integration.
- Implement any subsequent transactions you want to initiate from your backend server, such as CAPTURE or REFUND
- Test your entire solution.
Frequently asked questions
Are Microsoft browsers supported by Hosted Checkout?
Yes, Microsoft Edge versions 113 and newer are supported.
How secure is the Hosted Checkout integration?
The Hosted Checkout model is secure as it requires you to authenticate to the gateway, and the payment details collected on the Hosted Payment Page are submitted directly from the payer's browser to the gateway.
How can I optimize my mobile interactions with Hosted Checkout?
If you want to offer your customers a good mobile experience for Hosted Checkout, add a meta tag named viewport to your site's page.
<meta name="viewport" content="width=device-width, initial-scale=1">
Define the right viewport values for your pages and test your own site with them.