configure()

The configure function is used to prepare the Checkout library for a payment. It must be called before either showLightbox() or showPaymentPage() to store payment details.

Usage

Checkout.configure(configuration)

Example

Checkout.configure({
    merchant: '<your_merchant_id>',
    order: {
        amount: function() {
            //Dynamic calculation of amount
            return 100.00;
        },
        currency: 'USD',
        description: 'Ordered goods'
    },
    interaction: {
        merchant: {
            name: 'My Merchant Name'
        }
    }
});

showLightbox()

showLightbox is used to initiate a payment in a lightbox on top of your merchant page. Before calling showLightbox, the Checkout library must be prepared with configure().

The payment result can be obtained with the complete callback, or through out-of-band methods.

Example

Checkout.showLightbox();

Arguments

None

Return Value

None

showPaymentPage()

showPaymentPage is used to initiate a payment by redirecting the payer’s browser to a hosted payment page. Before calling showPaymentPage, the Checkout library must be prepared with configure().

The payment result can be obtained with the complete callback, or through out-of-band methods.

Example

Checkout.showPaymentPage();

Arguments

None

Return Value

None

saveFormFields()

saveFormFields() is a default implementation of a beforeRedirect callback. When used in conjunction with restoreFormFields(), the contents of any input elements on your page can be restored across browser redirects during the payment process.

Usage

saveFormFields() can be configured as the beforeRedirect callback using the data-beforeRedirect attribute on the Checkout script tag.

Example

<html>
    <head>
        <script src="https://test-tyro.mtf.gateway.mastercard.com/checkout/version/57/checkout.js"
            data-beforeRedirect="Checkout.saveFormFields"
            data-afterRedirect="Checkout.restoreFormFields">
        </script>
    </head>
    ...
</html>

Arguments

None

Return Value

fieldData

An object which represents the input elements on the current page and their values. The input values can be re-written to the page page by passing this object to restoreFormFields().

restoreFormFields()

restoreFormFields() is a default implementation of a afterRedirect callback. When used in conjunction with saveFormFields(), the contents of any input elements on your page can be restored across browser redirects during the payment process.

Usage

restoreFormFields() can be configured as the afterRedirect callback using the data-afterRedirect attribute on the Checkout script tag.

Example

<html>
    <head>
        <script src="https://test-tyro.mtf.gateway.mastercard.com/checkout/version/57/checkout.js"
            data-beforeRedirect="Checkout.saveFormFields"
            data-afterRedirect="Checkout.restoreFormFields">
        </script>
    </head>
    ...
</html>

Arguments

fieldData

An object which represents the input elements on the current page and their values. This is the return value of saveFormFields().

Return Value

None

error Callback

The error callback is invoked when problems occur during a payment.

Usage

The error callback must be defined using the data-error attribute on the Checkout script tag. The attribute value may be the name of a global function or a URL string.

When a URL is provided, the browser will be redirected to the new page with a query parameter appended for each argument.

Example

<html>
    <head>
        <script src="https://test-tyro.mtf.gateway.mastercard.com/checkout/version/57/checkout.js"
                data-error="errorCallback"></script>

        <script type="text/javascript">
            function errorCallback(error) {
                //handle payment error
            }
        </script>
    </head>
    ...
</html>
<html>
    <head>
        <script src="https://test-tyro.mtf.gateway.mastercard.com/checkout/version/57/checkout.js"
                data-error="http://[your domain]/errorPage"></script>
    </head>
    ...
</html>

Arguments

error Object

Details of the error.

cause String

Cause of the error.

One of INVALID_REQUEST, SERVER_BUSY, SERVER_FAILED, CONSTRAINT_VIOLATION, REQUEST_REJECTED

explanation String

Human-readable description of the error.

field String

Indicates the name of the field that failed validation or has violated the payment constraints.

result String

Fixed value = ERROR

validationType String

Indicates the type of field validation error.

Return Value

None

complete Callback

The complete callback will be invoked when the payment has been completed.

Usage

The complete callback must be defined using the data-complete attribute on the Checkout script tag. The attribute value may be the name of a global function or a URL string. URLs will have a query parameter appended for each argument.

The complete callback is only supported in a Return To Merchant integration.

Example

