Embedded Hosted Payment Page

This embedded form is an integration option that allows you to collect payment method information from your customers while adhering to PCI Compliance requirements. The hosted page is an iFrame form that is embedded into your website or web application to collect and store customer payment method information. When a customer submits this form, sensitive customer payment information (such as credit card and bank account details) are encrypted and stored in the PCI Compliant Ezypay Vault. A payment method token is returned and you can then use this token to create a payment method for the customer. Because the token represents the payment method for all operations across the Ezypay platform, your app does not directly handle any sensitive payment information, thus your PCI scope is drastically reduced.

👍

For more information on setting up your own embedded payment method form, view our tutorial.

Process Flow

The diagram below provides an overview on the flow of information between your application, Ezypay and Ezypay Vault.

The process can be summarised as follows:

  1. You start by embedding the payment method form into your website or web application.
  2. Customers who visit your site will enter their card or bank information using this form.
  3. Customer information is sent to the Ezypay Vault for storage and a payment method token is returned to represent the data.
  4. You create a payment method for the customer by linking the token to the customer.

After creating and storing the customer's payment method information, you can proceed with setting up your customer's plans and subscriptions.

Page Content and Customisation

The Ezypay embedded form supports dynamic content that will change according to your customer's needs. The payment methods displayed change depending on the country as only the supported payment methods for that country will be shown to customers.

The size of the iFrame can be adjusted to fit your app requirements. Recommended size as follows:

  • Width: 100%
  • Height: no less than 256 px (use dynamic rather than fixed value)
  • Font size is dynamic and auto-scales depending on the iFrame size

Payment Method Validation

Ezypay will validate the payment details provided by the customer before the form is allowed to submit. If bad credentials are detected, the form will throw a validation error message and customers will need to re-enter valid payment method details to progress with payment. The following validation checks are performed:

  • Check if the card number is the proper format for the selected card type (such as Visa or MasterCard)
  • Check if numbers are entered
  • Check if the credit card is valid

This validation only checks for incorrect payment method format and invalid credit cards. Ezypay form validation does not check or provide alerts if the card is approaching the expiry date but has not yet expired.


What’s Next