Rewarded Ad

Rewarded ads are ads that users have the option of interacting with in exchange for in-app rewards. These ads are ideal for monetizing free-to-play games and apps where users can earn virtual currency, extra lives, power-ups, or other benefits.

Creating a Rewarded Ad

1. Create Instance

   Create a new RewardedAd instance with your ad unit ID.

   const rewarded = new admob.RewardedAd({
     adUnitId: 'ca-app-pub-3940256099942544/5224354917' // Test ad unit
   })
   
2. Load the Ad

   Load the rewarded ad before showing it.

   await rewarded.load()
   
3. Show and Grant Reward

   Show the ad and listen for the reward event.

   rewarded.on('reward', (evt) => {
     console.log('User earned:', evt.reward.amount, evt.reward.type)
     // Grant the reward to the user
   })
   
   await rewarded.show()
   

API Reference

Constructor Options

adUnitId · string · required

Your AdMob ad unit ID for rewarded ads.

id · string

Optional unique identifier for this ad instance. Defaults to adUnitId if not provided.

contentUrl · string

URL string for content that is being displayed in your app.

keywords · string[]

Array of keyword strings for ad targeting.

npa · '1'

Set to '1' to enable non-personalized ads (for GDPR compliance).

serverSideVerification · object

Server-side verification options for secure reward validation.

new admob.RewardedAd({
  adUnitId: 'ca-app-pub-xxx/yyy',
  serverSideVerification: {
    userId: 'user123',
    customData: 'level5-completion'
  }
})

Properties:

• userId (string): User identifier to pass to your server
• customData (string): Custom data to pass to your server (max 255 characters)

Methods

load()

Loads a rewarded ad from AdMob.

await rewarded.load()

Returns: Promise<void>

show()

Displays the loaded rewarded ad.

await rewarded.show()

Returns: Promise<void>

Once a rewarded ad is shown, it cannot be shown again. You must load a new ad after each display.

isLoaded()

Checks if an ad is loaded and ready to be shown.

const loaded = await rewarded.isLoaded()
if (loaded) {
  await rewarded.show()
}

Returns: Promise<boolean>

on(eventName, callback)

Registers an event listener for the ad.

const unsubscribe = rewarded.on('reward', (evt) => {
  console.log('Reward earned:', evt.reward)
})

// Later: remove listener
unsubscribe()

Returns: Function - Unsubscribe function

Events

All events can be listened to using the on() method or via global event listeners.

load

Fired when the ad is successfully loaded and ready to show.

rewarded.on('load', (evt) => {
  console.log('Rewarded ad ready:', evt.ad.id)
})

loadfail

Fired when the ad request fails.

rewarded.on('loadfail', (evt) => {
  console.error('Load failed:', evt.error)
})

show

Fired when the ad is displayed to the user.

rewarded.on('show', (evt) => {
  console.log('Rewarded ad displayed')
})

showfail

Fired when the ad fails to display.

rewarded.on('showfail', (evt) => {
  console.error('Show failed:', evt.error)
})

reward

Most Important Event - Fired when the user has earned the reward by watching the ad.

rewarded.on('reward', (evt) => {
  const { amount, type } = evt.reward
  console.log(`User earned ${amount} ${type}`)
  
  // Grant the reward to the user
  grantReward(amount, type)
})

Event Object:

{
  reward: {
    amount: 10,        // Number of reward units
    type: "coins"      // Type of reward (defined in AdMob)
  }
}

The reward amount and type are configured in your AdMob account when setting up the rewarded ad unit.

dismiss

Fired when the user closes the ad and returns to the app.

rewarded.on('dismiss', (evt) => {
  console.log('Rewarded ad dismissed')
  // Load next ad
})

impression

Fired when an impression is recorded for the ad.

rewarded.on('impression', (evt) => {
  console.log('Impression recorded')
})

click

Fired when the user clicks on the ad.

rewarded.on('click', (evt) => {
  console.log('Ad clicked')
})

Usage Examples

Basic Implementation

let rewarded

document.addEventListener('deviceready', async () => {
  rewarded = new admob.RewardedAd({
    adUnitId: 'ca-app-pub-xxx/yyy'
  })
  
  rewarded.on('reward', (evt) => {
    console.log('User earned:', evt.reward.amount, evt.reward.type)
    grantReward(evt.reward.amount)
  })
  
  await rewarded.load()
  await rewarded.show()
}, false)

function grantReward(amount) {
  // Your reward logic here
  userCoins += amount
  updateUI()
}

Complete Flow with Auto-reload

let rewarded

