Hosted Payments Page

Secure Payment Processing Integration Guide

Overview

The Hosted Payments Page (HPP) is a secure, embeddable payment processing widget that enables external websites to accept payments through an iframe integration. It provides a complete payment processing solution with PCI-compliant data handling, multiple payment methods, and real-time validation.

The HPP uses a secure iframe-based architecture that isolates sensitive payment data from your application, ensuring that credit card numbers and bank account information never touch your servers. All payment data is encrypted client-side using RSA-OAEP encryption before being transmitted.

Key Benefits:
  • Reduced PCI compliance burden - sensitive data stays in the iframe
  • Seamless integration with minimal code changes
  • Customizable styling to match your brand
  • Support for multiple payment methods and merchant configurations

Architecture

The HPP implements a secure, layered architecture:

  • Client Integration Layer: Your website embeds the HPP JavaScript library and creates a container element for the payment form.
  • Communication Layer: Secure cross-origin communication via postMessage API between your page and the payment iframe.
  • Payment Form Layer: Isolated iframe containing the payment form with all sensitive fields.
  • Encryption Layer: Client-side RSA encryption of all sensitive payment data before transmission.
  • API Layer: Server-side payment processing with merchant validation and transaction handling.

Supported Payment Methods

Credit Cards

Accept major credit cards including Visa, MasterCard, Discover, and American Express. Includes automatic BIN lookup for card type detection and surcharge eligibility.

ACH Bank Transfers

Process electronic bank transfers with support for checking and savings accounts. Includes bank account verification and routing number validation.

Card Swipe

Support for MSR90-compatible magnetic stripe readers with automatic track data parsing and validation. Ideal for point-of-sale scenarios.

Integration Scenarios

E-commerce Checkout

Embed the HPP in your checkout flow to process one-time payments with optional payment method storage for future purchases.

Recurring Payments

Use the SaveOnly mode to collect payment method information without charging, then process recurring payments server-side using saved payment profiles.

Point of Sale

Enable card swipe functionality for in-person payment scenarios with automatic transaction processing.

Account Management

Allow customers to save and manage payment methods in their account profiles for quick checkout in future transactions.

System Requirements

  • HTTPS Required: All pages must be served over HTTPS to ensure secure communication
  • Modern Browser Support: Chrome, Firefox, Safari, Edge (latest versions)
  • JavaScript Enabled: Required for iframe communication and encryption
  • Web Crypto API: Required for client-side RSA encryption (supported in all modern browsers)
  • Cookies Enabled: Required for session management and authentication

Getting Started

To begin integrating the Hosted Payments Page:

  1. Obtain your merchant ID and authentication credentials from your Procare representative
  2. Review the Integration Guide for step-by-step instructions
  3. Explore the Configuration Options to customize the payment form
  4. Implement Event Callbacks to handle payment responses
  5. Follow Best Practices for security and user experience
  6. Test thoroughly in your test environment before going live
Next: Features →