Skip to main content

Transparent Checkout

PicPay's Transparent Checkout offers an integrated payment solution, allowing customers to carry out transactions directly on the merchant's website, with greater personalization and control over the checkout process.

Payment Process Flow​

The payment process with Transparent Checkout involves the following steps:

  1. Start of Checkout by the Consumer: The consumer starts the checkout process on the merchant's website.
  2. Display of Personalized Checkout Page: The merchant displays a personalized checkout page, allowing the consumer to enter their payment information directly on their own website.
  3. Choice of Payment Method by the Consumer:
    • Payment by Credit Card: The consumer enters their credit card details on the checkout page.
    • Payment with PicPay Wallet: The consumer chooses to use PicPay Wallet as a payment method.
    • Payment with PIX: The consumer chooses to use PIX as a payment method.
  4. Payment Processing by the Merchant:
    • Payment by Credit Card: The merchant sends a payment authorization request to PicPay with the credit card details provided by the consumer. After successful processing, PicPay confirms payment to the merchant, who, in turn, confirms the completion of the order to the consumer.
    • Payment with PicPay Wallet: The merchant requests the creation of a QRCode from PicPay. Once received, the merchant displays this QRCode to the consumer, who makes payment via the PicPay app. After payment, PicPay confirms the transaction for both the consumer and the merchant.
    • Payment with PIX: The merchant requests the creation of a PIX QRCode from PicPay. Once received, the merchant displays this QRCode to the consumer, who makes the payment by scanning the QRCode or using the “Pix copy and paste” function. After payment, PicPay confirms the order to the merchant, who, in turn, confirms the order of the order to the consumer.
  5. Payment Notification to the Merchant: Regardless of the payment method chosen, PicPay sends a notification to the merchant confirming the payment.
  6. Order Confirmation to the Consumer: The merchant, after receiving payment confirmation, notifies the consumer about the successful completion of the order.

This flow allows merchants to offer a more fluid and integrated checkout experience, maintaining high security standards and facilitating a variety of payment options for consumers.

Integration with the Transparent Checkout API​

SERVER-TO-SERVER REQUIREMENTS ARE CRUCIAL

It is essential that all requests to the PicPay Checkout API are made from the merchant's backend, never through the website's frontend. This approach ensures the integrity and confidentiality of PicPay credentials, protecting against exposure of sensitive data and possible security vulnerabilities.

Transaction authenticated with 3DS

At the moment of creating a checkout, the merchant can request the use of 3DS authentication. Learn more.

PicPay's Transparent Checkout offers flexibility and control in payment integration, through a series of features available on our API. Here are the important details for successful integration with our API.

Authorization of Card Payments​

For credit card transactions, the Card section of our API Reference contains all the information needed to process authorizations. This part of the API allows you to securely integrate card payment processing into your website.

Field paymentSource

When requesting authorization for Transparent Checkout, make sure to fill in the paymentSource field with the GATEWAY value. This ensures that the transaction is processed correctly within the context of this checkout type.

Payments with PicPay Wallet at Transparent Checkout​

Transparent Checkout is not limited to credit card transactions; it also supports payments made through customers' PicPay wallet. A distinctive feature of this payment method is its asynchronous nature, that is, it occurs in two fundamental steps:

  1. QrCode Generation and Display: First, you generate a PicPay QrCode using the Wallet session endpoint in our Reference API. This QrCode is then displayed on your frontend. Unlike card payments, where authorization is almost instantaneous, QrCode waits for the customer to act.

  2. Payment and Confirmation by the Customer: The customer scans the QrCode using the PicPay application to make the payment. Unlike card payments, which are processed and confirmed in real time, PicPay wallet payments require the customer to actively complete the transaction. Once payment is made, PicPay notifies the merchant via webhook, allowing them to proceed with the subsequent steps of the order.

This asynchronous approach provides an additional layer of flexibility for customers, while keeping the merchant informed about payment status in real time.

ENABLING THE PAYMENT METHOD VIA WALLET

Remember, to accept payments via PicPay wallet, you must enable this method in the “Meu Checkout” section on the PicPay Panel.

CHECK PAYMENT STATUS

