Next, you can use the payment options endpoint to determine which payment options can be shown at checkout for the combination of amount, currency, country, cart_items and metadata should be displayed in your checkout.

The payment options API endpoint makes it easy to get a list of payment options.

using Gr4vy;
using Gr4vy.Models.Components;

var sdk = new Gr4vySDK(
    id: "example",
    server: SDKConfig.Server.Sandbox,
    bearerAuthSource: Auth.WithToken(privateKey),
    merchantAccountId: "default"
);

var res = await sdk.PaymentOptions.ListAsync(paymentOptionRequest: new PaymentOptionRequest() {});

// handle response

This API will automatically use your checkout Flow rules to limit these results.

Each payment option will include the method, icon_url, label and other useful information on supported features that you can use to display the options on your checkout.

{
    "items": [
        {
            "type": "payment-option",
            "method": "card",
            "icon_url": "https://api.sandbox.example.gr4vy.app/assets/icons/payment-methods/card.svg",
            "mode": "card",
            "label": "Card",
            "can_store_payment_method": true,
            "can_delay_capture": true,
            "context": {
                "approval_ui": {
                    "height": "589px",
                    "width": "500px"
                },
                "required_fields": {}
            }
        },
        {
            "type": "payment-option",
            "method": "paypal",
            "icon_url": "https://api.sandbox.example.gr4vy.app/assets/icons/payment-methods/paypal.svg",
            "mode": "redirect",
            "label": "PayPal",
            "can_store_payment_method": true,
            "can_delay_capture": true,
            "context": {
                "approval_ui": {
                    "height": "589px",
                    "width": "500px"
                },
                "required_fields": {}
            }
        },
        {
            "type": "payment-option",
            "method": "alipay",
            "icon_url": "https://api.sandbox.example.gr4vy.app/assets/icons/payment-methods/alipay.svg",
            "mode": "redirect",
            "label": "Alipay",
            "can_store_payment_method": true,
            "can_delay_capture": false,
            "context": {
                "approval_ui": {
                    "height": "589px",
                    "width": "500px"
                },
                "required_fields": {}
            }
        }
    ]
}

This API supports an optional locale that can be set to get the label in your local language.

Your application can now display these payment options on your checkout page. To display the available options and allow your customer to checkout, use each label and icon, and then handle the transaction according to the next step.

We recommend using Secure Fields when working with cards as it reduces the PCI scope of your integration. If you intend to use our API directly for card payments without Secure Fields then you will have to go through your own PCI-DSS level 1 certification.

By implementing the payment options in this way you can fully utilize payment orchestration while having all the flexibility on the design and layout.

​
Summary

In this step you:

  • Called the payment options endpoint
  • Displayed the payment options on your checkout