Connect Your WhatsApp Business Cloud API
This guide connects your own Meta WhatsApp Business Platform account to SCREEN X PROTECTION. All credentials stay server-side — never in frontend code.
Connection Checklist
- Booking form → validates & submits to POST /api/bookings
- Backend generates unique Booking ID (SXP-YYYYMMDD-XXXX)
- Booking saved to store (status: NEW)
- Owner WhatsApp message built (click-to-chat always available)
- Customer WhatsApp confirmation sent via Cloud API (when configured)
- Webhook /api/whatsapp/webhook verifies & replies to TRACK <ID>
- Track page /track looks up booking by ID
- Admin /admin manages & updates status
Environment Variables
Add these as server-side environment (secrets). Never put them in frontend code, HTML, or GitHub. Do NOT fill with fake values — leave empty until you have the real ones from Meta.
Where: Meta App Dashboard → WhatsApp → API Setup (or Business Manager → System Users → Generate token).
Where: Meta App Dashboard → WhatsApp → API Setup → Phone Number ID.
Where: Meta Business Manager → Business Settings → WhatsApp Accounts → your account ID.
Where: You create this value. Use any hard-to-guess string (e.g. sxp_verify_8f3k2).
Where: Your database provider (e.g. Supabase, Neon, PlanetScale) connection string.
Meta WhatsApp Setup Steps
Go to business.facebook.com and create a Business Account for SCREEN X PROTECTION. Verify your business if you plan to go live with production messaging.
Go to developers.facebook.com → My Apps → Create App → select 'Business' type → name it (e.g. Screen X Protection WhatsApp) → Create.
In your app dashboard → Add Product → WhatsApp → Set Up. This enables the WhatsApp Cloud API for your app and gives you a test phone number.
Go to WhatsApp → API Setup. Copy the Phone Number ID. Generate a permanent access token via Business Manager → System Users → Add User → Generate token with whatsapp_business_messaging permission.
To use your real WhatsApp Business number (instead of the test number), go to WhatsApp Manager → add a number and migrate/link it. Then copy its Phone Number ID.
In WhatsApp → Configuration → Webhook, set the Callback URL to your site's https://YOURDOMAIN/api/whatsapp/webhook. Enter the same Verify Token you set in env (WHATSAPP_VERIFY_TOKEN). Verify & Save. Subscribe to 'messages'.
Automated customer confirmations sent outside the 24-hour session window require an APPROVED template. Go to WhatsApp Manager → Message Templates → Create. Submit for approval. Use the template name in your send-confirmation logic.
Use the API Setup 'Send Message' tester in Meta, or enable Test Mode on your booking form to create bookings without sending real messages. Once credentials are set in env, real automated messages will dispatch.
Template vs Session Messages
Session messages (free-form text) can be sent only within 24 hours of the customer's last message to your business number. Template messages (pre-approved by Meta) are required for automated confirmations sent outside that window. Do not bypass Meta's policies — submit and approve a template for the customer confirmation message.