Offerwall integration for React Native

The ironSource Offerwall presents engaging offers to your users in exchange for valuable virtual content. This engaging, user-initiated ad unit is great for gaming and utility apps; and enhances every app experience!

Get up and running with the Offerwall Ad Unit in 3 easy steps:

1. Implement the Offerwall Listener
2. Present the Offerwall
3. Reward the User

Step 1. Implement the Offerwall Event Listeners

The ironSource SDK fires several events to inform you of the Offerwall activity and completions so you’ll know when to reward your users. Implement the listeners to receive these Offerwall events. Make sure to set the listeners before SDK initialization, to ensure all relevant information is sent. 

The plugin will notify your listeners of all possible events listed below:

/**
 * Invoked when there is a change in the Offerwall availability status.
 * isAvailable reflects the availability of Offerwall.
 * You can show the Offerwall by calling showOfferwall when isAvailable is true.
 * isAvailable would be false when Offerwall is not available.
 */
OfferwallEvents.onOfferwallAvailabilityChanged.setListener(
  (isAvailable: boolean) => {}
);
/**
 * Invoked when the Offerwall successfully loads for the user,
 * after calling the showOfferwall function.
 */
OfferwallEvents.onOfferwallOpened.setListener(() => {});
/**
 * Invoked when showOfferWall was called and the OfferWall failed to load.
 * error represents the reason for the showOfferwall failure.
 */
OWOfferwallEvents.onOfferwallShowFailed.setListener(
  (error: IronSourceError) => {}
);
/**
 * Invoked each time the user completes an offer or as a result of getOfferwallCredits.
 * Award the user with the credit amount based on the creditInfo.
 * creditInfo is an object of IronSourceOWCreditInfo with following fields:
 * - credits represents the number of credits the user has earned.
 * - totalCredits is the total number of credits ever earned by the user.
 * - totalCreditsFlag becomes true in cases where we are not able to provide the exact amount
 * of credits since the last event (specifically after the user clears the app data).
 * In such cases, credits will be equal to totalCredits.
 */
OfferwallEvents.onOfferwallAdCredited.setListener(
  (creditInfo: IronSourceOWCreditInfo) => {}
);
/**
 * Invoked when [getOfferWallCredits] fails to retrieve the user's credit balance info.
 * - [error] represents the reason for [getOfferwallCredits] failure.
 */
OfferwallEvents.onGetOfferwallCreditsFailed.setListener(
  (error: IronSourceError) => {}
);
/**
 * Invoked when the user is about to return to the application after closing the Offerwall.
 */
OfferwallEvents.onOfferwallClosed.setListener(() => {});

Step 2. Present the Offerwall

When the availability is true, you can show the Offerwall by calling showOfferwall:

IronSource.showOfferwall();

With ironSource’s Ad Placements, you can customize and optimize the Offerwall experience. This tool enables you to present the Offerwall to your users in various places, i.e., in your in-app store, between levels, in the main menu, etc. You can use the function below to define the exact Placement to show the Offerwall. Navigate to the Ad Placement document for more details.

IronSource.showOfferwall('YOUR_PLACEMENT_NAME');

Step 3. Reward the User

ironSource supports two methods to reward your users. Select one of the following:

1. Server-Side Callbacks
2. Client-Side Callbacks

Method 1: Server-Side Callbacks

The default setting in your ironSource account notifies you of the user’s completions or rewards via the onOfferwallAdCredited callback within the client of your app. Alternatively, you can turn on server-to-server callbacks to receive notifications to your back-end server. Once you select server-to-server callbacks you will not receive client-side notifications.

We recommend turning on server-to-server callbacks for Offerwall instead of client-side callbacks, as the authenticity of the callback can be verified. With server-to-server callbacks, you will have better control over the rewarding process as the user navigates out of your app to complete the offer.

• If you turn on server-to-server callbacks, remember not to reward the user more than once for the same completion.
• We will fire a server-to-server callback to the selected location with an Event ID which is the unique identifier of the transaction. For us to know you’ve granted the user, you must respond to the callback with [EVENT_ID]:OK anywhere within the HTTP payload of the callback.
• To utilize server-to-server callbacks, see here.

Method 2: Client-Side Callbacks

• Proactive Polling API

You may call the function getOfferwallCredits at any point during the user’s engagement with the app. You will then receive information on the user’s total credits and any new credits the user has earned.

See Step 1 for instructions on how to implement the protocol and receive callbacks for the following method:

IronSource.getOfferwallCredits();

• Automatic Client-Side Events

You can receive client-side events automatically within your application by registering to the Offerwall listener and setting the use of client-side callbacks. Setting automatic client-side callbacks will make sure that you will be notified about the user’s credit status at specific points in the Offerwall’s lifecycle. Make sure to implement this API before SDK initialization.

Call the function below to enable the client-side callbacks:

IronSource.setClientSideCallbacks(true);

Done!

You are now all set to deliver Offerwall Ad Units in your application.