Payment webhooks and confirmation in No-Code - Step-by-Step Execution

Concept Flow - Payment webhooks and confirmation

Payment Initiated

↓

Payment Processor Handles

↓

Webhook Sent to Merchant

↓

Merchant Receives Webhook

↓

Merchant Confirms Payment

↓

Update Order Status

↓

Notify Customer

This flow shows how a payment starts, the processor sends a webhook to the merchant, who then confirms and updates the order.

Execution Sample

No-Code

1. Customer pays on website
2. Payment processor sends webhook
3. Merchant receives webhook
4. Merchant confirms payment
5. Order status updated

This sequence shows the steps from payment to confirmation using webhooks.

Analysis Table

Step	Event	Action	Result
1	Customer completes payment	Payment processor records payment	Payment marked as pending
2	Payment processor sends webhook	Webhook sent to merchant URL	Merchant notified of payment
3	Merchant receives webhook	Merchant verifies webhook data	Payment details confirmed
4	Merchant confirms payment	Merchant updates order status	Order marked as paid
5	Merchant notifies customer	Send confirmation email or message	Customer informed of success
6	End	No further action	Process complete

💡 Process ends after customer is notified and order status updated

State Tracker

Variable	Start	After Step 1	After Step 2	After Step 3	After Step 4	Final
Payment Status	None	Pending	Pending	Verified	Paid	Paid
Webhook Received	No	No	Yes	Yes	Yes	Yes
Order Status	Unpaid	Unpaid	Unpaid	Unpaid	Paid	Paid
Customer Notified	No	No	No	No	Yes	Yes

Key Insights - 3 Insights

Why does the merchant wait for the webhook before confirming payment?

Because the webhook is the official notification from the payment processor that payment was successful, as shown in step 3 of the execution_table.

What happens if the webhook is not received?

The merchant cannot confirm payment or update order status, so the order remains unpaid, as seen in the variable_tracker where 'Webhook Received' stays 'No'.

Why notify the customer only after updating the order status?

To ensure the customer is informed only when payment is confirmed and order is ready, matching step 5 in the execution_table.

Visual Quiz - 3 Questions

Look at the execution_table, what is the payment status after step 3?

A Verified

B Pending

C Paid

D Unpaid

💡 Hint

Check the 'Payment Status' variable in variable_tracker after step 3

At which step does the merchant update the order status to 'Paid'?

A Step 2

B Step 4

C Step 3

D Step 5

💡 Hint

Look at the 'Action' column in execution_table for order status update

If the webhook is delayed, what variable remains 'No' longer according to variable_tracker?

A Payment Status

B Order Status

C Webhook Received

D Customer Notified

💡 Hint

Refer to 'Webhook Received' row in variable_tracker

Concept Snapshot

Payment webhooks notify merchants of completed payments.
Merchant waits for webhook before confirming payment.
After confirmation, order status updates to 'Paid'.
Customer is notified only after payment confirmation.
This ensures accurate and timely order processing.

Full Transcript

When a customer pays, the payment processor records the payment and sends a webhook to the merchant. The merchant waits to receive this webhook to verify the payment details. Once verified, the merchant updates the order status to paid and notifies the customer. This process ensures the merchant only confirms payments that are successfully processed, avoiding errors. The webhook acts as a trusted signal from the payment processor to the merchant's system, triggering order updates and customer notifications.

Practice

1. What is the main purpose of a payment webhook in a web application?

easy

A. To automatically notify your app when a payment is completed

B. To manually check payment status by the user

C. To display payment options on the website

D. To store user passwords securely

Solution

1. Step 1: Understand webhook role

   A webhook sends automatic messages from a payment system to your app when an event happens, like payment completion.

2. Step 2: Identify main purpose

   This automatic notification helps your app update order status and send confirmations without manual checks.

3. Final Answer:

   To automatically notify your app when a payment is completed -> Option A

4. Quick Check:

   Webhook = automatic payment notification [OK]

Hint: Webhooks send automatic updates, not manual checks [OK]

Common Mistakes:

• Thinking webhooks require manual user action
• Confusing webhooks with payment display options
• Assuming webhooks handle user data security

2. Which of the following is a correct step when setting up a payment webhook?

easy

A. Configure a URL endpoint to receive webhook notifications

B. Manually refresh the payment page to get updates

C. Store payment data only on the client side

D. Disable webhook security checks for faster processing

Solution

1. Step 1: Identify webhook setup requirement

   Webhooks require a URL endpoint where the payment system sends notifications automatically.

2. Step 2: Evaluate options

   Only configuring a URL endpoint is correct; manual refresh or disabling security are wrong practices.

3. Final Answer:

   Configure a URL endpoint to receive webhook notifications -> Option A

4. Quick Check:

   Webhook setup = URL endpoint configuration [OK]

Hint: Webhooks need a URL endpoint to send data [OK]

Common Mistakes:

• Thinking manual refresh gets webhook data
• Ignoring security checks in webhook setup
• Storing payment data only on client side

3. Consider this webhook event data received by your app:
{"payment_status": "completed", "order_id": "12345"}
What should your app do next to confirm the order?

medium

A. Delete the order from the database

B. Ignore the event and wait for user confirmation

C. Update the order status to 'paid' and send confirmation to the user

D. Request payment details again from the user

Solution

1. Step 1: Interpret webhook event data

   The event shows payment_status as "completed" for order_id "12345", meaning payment succeeded.

2. Step 2: Decide app action on payment completion

   The app should update the order status to 'paid' and notify the user with confirmation automatically.

3. Final Answer:

   Update the order status to 'paid' and send confirmation to the user -> Option C

4. Quick Check:

   Payment completed = update status and confirm [OK]

Hint: Completed payment means update order and notify user [OK]

Common Mistakes:

• Ignoring webhook data and waiting for manual input
• Deleting orders on payment success
• Asking user to pay again unnecessarily

4. You set up a webhook but your app never receives payment notifications. What is the most likely error?

medium

A. The app does not have a database

B. The payment was never completed

C. The user did not refresh the payment page

D. The webhook URL endpoint is incorrect or unreachable

Solution

1. Step 1: Analyze webhook delivery failure

   If the app never receives notifications, the webhook URL might be wrong or the server is unreachable.

2. Step 2: Rule out other options

   Payment completion or user refresh does not affect webhook delivery; database absence does not block receiving webhooks.

3. Final Answer:

   The webhook URL endpoint is incorrect or unreachable -> Option D

4. Quick Check:

   Webhook delivery fails if URL unreachable [OK]

Hint: Check webhook URL and server accessibility first [OK]

Common Mistakes:

• Blaming user refresh for webhook failures
• Assuming payment status affects webhook sending
• Confusing database presence with webhook reception

5. Your app receives multiple webhook events for the same payment due to retries. How should you handle these to avoid duplicate order confirmations?

hard

A. Process every webhook event as a new payment

B. Check if the order is already marked paid before updating

C. Ignore all webhook events after the first one for any order

D. Send confirmation emails multiple times to be safe

Solution

1. Step 1: Understand webhook retries

   Payment systems may resend webhook events if no confirmation is received, causing duplicates.

2. Step 2: Implement idempotent handling

   Before updating order status or sending confirmation, check if the order is already marked paid to avoid duplicates.

3. Final Answer:

   Check if the order is already marked paid before updating -> Option B

4. Quick Check:

   Idempotent webhook handling avoids duplicates [OK]

Hint: Always verify order status before processing webhook [OK]

Common Mistakes:

• Processing every webhook blindly causing duplicates
• Ignoring retries and sending multiple confirmations
• Discarding all but first webhook without checks