# Load the Hosted Payment Page

Load the Hosted Payment Page to save or update a customer's payment details by sending a POST request to the Secure Card Page URL with a signed HASH parameter

An AI skill is available for this guide, get it on the [Skills Marketplace (GitHub)](https://github.com/payroc/skills).

When your customer wants to save their payment details, load the Hosted Payment Page. To do this, add a button to your checkout page that sends a POST request to our gateway. When we receive the POST request, the Hosted Payment Page loads and the customer can submit their payment details.

**Note:** The Hosted Payment Page doesn't return a transaction type in the transaction response. Because you can run sales, run pre-authorizations, and save a customer's payment details, we recommend that you record the transaction type in your system.

You can also use this page to update a customer's payment details. When you load the Hosted Payment Page, provide the MERCHANTREF to indicate the customer's secure token that you want to update and send a value for the ACTION parameter of `update` instead of `register`.

<a id="send-a-post-request-to-load-the-hosted-payment-page"></a>
## Send a POST request to load the Hosted Payment Page

To load the page, send a POST request to the Secure Card Page URL.

| Environment | URL |
| --- | --- |
| Test | [https://payments.uat.payroc.com/merchant/securecardpage](https://payments.uat.payroc.com/merchant/securecardpage) |
| Production | [https://payments.payroc.com/merchant/securecardpage](https://payments.payroc.com/merchant/securecardpage) |

<a id="request-parameters"></a>
### Request parameters

To create the body of your request, use the following parameters:

| Parameter | Type | Size | Description |
| --- | --- | --- | --- |
| ACTION | Enum |  | Indicates if the customer is saving new payment details or if they are updating existing payment details. The value is one of the following: - `register` - Customer is saving new payment details. - `update` - Customer is updating existing payment details. |
| TERMINALID | String | 1-50 characters | Unique identifier that we assigned to the terminal. |
| MERCHANTREF | String | 1-200 characters | Unique identifier that the merchant assigns to the secure token. **Note:** We recommend that you store this value. |
| DATETIME | String |  | Date and time that you send the request. Send this value in **DD-MM-YYYY:HH:MM:SS:SSS** format, for example, `06-02-2026:12:23:23:719`. |
| HASH | String | 1-128 characters | SHA-512 hash value that you generate with values from the request parameters and the terminal secret. For more information about how to create your hash, go to \[Authenticate your requests\]. |
| STOREDCREDENTIALUSE | Enum |  | Indicates how the merchant can use the card details, as agreed by the customer: - `UNSCHEDULED` - Transactions for a fixed or variable amount that are run at a certain predefined event. - `RECURRING` - Transactions for a fixed amount that are run at regular intervals, for example, monthly. Recurring transactions don't have a fixed duration and run until the customer cancels the agreement. - `INSTALLMENT` - Transactions for a fixed amount that are run at regular intervals, for example, monthly. Installment transactions have a fixed duration. **Note:** Send a value for this parameter if the customer is saving card details. |

<a id="next-steps"></a>
## Next steps

- [Build the merchant's receipt page]()