Overview
The RevenueCat integration in WeWeb through Despia enables you to implement in-app purchases and subscriptions in your mobile application. This feature is essential for:
-
Monetizing your mobile app with one-time purchases
-
Setting up recurring subscriptions
-
Managing payment processing through Apple App Store and Google Play Store
-
Tracking revenue and user purchase history
-
Handling subscription lifecycle events (renewals, cancellations, refunds)
Prerequisites
Before implementing in-app purchases, ensure you have:
-
Despia Plugin: Install from WeWeb Marketplace under Libraries
-
RevenueCat Account: Create an account at RevenueCat
-
App Store/Play Store Setup: Products configured in your developer accounts
-
Published App: Initial app version published to enable product testing
Verify Despia Installation
-
Go to Assets → Library (book symbol)
-
Check for "Despia provider" package
-
Click Update if available to get latest features
Implementation Steps
Step 1: Configure RevenueCat in Despia
-
Add the Despia plugin component to the top of your page
-
Select the Despia component to access its settings
-
Enter your RevenueCat credentials:
-
API Key: Copy from RevenueCat → API Keys → Public SDK API Key
-
Project ID: Copy from RevenueCat → Project Settings → Project ID
-
-
Publish your application after adding credentials (mandatory for initial setup)
iOS and Android Apps will have 2 separate Public API Keys that need to be added to Despia via the Editor.
Step 2: Create Products in RevenueCat
-
Navigate to RevenueCat → Product Catalog → Products
-
Click Add New Product
-
Configure your product with:
-
Product identifier (e.g., "premium_subscription", "remove_ads")
-
Product type (subscription or one-time purchase)
-
Pricing and duration (for subscriptions)
-
Step 3: Configure Products in App Stores
Important: Products must be manually configured in both stores
Apple App Store
-
Go to App Store Connect → In-App Purchases
-
For one-time purchases:
-
Add product with matching identifier from RevenueCat
-
Upload screenshot of purchase screen
-
Add localized descriptions
-
-
For subscriptions:
-
Create a subscription group
-
Add subscription plans within the group
-
Set duration (weekly, monthly, yearly)
-
Upload screenshot and descriptions
-
Configure pricing
-
Google Play Store
Similar process in Google Play Console with matching product IDs
Step 4: Add Purchase Buttons in WeWeb
-
Add a button element for each product
-
Create a workflow for each button:
-
Action: Execute component action
-
Component: Despia plugin component
-
Action: Trigger in-app purchase
-
-
Configure purchase parameters:
-
External User ID: Dynamic user identifier (e.g., from auth data)
-
Product ID: Copy from RevenueCat product catalog
-
Step 5: Set Up Webhooks for Purchase Verification
-
In RevenueCat → Integrations → Webhooks
-
Click Add New Webhook
-
Configure:
-
URL: Your backend endpoint (Supabase, Xano, Zapier, etc.)
-
Authentication Token: Secure token for verification
-
Events: Select relevant events:
-
Initial purchase
-
Renewal
-
Cancellation
-
Refund
-
Billing issues
-
-
-
Your backend will receive purchase events with user identification
Step 6: Update Frontend After Purchase
To notify your WeWeb app of successful purchases:
-
Set up real-time communication (WebSockets):
-
Xano Real-Time
-
Supabase Real-Time
-
Ably or similar services
-
-
When webhook received → Update user access → Send WebSocket to frontend
-
Frontend receives update → Refresh UI/Show success message
Testing
Development Testing
-
Use sandbox test accounts for both stores
-
Device ID shows as "example device id" in browser
-
Actual purchase flow only works on real devices through Despia
Production Testing
-
Test with real devices through TestFlight (iOS) or Internal Testing (Android)
-
Verify webhook delivery to your backend
-
Confirm real-time updates to frontend
Publishing and Updates
Initial Publishing
-
Mandatory: Republish app when adding new products
-
Products must be included in app bundle for store approval
-
Both stores require review for new in-app purchase items
Over-the-Air Updates
-
UI changes, workflows, and logic update instantly
-
No republishing needed for:
-
Button text/design changes
-
Workflow modifications
-
Price display updates
-
-
Republishing required only for:
-
New products/subscriptions
-
Product ID changes
-
RevenueCat configuration changes
-
Important Considerations
Compliance
-
One-click cancellation required for subscriptions
-
Clear pricing display mandatory
-
Restore purchases functionality recommended
-
Terms of service and privacy policy links required
Product Management
-
Products must exist in RevenueCat AND app stores
-
Product IDs must match exactly across all platforms
-
Screenshots and descriptions required for store approval
-
Review process typically takes 24-48 hours
User Experience
-
Handle network failures gracefully
-
Provide clear purchase confirmation
-
Implement restore purchases for returning users
-
Show subscription management options
Common Use Cases
Subscription Tiers
-
Free tier with limited features
-
Premium monthly/yearly subscriptions
-
Family or team plans
One-Time Purchases
-
Remove ads permanently
-
Unlock premium features
-
Additional content packs
-
Consumable credits or tokens
Purchase Validation
-
Server-side receipt validation through RevenueCat
-
Grant access only after webhook confirmation
-
Handle edge cases (refunds, chargebacks)
Troubleshooting
Common Issues
-
Products not showing: Ensure app is republished after adding products
-
Purchase fails: Verify product IDs match exactly
-
Webhook not received: Check authentication token and URL
-
No real-time update: Verify WebSocket configuration
For additional support or questions, please contact our support team at support@despia.com