<html>
    <head>
        <script src="https://test-tyro.mtf.gateway.mastercard.com/checkout/version/57/checkout.js"
                data-complete="completeCallback"></script>

        <script type="text/javascript">
            function completeCallback(resultIndicator, sessionVersion) {
                //handle payment completion
            }
        </script>
    </head>
    ...
</html>
<html>
    <head>
        <script src="https://test-tyro.mtf.gateway.mastercard.com/checkout/version/57/checkout.js"
                data-complete="http://[your domain]/receiptPage"></script>
    </head>
    ...
</html>

Arguments

resultIndicator String

The result indicator can be used to securely determine if the payment succeeded in a Return To Merchant integration.

sessionVersion String

Version of the Payment Session after payment completed.

Return Value

None

cancel Callback

The cancel callback is invoked when the payer choose to cancel a payment.

Usage

The cancel callback must be defined using the data-cancel attribute on the Checkout script tag. The attribute value may be the name of a global function or a URL string.

Example

<html>
    <head>
        <script src="https://test-tyro.mtf.gateway.mastercard.com/checkout/version/57/checkout.js"
                data-cancel="cancelCallback"></script>

        <script type="text/javascript">
            function cancelCallback() {
                //handle payment being cancelled
            }
        </script>
    </head>
    ...
</html>
<html>
    <head>
        <script src="https://test-tyro.mtf.gateway.mastercard.com/checkout/version/57/checkout.js"
                data-cancel="http://[your domain]/cancelPage"></script>
    </head>
    ...
</html>

Arguments

None

Return Value

None

timeout Callback

The timeout callback is invoked when the payment is not completed within the duration (in seconds) available to the payer to make the payment. This will either be the time you specified in interaction.timeout when you sent the CREATE_CHECKOUT_SESSION request or or the gateway default timeout value.

Usage

The timeout callback must be defined using the data-timeout attribute on the Checkout script tag. The attribute value may be the name of a global function or a URL string.

Example

<html>
    <head>
        <script src="https://test-tyro.mtf.gateway.mastercard.com/checkout/version/57/checkout.js"
                data-timeout="timeoutCallback"></script>

        <script type="text/javascript">
            function timeoutCallback() {
                //handle payment timeout
            }
        </script>
    </head>
    ...
</html>
<html>
    <head>
        <script src="https://test-tyro.mtf.gateway.mastercard.com/checkout/version/57/checkout.js"
                data-timeout="http://[your domain]/timeoutPage"></script>
    </head>
    ...
</html>

Arguments

None

Return Value

None

beforeRedirect Callback

The beforeRedirect callback is invoked before browser redirects occur during the payment flow. The return value of the callback will be stored until the browser is returned to the merchant page. The value can be recovered with the afterRedirect callback.

Payment methods such as PayPal and MasterPass require the browser to be redirected away from a merchant page.

Usage

The beforeRedirect callback must be defined using the data-beforeRedirect attribute on the Checkout script tag. The attribute value must be the name of a global function.

Example

<html>
    <head>
        <script src="https://test-tyro.mtf.gateway.mastercard.com/checkout/version/57/checkout.js"
                data-beforeRedirect="getPageState"></script>

        <script type="text/javascript">
            function getPageState() {
                return {
                    foo: "string",
                    bar: 123.45
                };
            }
        </script>
    </head>
    ...
</html>

Arguments

None

Return Value

data Object

A JSON serializable object.

afterRedirect Callback

The afterRedirect callback is invoked when the browser returns to the merchant page after a redirect to a third-party site. If the beforeRedirect callback was used, the value returned from that callback will be passed to afterRedirect as an argument.

Payment methods such as PayPal and MasterPass require the browser to be redirected away from a merchant page.

Usage

The afterRedirect callback must be defined using the data-afterRedirect attribute on the Checkout script tag. The attribute value must be the name of a global function.

Example

<html>
    <head>
        <script src="https://test-tyro.mtf.gateway.mastercard.com/checkout/version/57/checkout.js"
                data-afterRedirect="restorePageState"></script>

        <script type="text/javascript">
            function restorePageState(data) {
                //set page state from data object
            }
        </script>
    </head>
    ...
</html>

Arguments

data Object

The object that was returned from beforeRedirect callback, if any.

Return Value

None