This section describes the steps that you need to take to dynamically generate the security signature of the hosted iFrame.
To load the hosted page, you will make a request to Zuora for the iFrame using security measures. You can see a sample iFrame code in the HTML code section at the bottom of the Preview Hosted Payment Method Page.
The iFrame URL from the preview page is valid for 30 minutes after it is generated. You must add logic to dynamically generate the timestamp/token when calling the hosted page.
The following are the required parameters for the iFrame URL:
The domain depends on which Zuora server you are using. For example:
ID (Page ID)
The ID (Page ID) is a unique identifier for each hosted page you can create. The ID can be retrieved from clicking Show Page Id next to the hosted page name in the Page List section.
To find your tenant ID, navigate to Settings > Administration Settings > Manage Tenant Profile. This page displays information about your tenant, including your Tenant Id.
Create a timestamp in UTC (GMT) format in milliseconds, for example,
The token is a random alphanumeric token of 32 characters that has not been used in the past 48 hours, for example, 7av18bEz97Jrq9K6z0QPyvJpIqIxSmZc. Every page submission consumes a token. Once a token have been consumed, it is blacklisted for 48 hours. When a Hosted Payment Page needs to be reloaded, for example, after an unsuccessful submission, a new token must be created to generate a new iFrame.
You will use the API security key to generate the signature. The API security key is the only parameter used in signature generation that is not transmitted in the public URL.You must include the Hosted Pages API security key with the signature.
To obtain the API security key:
To generate the signature for the URL, create a string that concatenates the following input values:
Use the following format for the string:
Do not add a space or other character between the token and the API security key.
For example, using the following values:
The resulting concatenated string would look like the following:
After you generate the signature for the URL, you must encode the resulting string.
To encode the URL signature:
_(respectively). The sample resulting output should be "
The result from the step 3 above is the signature to be used for the iFrame URL.
Refer to the demo projects sample code section for examples on how to do this encoding.
Next, Embed and Submit the iFrame.