Implementing a Hosted Payment Page Integration
The Hosted Payment Page model allows you to collect payment details from your payer through a web page hosted and displayed by the Mastercard Gateway thereby managing security and PCI-compliance for you. With this model of integration, you never see or handle payment details directly because the payment details collected on the payment page are submitted directly from the payer's browser to the Mastercard Gateway.
Request a payment page
You request the Hosted Payment Page by sending a HTTPS POST request to the Mastercard Gateway. This step is critical in the merchant integration as the data in your request determines the content displayed to the payer on the payment page.
The HTTPS POST request can contain any of the fields described in the Hosted Payment Page API Reference. Please ensure that you include all the required fields in your request.
Sample code for a basic Hosted Payment Page integration is shown below:
<form method="post" action="https://test-nbe.gateway.mastercard.com/api/page/version/36/pay">
<input type="hidden" name="merchant" value="<your_merchant_id>"/>
<input type="hidden" name="order.amount" value="100.00"/>
<input type="hidden" name="order.currency" value="USD"/>
<input type="hidden" name="order.description" value="37 Blue Widgets"/>
<input type="hidden" name="interaction.merchant.name" value="My Merchant Name"/>
<input type="hidden" name="interaction.cancelUrl" value="http://www.mymerchant.com"/>
<input type="submit" value="Checkout"/>
</form>
Point interaction.cancelUrl
to a URL to which you want the payer's browser to be redirected to if they cancel their payment. This could be a link back to the payer's shopping cart, or the home page of your shop site.
It is recommended that you include the order.id
field in your request to easily identify a payment initiated from the Hosted Payment Page. You can use an identifier generated by your shopping cart or supply your own; however, ensure that it is unique. If you don't supply a value in the order.id
field, the Mastercard Gateway will automatically generate one for you.
Testing your integration
Before going live, you must test your integration to ensure correct functionality.