Wie können AdMob-Anzeigen in ein Cordova-Projekt für Android und iOS integriert werden?

Question

Ich schreibe eine Multiplattform-App in Cordova mit der neuesten Version (6) und habe große Schwierigkeiten, AdMob-Anzeigen für iOS und Android zu verwenden. Ich habe die Codebeispiele für AdMob heruntergeladen, aber die Kontrolle über das JavaScript stürzt mich ab. Ich verstehe etwas über die Plugin-Architektur, aber ich kann es einfach nicht funktionieren lassen.

Bitte helfen.

Answer 1

Ihre beste Wette ist es, ein vorgefertigtes Plugin dafür zu verwenden. Ich habe Erfahrung mit einer, die für mich auf iOS und Android mit Cordova 6 funktioniert, wie Sie erwähnt haben.

Volle Anweisungen sind hier https://github.com/sunnycupertino/cordova-plugin-admob-simple oder hier https://www.npmjs.com/package/cordova-plugin-admob-simple

zu installieren:

cd yourappfolder 

cordova plugin add cordova-plugin-admob-simple 

Wenn Sie Eclipse verwenden, kopieren Sie die Google-Play-services.jar in den libs Ordner.

Fügen Sie die folgende Zeile in der Manifest-Datei, kurz vor der Endung Anwendung Tag

<meta-data android:name="com.google.android.gms.version" android:value="8487000" /> 

Jetzt in Ihrem Javascript, fügen Sie die folgenden Funktionen:

//initialize the goodies 
function initAd(){ 
     if (window.plugins && window.plugins.AdMob) { 
      var ad_units = { 
       ios : { 
        banner: 'ca-app-pub-xxxxxxxxxxx/xxxxxxxxxxx',  //PUT ADMOB ADCODE HERE 
        interstitial: 'ca-app-pub-xxxxxxxxxxx/xxxxxxxxxxx' //PUT ADMOB ADCODE HERE 
       }, 
       android : { 
        banner: 'ca-app-pub-xxxxxxxxxxx/xxxxxxxxxxx',  //PUT ADMOB ADCODE HERE 
        interstitial: 'ca-app-pub-xxxxxxxxxxx/xxxxxxxxxxx' //PUT ADMOB ADCODE HERE 
       } 
      }; 
      var admobid = (/(android)/i.test(navigator.userAgent)) ? ad_units.android : ad_units.ios; 

      window.plugins.AdMob.setOptions({ 
       publisherId: admobid.banner, 
       interstitialAdId: admobid.interstitial, 
       adSize: window.plugins.AdMob.AD_SIZE.SMART_BANNER, //use SMART_BANNER, BANNER, IAB_MRECT, IAB_BANNER, IAB_LEADERBOARD 
       bannerAtTop: false, // set to true, to put banner at top 
       overlap: true, // banner will overlap webview 
       offsetTopBar: false, // set to true to avoid ios7 status bar overlap 
       isTesting: false, // receiving test ad 
       autoShow: false // auto show interstitial ad when loaded 
      }); 

      registerAdEvents(); 
      window.plugins.AdMob.createInterstitialView(); //get the interstitials ready to be shown 
      window.plugins.AdMob.requestInterstitialAd(); 

     } else { 
      //alert('admob plugin not ready'); 
     } 
} 
//functions to allow you to know when ads are shown, etc. 
function registerAdEvents() { 
     document.addEventListener('onReceiveAd', function(){}); 
     document.addEventListener('onFailedToReceiveAd', function(data){}); 
     document.addEventListener('onPresentAd', function(){}); 
     document.addEventListener('onDismissAd', function(){ }); 
     document.addEventListener('onLeaveToAd', function(){ }); 
     document.addEventListener('onReceiveInterstitialAd', function(){ }); 
     document.addEventListener('onPresentInterstitialAd', function(){ }); 
     document.addEventListener('onDismissInterstitialAd', function(){ 
      window.plugins.AdMob.createInterstitialView();   //REMOVE THESE 2 LINES IF USING AUTOSHOW 
      window.plugins.AdMob.requestInterstitialAd();   //get the next one ready only after the current one is closed 
     }); 
    } 

//display the banner 
function showBannerFunc(){ 
    window.plugins.AdMob.createBannerView(); 
} 
//display the interstitial 
function showInterstitialFunc(){ 
    window.plugins.AdMob.showInterstitialAd(); 
} 

Aufruf init() von onDeviceReady ()

Rufen Sie showInterstitialFunc() und showBannerFunc() auf, um Anzeigen anzuzeigen.

Denken Sie daran, dass Sie ein wenig warten müssen, bevor Sie das Interstitial anzeigen, da das Laden viel Zeit in Anspruch nimmt.

Hoffe, das hilft.