monacaでadmob広告を組込む(覚書)https://ja.monaca.io
ハイブリットアプリ開発のフレームワークは、Ionicとmonacaがありますが、日本の会社ということで、monacaを取り上げます。
admob広告をハイブリッドアプリに組み込むためのプラグインは、現在、３つあります。
admob proとadmob freeとadmob-plusです。この3つの中でadmob proは、シェアウェアですがandroidのみ使用でき、iosでは、デバッグまでで、
実際にリリースバージョンを制作して、appleのデベロッパーサイトに上げるとエラーがメールで返ってきます。
内容は、App Store Connect名で、UIwebViewは、使用できません。WKWebViewをセキュリティと信頼のために必要とのメールです。
それ故に、admob proは、利用できません。残るは、admob freeとadmob-plusですが、admob freeは、既に古く開発を停止しています。
しかし、それをjarodms氏が改変して使用できるようにしています。これを使用する以外は、導入は難しいです。
それで、一応は、jarodms氏のadmob freeでandroid、ios共に使用できるようになります。
最後の一つは、今でも開発が進行中で、最新のadmob広告プラグインで、admob-plusというものです。
但し、monacaの場合、このadmob-plusの導入方法のまとめ記事が出ているには出ているのですが、そのまま記載してadmob-plusを利用しようとしても利用できません。
また、admob-plusの説明ページが別に作られていて、インストールの仕方が記載されていますが、その通りやってもエラーが表示されてインストールできません。
記載ページは、https://admob-plus.github.io/docs 内のCordovaのInstallationページにある方法ですが、記載のある2つのコマンドを試してもインストールできません。
しかし、その下の、android、iosのconfig.xmlの設定方法は、必要なのでひとまず先に設定しておきます。
admob-plusの本当の導入方法は、最初に、CLOUD IDEを開き、Preview Logの横のプラス文字をクリックして、new Terminalをクリックします。
その/project $行で、クローンコピーを行います。コマンドは以下の通りです。
git clone https://github.com/admob-plus/admob-plus.git
すると、node_modulesの上に、admob-plusフォルダが出来ます。このadmob-plusフォルダをnode_modules下に、移動させます。
次に、Configureメニュー内、Cordova Plugins Settingsをクリックして、出現したページのimport Cordova Pluginボタンをクリックします。
Specify URL or Package Nameをチェックし、Package Nameにadmob-plus-cordovaを記載してOKをクリックします。
すると、バージョンが書かれていない、admob-plus-cordovaプラグインが作成されます。この形式のプラグインは、ビルド中に組み込まれます。
そのプラグインをポイントすると、DisableとConfigureボタンが表示されますので、そのConfigureボタンをクリックします。
すると、子ウィンドウが立ち上がり、Install Parameters記載部分が表示されます。ここに、APP_ID_ANDROIDとAPP_ID_IOSを2行記載するか、
それぞれを1行だけ記載します。これで、admob-plus-cordovaプラグインが利用できるようになります。
また、しばらくすると、https://github.com/admob-plus/admob-plus.gitのアドレスを覚えるので、
Specify URL or Package Nameをチェックし、Package Nameにadmob-plus-cordovaを記載してOKをクリックするだけで、インストールできるようになります。
また他に、Package Nameに、admob-plus-cordova@Ver番号を記載すると、特定のバージョンのプラグインをインストールできます。
尚、古いバージョンのプラグインをインストールする場合は、既にある、node_modules下のadmob-plus-cordovaやadmob-plusを一度削除してから、インストールしてください。
また、成功したプラグインを所持したい場合でビルドしてもnode_modules下に無い場合は、Preview Logのタブ右横のドライバーボタンをクリックします。
すると、Project Recoveryウィンドウが出てくるので、Reconfigure node_modulesとRefresh terminal serverにだけチェックを残し、Start Recoveryボタンを
クリックします。
すると、Project Recoveryウィンドウ内で、リカバリーが始まります。リカバリーが終わると、node_modules下にadmob-plus-cordovaプラグインが出来ています。
これを右クリックしてExport Folderをクリックします。すると、PC内にdir.zipができるので、これを解凍してください。
すると、admob-plus-cordovaフォルダが解凍されます。これをそのままzip形式で圧縮してください。するとadmob-plus-cordova.zipのプラグインができます。
こうして制作したプラグインは、普通のプラグイン同様に、import Cordova Pluginボタン内の、Upload Compressed ZIP/TGZ Packageでインストールできます。
2021/07/29 23:31
_[1]_ _2_ _3_ _4_ _5_ _6_ _7_ _8_ _9_