動画広告を付けます
cordova-admob-proプラグインを使ってMonacaアプリに広告をつける方法の覚書です。
こちらを参考にしました。
###1.手順
1.Admob Appにサインアップ
2.cordova-admob-proプラグインをMonacaアプリにインポート
3.コードを書く
###2.プラグインのインポート
プラグインをzip形式でダウンロードします
monacaの「Cordovaプラグイン」の項目から、ダウンロードしたzipをインポートします
###3.コード
ons.ready(function() {...});の中でadMobプラグインの初期化処理を実行します。
$(document).ready(function(){...}と共存させようとすると失敗します。
ons.ready(function() {
// Admobプラグイン使えるか検証
if (! AdMob) { alert( 'admob plugin not ready' ); return; }
else { alert( 'Admob OK' ); } // デバッグ用
// Admob初期化
initialization();
// 例えば動画広告を出す処理(初期化したら後は好きなタイミングで広告を出す)
showRewardVideo();
});
別のjsファイルに初期化処理や広告を呼ぶ処理を書きます
var admobid = {};
// デモ広告でテストする場合、IDは以下のままでOK
if( /(android)/i.test(navigator.userAgent) ) {
admobid = { // for Android
banner: 'ca-app-pub-3940256099942544/6300978111',
interstitial: 'ca-app-pub-3940256099942544/1033173712',
rewardvideo: 'ca-app-pub-3940256099942544/5224354917',
};
} else if(/(ipod|iphone|ipad)/i.test(navigator.userAgent)) {
admobid = { // for iOS
banner: 'ca-app-pub-3940256099942544/2934735716',
interstitial: 'ca-app-pub-3940256099942544/4411468910',
rewardvideo: 'ca-app-pub-3940256099942544/1712485313',
};
} else {
admobid = { // for Windows Phone
banner: 'ca-app-pub-6869992474017983/8878394753',
interstitial: 'ca-app-pub-6869992474017983/1355127956',
rewardvideo: '',
};
}
function initialization() {
// 初期化
AdMob.getAdSettings(
function(info){
// 成功時処理
},
function(){
// 失敗時処理
}
);
// オプションの設定
AdMob.setOptions({
//adId: admobid.banner, // admobのID
position: AdMob.AD_POSITION.BOTTOM_CENTER, // 動画が出る位置
isTesting: true, // テストするときはtrue
bgColor: 'black', // 背景色
// autoShow: true // 自動再生
});
$(document).on('onAdFailLoad', function(e){
// 広告表示に失敗した時の処理
if(typeof e.originalEvent !== 'undefined') e = e.originalEvent;
var data = e.detail || e.data || e;
alert('error: ' + data.reason );
});
}
// 動画広告
function showRewardVideo(){
AdMob.removeBanner();
AdMob.prepareRewardVideoAd(admobid.rewardvideo,
function(){
// 成功時処理
alert("prepare : OK");
},
function(){
// 失敗時処理
alert("error");
});
}
広告を取得するには2日ほど時間がかかることもあるそうなので、ビルドして様子を見ます。
動画以外の形態の広告(バナー広告等)を使う場合は、Monacaのプロジェクトの
plugins/cordova-plugin-admobpro/www/AdMob.jsを見ながら設定するとできると思います(未検証)。
###4.参考サイト様
https://docs.monaca.io/ja/sampleapp/samples/admob/
https://stackoverflow.com/questions/26843507/admob-sdk-error-code0
https://stackoverflow.com/questions/33566485/failed-to-load-ad-3