153 lines
4.9 KiB
Markdown
153 lines
4.9 KiB
Markdown
# n8n Webhook Routing Configuration
|
|
|
|
## Overview
|
|
|
|
n8n is intentionally kept internal to the Docker network and **not exposed to the internet**. To allow the browser to trigger n8n workflows via webhooks, Kong (the API gateway) proxies webhook requests to the internal n8n service.
|
|
|
|
## Architecture
|
|
|
|
```
|
|
Browser Kong (Port 55521) n8n (Port 5678, internal)
|
|
| | |
|
|
| POST /webhook/* | |
|
|
|----------------------> | (no strip_path) |
|
|
| | POST /webhook/* |
|
|
| |--------------------------> |
|
|
| | Webhook triggers |
|
|
| | workflow |
|
|
|<----- Response --------|<---------------------------|
|
|
```
|
|
|
|
## Configuration Changes
|
|
|
|
### 1. Kong Configuration (`supabase/kong.yml`)
|
|
|
|
Added a new service to route webhook traffic to internal n8n:
|
|
|
|
```yaml
|
|
- name: n8n-webhooks
|
|
url: http://n8n:5678/
|
|
routes:
|
|
- name: n8n-webhooks-all
|
|
strip_path: false
|
|
paths:
|
|
- /webhook/
|
|
plugins:
|
|
- name: cors
|
|
```
|
|
|
|
- `strip_path: false` ensures the full `/webhook/...` path is forwarded to n8n
|
|
- CORS plugin allows browser cross-origin requests (all origins for internal workflow triggers)
|
|
|
|
### 2. Docker Compose (`docker-compose.yml`)
|
|
|
|
**Kong service:**
|
|
- Added `n8n` to the `depends_on` list (waits for n8n to start before Kong)
|
|
|
|
**n8n service:**
|
|
- Updated `WEBHOOK_URL` environment variable to use `${WEBHOOK_DOMAIN:http://localhost:55590}/`
|
|
- This allows production deployments to override the default localhost URL
|
|
|
|
### 3. Frontend Configuration (`frontend/config.js`)
|
|
|
|
Updated the webhook URL configuration:
|
|
|
|
```javascript
|
|
N8N_WEBHOOK_URL: "/webhook/manual-email-send"
|
|
```
|
|
|
|
This is a **same-origin request** path that works for both:
|
|
- **Local:** `http://localhost:55521/webhook/manual-email-send` (Kong on port 55521)
|
|
- **Production:** `https://your-domain.com/webhook/manual-email-send`
|
|
|
|
### 4. Admin UI (`frontend/admin.js`)
|
|
|
|
Updated `sendOrderEmailDirect()` function to use the configured webhook URL directly:
|
|
|
|
```javascript
|
|
const n8nUrl = window.MCCARS_CONFIG?.N8N_WEBHOOK_URL || "/webhook/manual-email-send";
|
|
```
|
|
|
|
## Deployment Steps
|
|
|
|
### For Production Deployment:
|
|
|
|
1. **Update Kong configuration** by deploying the modified `supabase/kong.yml`
|
|
- Kong will automatically reload the config and start proxying `/webhook/*` requests
|
|
|
|
2. **Set environment variables** (in your `.env` file):
|
|
```bash
|
|
# Optional: Override n8n webhook domain (defaults to localhost)
|
|
WEBHOOK_DOMAIN=https://your-domain.com
|
|
```
|
|
|
|
If not set, n8n will use the default `http://localhost:55590/` (only works internally)
|
|
|
|
3. **Deploy the updated code**:
|
|
- `frontend/config.js` with the new webhook URL
|
|
- `frontend/admin.js` with the updated sendOrderEmailDirect function
|
|
- `docker-compose.yml` with Kong n8n dependency
|
|
- `supabase/kong.yml` with the new n8n service
|
|
|
|
4. **Restart the stack**:
|
|
```bash
|
|
docker-compose up -d
|
|
```
|
|
|
|
### For Local Development:
|
|
|
|
No special configuration needed:
|
|
- Kong is already on port 55521
|
|
- Browser requests to `/webhook/manual-email-send` will be proxied to internal n8n
|
|
- Works the same as production (same-origin requests)
|
|
|
|
## How It Works
|
|
|
|
1. **Browser action**: User clicks "Email senden" button in order dialog
|
|
2. **Browser request**: JavaScript POSTs to `/webhook/manual-email-send` (same origin)
|
|
3. **Kong routing**: Kong receives request, forwards to `http://n8n:5678/webhook/manual-email-send`
|
|
4. **n8n webhook**: n8n webhook listener triggers the manual-email-send workflow
|
|
5. **Workflow execution**: n8n fetches order data, builds email, sends via SMTP
|
|
6. **Response**: Workflow returns success/error response to browser
|
|
|
|
## Security
|
|
|
|
- **Network isolation**: n8n remains internal, not exposed to internet
|
|
- **No authentication required**: Webhook path is open (can be restricted later if needed)
|
|
- **CORS enabled**: Allows browser requests to Kong
|
|
- **Kong isolation**: Kong is the only service exposed; internal services hidden behind it
|
|
|
|
## Troubleshooting
|
|
|
|
### "Failed to fetch" error in browser
|
|
|
|
1. Check Kong is routing properly:
|
|
```bash
|
|
# Test from inside docker network
|
|
docker-compose exec kong curl -v http://n8n:5678/webhook/manual-email-send
|
|
```
|
|
|
|
2. Verify Kong config loaded:
|
|
```bash
|
|
docker-compose logs kong | grep "n8n-webhooks"
|
|
```
|
|
|
|
3. Check n8n is running:
|
|
```bash
|
|
docker-compose logs n8n
|
|
```
|
|
|
|
### n8n workflow not triggering
|
|
|
|
1. Verify webhook path in n8n workflow (should be exactly `/webhook/manual-email-send`)
|
|
2. Check n8n logs for webhook errors:
|
|
```bash
|
|
docker-compose logs n8n | grep webhook
|
|
```
|
|
|
|
## References
|
|
|
|
- Kong configuration format: https://docs.konghq.com/deck/latest/
|
|
- n8n webhooks: https://docs.n8n.io/nodes/n8n-nodes-base.Webhook/
|
|
- Docker networking: https://docs.docker.com/engine/reference/commandline/network_connect/
|