Skip to content
Marc Pascual edited this page Jun 8, 2020 · 18 revisions

title: Show interstitial ad description: Show interstitial ad url: /show-interstitial-ad contributors:

  • appfeel
  • bitgenoma
  • marcpascualsanchez
  • miqmago

Show an interstitial ad.

If this method is called before requestInterstitialAd, failure callback will be called. This method must be called when admob.events.onAdLoaded event is raised. If there is no ad available it calls fail callback.

try {
    await admob.showInterstitialAd();
} catch (err) {
    console.log('Error showing/hiding interstitial ad:', err);
}

Note: Interstitials may be shown even if the android app is in background. For this reason it is recommended to stop interstitials and reload them when onPause and onResume events are detected. This is an example on how to show interstitials every 2 minutes preventing to show them when the app is in background:

var isAppForeground = true;

function onAdLoaded(e) {
    if (isAppForeground) {
        if (e.adType === admob.AD_TYPE.INTERSTITIAL) {
            admob.showInterstitialAd();
            try {
                await admob.showInterstitialAd();
            } catch (err) {
                console.log('Error showing/hiding interstitial ad:', err);
            }
        }
    }
}

function onAdClosed(e) {
    if (isAppForeground) {
        if (e.adType === admob.AD_TYPE.INTERSTITIAL) {
            setTimeout(admob.requestInterstitialAd, 1000 * 60 * 2);
        }
    }
}

async function onPause() {
    if (isAppForeground) {
        try {
            await admob.destroyBannerView();
        } catch (err) {
            console.log('Error destroying banner view:', err);
        }
        isAppForeground = false;
    }
}

function onResume() {
    if (!isAppForeground) {
        setTimeout(admob.requestInterstitialAd, 1);
        isAppForeground = true;
    }
}

// optional, in case respond to events
function registerAdEvents() {
    document.addEventListener(admob.events.onAdLoaded, onAdLoaded);
    document.addEventListener(admob.events.onAdClosed, onAdClosed);

    document.addEventListener("pause", onPause, false);
    document.addEventListener("resume", onResume, false);
}

async function initAds() {
    if (admob) {
        var adIds = {
            ios : {
                banner : "ca-app-pub-XXXXXXXXXXXXXXXX/BBBBBBBBBB",
                interstitial : "ca-app-pub-XXXXXXXXXXXXXXXX/IIIIIIIIII"
            },
            android : {
                banner : "ca-app-pub-XXXXXXXXXXXXXXXX/BBBBBBBBBB",
                interstitial : "ca-app-pub-XXXXXXXXXXXXXXXX/IIIIIIIIII"
            }
        };

        var admobid = (/(android)/i.test(navigator.userAgent)) ? adIds.android : adIds.ios;

        await admob.setOptions({
            bannerId:          admobid.banner,
            interstitialAdId:     admobid.interstitial,
            autoShowInterstitial: false
        });

        registerAdEvents();
    } else {
        alert('AdMobAds plugin not ready');
    }
}

async function onDeviceReady() {
    document.removeEventListener('deviceready', onDeviceReady, false);
    await initAds();

    // request an interstitial
    try {
        await admob.requestInterstitialAd();
    } catch (err) {
        console.log('Error requesting interstitial ad:', err);
    }
}

document.addEventListener("deviceready", onDeviceReady, false);
Clone this wiki locally