/
How to configure the agents’ payment UI

How to configure the agents’ payment UI

Owned by Helen Griffith
Last updated: Mar 16, 2022

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 the POST /api/v1/session (Create agent assist session) endpoint
  • target="paymentframe" where “paymentframe” is the name of the iframe
  • Input data:
    • name="X-BEARER-TOKEN" value="{agentAccessToken}" where {agentAccessToken} is the value of the agentAccessToken parameter returned by the request to the POST /api/v1/session (Create agent assist session) endpoint
    • name="X-REFRESH-TOKEN" value="{agentRefreshToken}" where {agentRefreshToken} is the value of the agentRefreshToken parameter returned by the request to the POST /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 of X-BEARER-TOKEN to the value of the agentAccessToken parameter returned by the request to the POST /v1/session (Create agent assist session) endpoint
  • X-REFRESH-TOKEN - set the value of X-REFRESH-TOKEN to the value of the agentRefreshToken parameter returned by the request to the POST /v1/session (Create agent assist session) endpoint

Related content