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
- The user taps a purchase button on your website.
- Your website sends a message to the app via the bridge, specifying the product to purchase.
- The app opens Apple's native payment sheet.
- Apple processes the payment.
- The app sends the result back to your website.
- 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
| Parameter | Required | Description |
|---|---|---|
product_id | Yes | The Product ID exactly as created in App Store Connect |
product_type | Yes | "consumable", "non-consumable", or "subscription" |
app_account_token | No | A UUID string linking the purchase to your internal user account. Included in Apple's purchase notification for server-side verification |
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) {
const { product, purchase } = data.response;
// Send the receipt to your backend for verification before unlocking anything
fetch('/api/unlock-premium', {
method: 'POST',
body: JSON.stringify({
product_id: product.id,
transaction_id: purchase.id,
verification_data: purchase.verification_data,
verification_source: purchase.verification_source
})
});
} else {
// Purchase failed or cancelled
console.log('Purchase failed:', data.response.message);
}
appilix.onmessage = null;
};Response Fields
| Field | Present When | Description |
|---|---|---|
status | Always | true if the purchase succeeded, false otherwise |
message | status is false | Reason for the failure (e.g. user cancelled, payment failed) |
product | status is true | Details of the purchased product, as returned by App Store Connect |
purchase | status is true | Details of the completed transaction |
product object
| Field | Description |
|---|---|
id | The Product ID, matching what you passed in product_id |
title | Localized product name from App Store Connect |
description | Localized product description from App Store Connect |
price | Localized, formatted price string (e.g. "$4.99") |
rawPrice | Price as a number, useful for calculations or analytics |
currencyCode | ISO currency code (e.g. "USD") |
purchase object
| Field | Description |
|---|---|
id | The transaction ID. Keep this for support requests, refund lookups, and to avoid double-crediting the same purchase |
transaction_date | When the transaction completed |
verification_data | The signed receipt data. Send this to your backend to verify with the App Store Server API before granting any entitlement |
verification_source | Identifies which Apple verification flow produced the receipt |
Never grant the purchased entitlement based on the client-side response alone — always verify verification_data against the App Store Server API from your backend first.
Product Types
| Type | Description |
|---|---|
consumable | Can be purchased multiple times. Use for credits, coins, or one-time boosts. |
non-consumable | Purchased once and owned permanently. Use for lifetime access or removing ads. |
subscription | Renews automatically on a schedule. Use for monthly or yearly plans. |
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.