To monitor and confirm the status of payments made via QrCode, merchants have a specific endpoint available. This endpoint, dedicated to querying the status of charges, can be found in detail in the Search section of our API Reference.

With the integration of the payment method via PicPay wallet in Transparent Checkout, merchants can offer an even more diversified payment experience that adapts to customer preferences.

Authorization of Card Payments with 3DS Authentication Enabled​

For credit card transactions authenticated with 3DS, the 3DS Authentication section of our API Reference contains all the necessary information to process authentication. This part of the API allows you to securely integrate card payment processing using 3DS authentication.

Data Collection Script​

Used during the Setup stage. The URL and Access Token received in the Setup response will be used to initialize the Device Data Collection iframe. Initiate a POST form in a “hidden” iframe. NOTE: The form action and the JWT parameter must be replaced with the value received in the URL and AccessToken from the Setup.

<iframe name=”ddc-iframe” height="1" width="1" style="display: none;"> </iframe>
<form id="ddc-form" target=”ddc-iframe” method="POST" action="https://centinelapistag.cardinalcommerce.com/V1/Cruise/ Collect">
<input type="hidden" name="JWT" value=" eyJhbGciOiJIUzI1NiJ9.eyJpc3MiOiI1YWZiNGRkY2ZmNjI2YjIzNzA2OWZhM2QiLCJ pYXQiOjE1OTExMTgyNzIsImV4cCI6MTU5MTEyNTQ3MiwianRpIjoiNWU4MDg5MG EtN2UyNi00ZmI3LThiYTUtNjQ2ZDU0NjJiMzBkIiwiUGF5bG9hZCI6eyJBY3Rpb25Db 2RlIjoiU1VDQ0VTUyIsIlNlc3Npb25JZCI6IjY0ZTY2NjQ4LTFkYzYtNDZjMS1hNGYzLT BkYzE2MzQwZmFmMTAiLCJFcnJvck51bWJlciI6MCwiRXJyb3JEZXNjcmlwdGlvbiI6I lN1Y2Nlc3MifX0.j8EPWEEDf85hYQcxFzXxmHqHFTlptSQITJgfBGtLLjA" /></form>

Challenge Processing Script​

Used during the Enrollment stage. When the authentication request response indicates the need to process a challenge, the operation must be performed on the front end through the following function: Initiate a POST form in a “hidden” iframe. NOTE: The form action and the JWT parameter must be replaced with the value received in the URL and AccessToken.

<iframe name=” ”step-up-iframe” height=“250" width=“400"> </iframe>
<form id=""step-up-form" target=” ”step-up-iframe” method="POST" Action=“https://centinelapistag.cardinalcommerce.com/V2/Cruise/StepUp">
<input type="hidden" name="JWT" value="eyJhbGciOiJIUzI1NiJ9.eyJpc3MiOiI1YWZiNGRkY2ZmNjI2YjIzNzA2OWZhM 2QiLCJpYXQiOjE1OTExMTgyNzIsImV4cCI6MTU5MTEyNTQ3MiwianRpIjoiNWU4M Dg5MGEtN2UyNi00ZmI3LThiYTUtNjQ2ZDU0NjJiMzBkIiwiUGF5bG9hZCI6eyJBY3R pb25Db2RlIjoiU1VDQ0VTUyIsIlNlc3Npb25JZCI6IjY0ZTY2NjQ4LTFkYzYtNDZjMS1h NGYzLTBkYzE2MzQwZmFmMTAiLCJFcnJvck51bWJlciI6MCwiRXJyb3JEZXNjcmlw dGlvbiI6IlN1Y2Nlc3MifX0.j8EPWEEDf85hYQcxFzXxmHqHFTlptSQITJgfBGtLLjA" /> </form>

PCI DSS Certification​

PCI DSS CERTIFICATION REQUIRED

To use Transparent Checkout, it is essential that the merchant has a PCI DSS (Payment Card Industry Data Security Standard) certification. This certification ensures that credit card data is handled in accordance with industry security standards, protecting sensitive customer information and minimizing the risk of fraud.

Transparent Checkout is ideal for merchants looking to offer a more personalized and integrated payment experience, while maintaining high standards of security and compliance.