Use fallback paywalls in an Expo project
This guide applies to Expo projects. If you’re using pure React Native (non-Expo), follow the pure React Native fallback guide instead.
To maintain a fluid user experience, it is important to set up fallbacks for your flows, paywalls, and onboardings. This precaution extends the application’s capabilities in case of partial or complete loss of internet connection.
-
If the application cannot access Adapty servers:
It will be able to display a fallback flow or paywall, and access the local onboarding configuration.
-
If the application cannot access the internet:
It will be able to display a fallback flow or paywall. Onboardings include remote content and require an internet connection to function.
Before you follow the steps in this guide, download the fallback configuration files from Adapty.
The Adapty SDK reads the fallback file from the native bundle — an iOS resource inside the .app package, or an entry under android/app/src/main/assets/. In an Expo project, npx expo prebuild --clean regenerates those directories on every run, so you can’t drop the files in manually. The react-native-adapty config plugin wires the file into the native bundle for you.
A complete working setup is available in the FocusJournalExpo sample app.
Configuration
-
Place the fallback JSON files anywhere in your project — typically next to other assets:
<your-project>/ └── assets/ ├── ios_fallback.json └── android_fallback.json -
Add the
fallbackFileoption to thereact-native-adaptyentry inapp.json(orapp.config.js). Each platform key is optional — wire up only the platforms you need:{ "expo": { "plugins": [ [ "react-native-adapty", { "fallbackFile": { "ios": "./assets/ios_fallback.json", "android": "./assets/android_fallback.json" } } ] ] } }Adapty exports a different fallback JSON for each platform — Apple product IDs on iOS, Google Play product IDs on Android. Point each platform to its own file.
-
Regenerate the native projects:
npx expo prebuildThe plugin adds the iOS file to the Xcode project’s bundle resources and copies the Android file into
android/app/src/main/assets/. The prebuild output includes lines like:[react-native-adapty] Registered ios_fallback.json as iOS bundle resource [react-native-adapty] Copied android_fallback.json to android assets/ -
Register the file with the SDK at runtime:
import { adapty } from 'react-native-adapty'; await adapty.activate('PUBLIC_SDK_KEY'); await adapty.setFallback({ ios: { fileName: 'ios_fallback.json' }, android: { relativeAssetPath: 'android_fallback.json' }, });The file names passed to
setFallbackmust match the basenames of the files configured underfallbackFile.
setFallback must run before the SDK fetches any paywall or onboarding.
Verification
After npx expo prebuild, check both platforms:
- Android: List the contents of
android/app/src/main/assets/. The file configured underfallbackFile.androidshould be present, and the iOS-only filename should not appear here. - iOS: Search
ios/<ProjectName>.xcodeproj/project.pbxprojfor the iOS filename. It should appear inPBXFileReference, theResourcesgroup, andPBXResourcesBuildPhase. The Android-only filename should not appear inproject.pbxproj.