Apple In-App Purchase

When your iOS app sells digital products — premium features, credits, subscriptions — Apple requires those purchases to go through Apple's In-App Purchase system, not your website's payment gateway. The Apple IAP bridge is what connects your existing website purchase flow to Apple's native payment sheet.

How It Works

1. The user taps a purchase button on your website.
2. Your website sends a message to the app via the bridge, specifying the product to purchase.
3. The app opens Apple's native payment sheet.
4. Apple processes the payment.
5. The app sends the result back to your website.
6. Your website delivers the product (or shows an error).

Triggering a Purchase

appilix.postMessage(JSON.stringify({
    type: "apple_iap_init",
    props: {
        product_id: "com.example.app.premium_monthly",
        product_type: "subscription",
        app_account_token: "550e8400-e29b-41d4-a716-446655440000"
    }
}));

Parameters

The product_id must match exactly what you created in App Store Connect — including capitalization and any dots or underscores.

Handling the Response

Set up the listener before triggering the purchase:

appilix.onmessage = function(event) {
    const data = JSON.parse(event.data);

    if (!data || data.type !== 'apple_iap_init') return;

    if (data.response.status === true) {
        // Purchase successful — deliver the product
        console.log('Purchase successful:', data.response.product);
        // Example: notify your backend to unlock the feature
        fetch('/api/unlock-premium', {
            method: 'POST',
            body: JSON.stringify({ product: data.response.product })
        });
    } else {
        // Purchase failed or cancelled
        console.log('Purchase failed:', data.response.message);
    }

    appilix.onmessage = null;
};

Product Types

Important Notes

• This bridge is for iOS only. On Android, your website's existing payment gateway works normally.
• Always verify the purchase on your backend before delivering the product. Do not rely solely on the client-side response.
• Test purchases using Apple's Sandbox environment before submitting to the App Store.
• Implementing this correctly requires modifying your website's purchase button logic and handling the bridge response. Involve a developer if needed.

For App Store Connect product setup instructions, see the Apple In-App Purchase article.