Skip to main content

Make purchases in mobile app in Capacitor SDK

Displaying paywalls within your mobile app is an essential step in offering users access to premium content or services. However, simply presenting these paywalls is enough to support purchases only if you use Paywall Builder to customize your paywalls.

If you don't use the Paywall Builder, you must use a separate method called .makePurchase() to complete a purchase and unlock the desired content. This method serves as the gateway for users to engage with the paywalls and proceed with their desired transactions.

If your paywall has an active promotional offer for the product a user is trying to buy, Adapty will automatically apply it at the time of purchase.

Make sure you've done the initial configuration without skipping a single step. Without it, we can't validate purchases.

Make purchase

note

In paywalls built with Paywall Builder purchases are processed automatically with no additional code. If that's your case — you can skip this step.

import { adapty } from '@adapty/capacitor';

try {
const result = await adapty.makePurchase({ product });

if (result.type === 'success') {
const isSubscribed = result.profile?.accessLevels['YOUR_ACCESS_LEVEL']?.isActive;

if (isSubscribed) {
// Grant access to the paid features
console.log('User is now subscribed!');
}
} else if (result.type === 'user_cancelled') {
console.log('Purchase cancelled by user');
} else if (result.type === 'pending') {
console.log('Purchase is pending');
}
} catch (error) {
console.error('Purchase failed:', error);
}

Request parameters:

ParameterPresenceDescription
productrequiredAn AdaptyPaywallProduct object retrieved from the paywall.

Response parameters:

ParameterDescription
resultAn AdaptyPurchaseResult object with a type field indicating the purchase outcome ('success', 'user_cancelled', or 'pending') and a profile field containing the updated AdaptyProfile on successful purchases.

Change subscription when making a purchase

When a user opts for a new subscription instead of renewing the current one, the way it works depends on the app store:

  • For the App Store, the subscription is automatically updated within the subscription group. If a user purchases a subscription from one group while already having a subscription from another, both subscriptions will be active at the same time.
  • For Google Play, the subscription isn't automatically updated. You'll need to manage the switch in your mobile app code as described below.

To replace the subscription with another one in Android, call .makePurchase() method with the additional parameter:

import { adapty } from '@adapty/capacitor';

try {
const result = await adapty.makePurchase({
product,
params: {
android: {
subscriptionUpdateParams: {
oldSubVendorProductId: 'old_product_id',
prorationMode: 'charge_prorated_price'
},
isOfferPersonalized: true,
obfuscatedAccountId: 'account_123',
obfuscatedProfileId: 'profile_456'
}
}
});

if (result.type === 'success') {
const isSubscribed = result.profile?.accessLevels['YOUR_ACCESS_LEVEL']?.isActive;

if (isSubscribed) {
// Grant access to the paid features
console.log('Subscription updated successfully!');
}
} else if (result.type === 'user_cancelled') {
console.log('Purchase cancelled by user');
} else if (result.type === 'pending') {
console.log('Purchase is pending');
}
} catch (error) {
console.error('Purchase failed:', error);
}

Additional request parameter:

ParameterPresenceDescription
paramsoptionalAn object of the MakePurchaseParamsInput type containing platform-specific purchase parameters.

The MakePurchaseParamsInput structure includes:

{
android: {
subscriptionUpdateParams: {
oldSubVendorProductId: 'old_product_id',
prorationMode: 'charge_prorated_price'
},
isOfferPersonalized: true,
obfuscatedAccountId: 'account_123',
obfuscatedProfileId: 'profile_456'
}
}

You can read more about subscriptions and replacement modes in the Google Developer documentation:

Redeem Offer Code in iOS

Since iOS 14.0, your users can redeem Offer Codes. Code redemption means using a special code, like a promotional or gift card code, to get free access to content or features in an app or on the App Store. To enable users to redeem offer codes, you can display the offer code redemption sheet by using the appropriate SDK method:

import { adapty } from '@adapty/capacitor';

try {
await adapty.presentCodeRedemptionSheet();
} catch (error) {
console.error('Failed to present code redemption sheet:', error);
}
danger

Based on our observations, the Offer Code Redemption sheet in some apps may not work reliably. We recommend redirecting the user directly to the App Store.

In order to do this, you need to open the url of the following format: https://apps.apple.com/redeem?ctx=offercodes&id={apple_app_id}&code={code}