Use Tab, then Enter to open a result.
Dynamic delivery fees ensure your business remains profitable while providing transparency to your customers. When a user interacts with a WhatsApp Flow, they expect immediate feedback. Static pricing often fails because delivery costs fluctuate based on distance, time of day, or order volume. Using real-time webhooks and n8n, you provide accurate pricing within the chat interface.
This guide walks through the technical steps to connect a WhatsApp Flow to an n8n workflow. You will learn to handle the data exchange process that calculates fees on the fly.
Understanding Dynamic Delivery Fees in WhatsApp Flows
A dynamic delivery fee is a price that changes based on external data inputs during a live session. In a WhatsApp Flow, this happens through an action called data_exchange. Instead of hardcoding a five dollar shipping fee, the Flow sends the user's zip code or address to your server. Your server calculates the cost and sends it back to the user's screen instantly.
This mechanism relies on an endpoint that listens for POST requests. n8n serves as this endpoint. It receives the encrypted payload from Meta, decrypts the information, processes the logic, and returns a formatted response that the WhatsApp client understands. This interaction happens in milliseconds, creating a smooth experience for the customer.
The Problem with Static Flow Pricing
Many developers start by building Flows with fixed options. While simple, fixed pricing ignores the reality of logistics. If a customer lives ten miles away versus two miles away, your costs differ. Using static values leads to two negative outcomes. First, you lose money on long-distance deliveries. Second, you overcharge local customers, which reduces conversion rates.
Using a webhook-based approach solves these issues. It allows your Flow to behave like a modern e-commerce checkout page. It checks your internal database or a maps API before showing the final total to the user.
Prerequisites for Implementation
Before building the automation, ensure you have the following components ready:
- Meta Developer Account: You need access to the WhatsApp Business Platform to create and manage Flows.
- n8n Instance: A self-hosted or cloud version of n8n to handle the webhook logic.
- SSL/HTTPS: WhatsApp only communicates with secure endpoints. Ensure your n8n webhook URL uses HTTPS.
- Basic JSON Knowledge: You will need to edit Flow definitions and n8n response bodies.
- Official API Access: While tools like WASenderApi provide excellent session-based messaging for many use cases, WhatsApp Flows specifically require the official Meta Business API to function within the native UI components.
Step 1: Design the WhatsApp Flow JSON
The first step is defining the Flow structure. You need a screen that collects the delivery address and a button that triggers the calculation. The data_exchange action is the key component here.
{
"version": "3.1",
"screens": [
{
"id": "ADDRESS_SCREEN",
"title": "Delivery Details",
"data": {
"delivery_fee": {
"type": "string",
"value": "$0.00"
}
},
"layout": {
"children": [
{
"type": "TextInput",
"label": "Enter Zip Code",
"name": "zip_code",
"required": true
},
{
"type": "Footer",
"label": "Calculate Fee",
"on-click-action": {
"name": "data_exchange",
"payload": {
"user_zip": "${form.zip_code}"
}
}
}
]
}
}
]
}
In this JSON, the on-click-action sends the user_zip to your n8n webhook. The Flow enters a loading state while waiting for the response.
Step 2: Configure the n8n Webhook Node
Open your n8n editor and add a Webhook node. Set the HTTP method to POST. This node receives the data from Meta. WhatsApp sends encrypted payloads, so your workflow must handle the decryption process. Use a Function node or the built-in crypto tools to verify the request signature and extract the zip code.
Meta includes a flow_token in the request. This token identifies the specific user session. You must include this token in your response to ensure the price update reaches the correct person.
Step 3: Implement the Pricing Logic
After extracting the zip code, add a node to determine the fee. For a simple setup, use a Switch node to map zip codes to prices. For a production environment, use an HTTP Request node to call a maps API or a database query.
Example logic structure:
- Zip code 10001 to 10010: $5.00
- Zip code 10011 to 10020: $8.00
- All other zip codes: $12.00
This logic ensures the fee matches the effort required for the delivery.
Step 4: Construct the Webhook Response
The response from n8n must follow a strict format. You need to return a 200 OK status with a JSON body that tells the Flow which screen to show next and what data to update. Use the Respond to Webhook node in n8n for this task.
{
"version": "3.1",
"screen": "ADDRESS_SCREEN",
"data": {
"delivery_fee": "$8.00",
"is_valid": true
}
}
When the Flow receives this response, the delivery_fee variable updates on the user's screen. The user sees the new price without the screen flickering or closing.
Practical Examples of Dynamic Fees
Distance-Based Calculations
Use n8n to connect to the Google Distance Matrix API. When the user enters their full address, n8n calculates the exact mileage from your warehouse. You then multiply the miles by a set rate. This method is the most accurate for businesses covering large metropolitan areas.
Surge Pricing for Busy Hours
Incorporate a Date & Time node in n8n. If a customer places an order during Friday evening rush hour, the workflow adds a surcharge. This helps manage delivery demand and compensates drivers for the extra time spent in traffic.
Weight-Based Shipping
If the Flow allows users to select products before the address screen, pass the total order weight in the payload. n8n aggregates the weight and calculates a shipping tier. Heavy items trigger a higher fee automatically.
Edge Cases to Handle
Invalid Address or Zip Code
Users often make typos. If your logic cannot find a price for a specific zip code, return an error message instead of a fee. Use the data object in your response to set an error flag. In the Flow JSON, use conditional visibility to show a red text warning when is_valid is false.
Webhook Timeouts
WhatsApp requires a response within 10 seconds. If your calculation takes longer, the Flow shows a generic error. Ensure your n8n workflow is optimized. Avoid long chains of slow API calls. Use a cache for frequent address lookups to speed up the process.
Payload Encryption Failures
WhatsApp Flows use end-to-end encryption for data exchange. If your decryption key is wrong, n8n receives unreadable gibberish. Always store your private key securely and use a helper library to handle the AES-GCM decryption required by the platform.
Troubleshooting Common Issues
The Flow says 'Something went wrong' after clicking the button.
Check the n8n execution logs. Usually, this means your JSON response format is incorrect or the version field does not match the version in your Flow definition. Ensure the response status is exactly 200.
The delivery fee does not update on the screen.
Verify that the variable name in your Flow JSON (e.g., delivery_fee) matches the key in the n8n response object exactly. Variable names are case-sensitive.
n8n shows a 403 Forbidden error. This happens if you have not configured your Meta App to allow the specific n8n URL. Add your webhook URL to the 'Flows' configuration section in the Meta Developer Portal and ensure the public key is correctly uploaded.
FAQ
Does this work with the unofficial WhatsApp API? WhatsApp Flows are a specific feature of the official Business Cloud API. While you use WASenderApi for sending templates and handling standard chats, the interactive Flow screens require the official environment to render correctly. You are able to use both in tandem by sending a Flow link via a standard message.
Is there a limit to how many times a user updates the fee? There is no hard limit on data exchange requests, but each request uses your server resources. It is best to trigger the calculation once the user finishes typing their address or clicks a specific button.
Do I need a separate server for the calculation? n8n acts as your server. As long as your n8n instance is reachable via the internet and has enough memory to process the requests, no additional infrastructure is necessary.
Are the data exchange requests encrypted? Yes. Meta encrypts every request sent to your webhook. You must use your Flow's private key to decrypt the incoming data. This protects user privacy and ensures address information remains secure.
Is it possible to calculate taxes alongside delivery fees? Yes. n8n is able to perform multiple calculations simultaneously. You return a total that includes the item price, delivery fee, and applicable taxes in the same JSON response.
Conclusion and Next Steps
Implementing dynamic delivery fees transforms a simple chat into a sophisticated sales tool. By connecting WhatsApp Flows to n8n, you provide your customers with accurate, real-time information that builds trust and increases sales.
Your next step is to refine your pricing logic. Start with simple zip code zones and gradually move toward complex distance-based APIs. Once your webhook is stable, consider adding logging to n8n to track which delivery zones are the most popular. This data helps you optimize your logistics and marketing efforts over time.