document.addEventListener('deviceready', async () => {
  rewarded = new admob.RewardedAd({
    adUnitId: 'ca-app-pub-xxx/yyy'
  })
  
  // Handle successful load
  rewarded.on('load', () => {
    console.log('Rewarded ad is ready')
    updateRewardButtonUI(true)
  })
  
  // Handle load failure
  rewarded.on('loadfail', (evt) => {
    console.error('Failed to load ad:', evt.error)
    updateRewardButtonUI(false)
  })
  
  // Grant reward when earned
  rewarded.on('reward', (evt) => {
    const { amount, type } = evt.reward
    console.log(`Granting ${amount} ${type}`)
    grantUserReward(amount, type)
  })
  
  // Load next ad after dismiss
  rewarded.on('dismiss', async () => {
    console.log('Ad dismissed, loading next ad')
    await rewarded.load()
  })
  
  // Preload first ad
  await rewarded.load()
}, false)

function updateRewardButtonUI(enabled) {
  const button = document.getElementById('watch-ad-button')
  button.disabled = !enabled
  button.textContent = enabled ? 'Watch Ad for Reward' : 'Loading...'
}

User-Initiated Reward

let rewarded

document.addEventListener('deviceready', async () => {
  rewarded = new admob.RewardedAd({
    adUnitId: 'ca-app-pub-xxx/yyy'
  })
  
  rewarded.on('reward', (evt) => {
    grantCoins(evt.reward.amount)
  })
  
  // Preload
  await rewarded.load()
  
  // User clicks button
  document.getElementById('watch-ad-btn').addEventListener('click', async () => {
    const isLoaded = await rewarded.isLoaded()
    
    if (isLoaded) {
      await rewarded.show()
    } else {
      console.log('Ad not ready, please wait')
    }
  })
}, false)

Extra Lives Example

let rewarded
let lives = 0

function setupRewardedAd() {
  rewarded = new admob.RewardedAd({
    adUnitId: 'ca-app-pub-xxx/yyy'
  })
  
  rewarded.on('reward', (evt) => {
    // Grant extra lives
    lives += evt.reward.amount
    console.log(`Granted ${evt.reward.amount} lives. Total: ${lives}`)
    updateLivesDisplay()
  })
  
  rewarded.on('dismiss', async () => {
    // Reload for next time
    await rewarded.load()
  })
  
  // Initial load
  rewarded.load()
}

async function showContinueOption() {
  if (lives <= 0) {
    // Show "Watch ad to continue" option
    const result = await showContinueDialog()
    
    if (result === 'watch-ad') {
      const isLoaded = await rewarded.isLoaded()
      
      if (isLoaded) {
        await rewarded.show()
        // User will get lives via reward event
      } else {
        console.log('Ad not available')
      }
    }
  }
}

With Server-Side Verification

const rewarded = new admob.RewardedAd({
  adUnitId: 'ca-app-pub-xxx/yyy',
  serverSideVerification: {
    userId: getCurrentUserId(),
    customData: JSON.stringify({
      level: currentLevel,
      timestamp: Date.now()
    })
  }
})

rewarded.on('reward', async (evt) => {
  // The reward will also be verified on your server
  // via the rewarded ad callback from Google
  console.log('Reward granted (pending server verification)')
  
  // Optimistically grant reward
  temporarilyGrantReward(evt.reward.amount)
  
  // Verify with your server
  const verified = await verifyRewardWithServer()
  
  if (verified) {
    permanentlyGrantReward(evt.reward.amount)
  } else {
    revokeTemporaryReward()
  }
})

Server-Side Verification

For apps with server-side reward systems, use server-side verification (SSV) to validate that users earned rewards legitimately.

1. Configure SSV Options

   Set userId and optional customData when creating the ad.

   const rewarded = new admob.RewardedAd({
     adUnitId: 'ca-app-pub-xxx/yyy',
     serverSideVerification: {
       userId: 'user_12345',
       customData: 'level_complete_5'
     }
   })
   
2. Set Up Server Callback

   Configure your rewarded ad callback URL in the AdMob dashboard.

3. Verify on Server

   When a user earns a reward, Google will send a callback to your server with the verification information.

See the Rewarded Ads Server-Side Verification guide for detailed implementation instructions.

Best Practices

User Experience

1. Clear Value Proposition: Make it obvious what users will get for watching the ad
2. User Choice: Always let users choose to watch rewarded ads - never force them
3. Timing: Offer rewarded ads at natural points (e.g., after failing a level, before a challenge)
4. Follow Through: Always grant the reward immediately after the reward event

Technical

1. Preloading: Load ads early, before users need them
2. Check Status: Use isLoaded() to check if an ad is ready before showing
3. Auto-reload: Load the next ad immediately after dismissal
4. Error Handling: Gracefully handle cases where ads aren’t available
5. Server Verification: Use SSV for high-value rewards to prevent fraud

Important: Only grant rewards in the reward event callback. Users may close the ad before completing it, in which case the reward event will not fire.

Reward Configuration

• Configure reward amounts in your AdMob dashboard
• Use meaningful reward types (“coins”, “gems”, “lives”, etc.)
• Balance reward value to encourage engagement without devaluing purchases

References

• Rewarded Ads - AdMob Android Documentation
• Rewarded Ads - AdMob iOS Documentation
• Server-Side Verification - AdMob Documentation
• Rewarded Ad Guidance - AdMob Help