An agent’s payment UI is served by the PCI services vendor (e.g. PCI Pal). You can configure the UI to load in a webpage iframe or in an embedded browser.
In this page
UI in an iframe
To configure the UI to open in an iframe, create a dynamic form that submits two input values to the iframeUrl
location. The form requires the following data:
method="POST"
action="{iframeUrl}"
where{iframeUrl}
is the value of the ‘iframeUrl’ parameter returned by the request to thePOST /api/v1/session
(Create agent assist session) endpointtarget="paymentframe"
where “paymentframe” is the name of the iframe- Input data:
name="X-BEARER-TOKEN" value="{agentAccessToken}"
where{agentAccessToken}
is the value of theagentAccessToken
parameter returned by the request to thePOST /api/v1/session
(Create agent assist session) endpointname="X-REFRESH-TOKEN" value="{agentRefreshToken}"
where{agentRefreshToken}
is the value of theagentRefreshToken
parameter returned by the request to thePOST /api/v1/session
(Create agent assist session) endpoint
For example:
<iframe name="paymentframe" src="about:blank"></iframe> ... <form action="https://<payment host URL>/view/59aab1be-d652-426e-a7a8-1bf4ca15e2ab/framed" id="initForm" target="paymentframe" method="POST"> <input name="X-BEARER-TOKEN" value="eyJ0...Nvtr" type="hidden"> <input name="X-REFRESH-TOKEN" value="f9d8...c999" type="hidden"> </form> <script> document.getElementById("initForm").submit(); </script>
UI in an embedded browser
To configure the UI to open in an embedded browser, then open the URL specified in the iframeUrl
parameter returned by the request to the POST /v1/session
(Create agent assist session) endpoint with the following headers:
X-BEARER-TOKEN
- set the value ofX-BEARER-TOKEN
to the value of theagentAccessToken
parameter returned by the request to thePOST /v1/session
(Create agent assist session) endpointX-REFRESH-TOKEN
- set the value ofX-REFRESH-TOKEN
to the value of theagentRefreshToken
parameter returned by the request to thePOST /v1/session
(Create agent assist session) endpoint