How can I use AddMob in Cocos2D-js project?

Hi!
Can you help me ?
I can not found example how use AdMob for Cocos2D-js project.
How can I use AdMob in Cocos2D-js project?

1 Like

I don’t know yet how to integrate AdMob for iPhone but this steps helped me integrate AdMob for Android:

Step 1

First of all you must compile plugin. Some instruction here:
http://cocos2d-x.org/docs/manual/framework/html5/jsb/plugin-x/how-to-use-plugin-x-on-android/en

Step 2

Follow this instruction:
http://www.cocos2d-x.org/docs/manual/framework/html5/facebook-sdk/facebook-sdk-on-android/en

Make steps 3-5 from instruction.

In step 4 true location is frameworks/runtime-src/proj.android/jni/javascript/main.cpp

Step 3

Make some changes for file frameworks/runtime-src/proj.android/build-cfg.json

Add following path to ndk_module_path : ../../js-bindings/cocos2d-x/plugin/publish

Add following paths to copy_resources:

{from: "../../js-bindings/cocos2d-x/plugin/jsbindings/script, to: ""},
{from: "../../js-bindings/cocos2d-x/plugin/protocols/proj.android/src", to: "../src"},
{from: "../../js-bindings/cocos2d-x/plugin/plugins/admob/proj.android/src", to: "../src"},
{from: "../../js-bindings/cocos2d-x/plugin/plugins/admob/proj.android/sdk", to: "../libs"} 

Step 4

Make some changes for file frameworks/runtime-src/proj.android/src/ ... /AppActivity.java

Add import org.cocos2dx.plugin.PluginWrapper;

And your onCreateView() method must look like this:

@Override
public Cocos2dxGLSurfaceView onCreateView() {
    Cocos2dxGLSurfaceView glSurfaceView = new Cocos2dxGLSurfaceView(this);
    glSurfaceView.setEGLConfigChooser(5, 6, 5, 0, 16, 8);
    PluginWrapper.init(this);
    PluginWrapper.setGLSurfaceView(glSurfaceView);
    return glSurfaceView;
}

Step 5

Copy all files:
from js-bindings/cocos2d-x/plugin/jsbindings/auto to js-bindings/bindings/auto and
from js-bindings/cocos2d-x/plugin/jsbindings/manual to js-bindings/bindings/manual

Step 6

Make some changes for frameworks/runtime-src/proj.android/AndroidManifest.xml

From frameworks/js-bindings/cocos2d-x/plugin/publish/plugins/admob/android copy <activity ... /> and paste this after </activity> in your AndroidManifest.xml.

In your AndroidManifest.xml must be included this permissions:

<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>

Step 7

Now you can add to your project something like this:

    var AdMob = plugin.PluginManager.getInstance().loadPlugin("AdsAdmob");
    var m = {
		"AdmobID" : "your_admob_id",
		"AdmobType" : "1",
		"AdmobSizeEnum" : "1"
    };
    
    AdMob.configDeveloperInfo(m);
    AdMob.showAds(m, 2);
2 Likes

Danilf16 : Thanks for this. it seems to be the correct way, I compiled Facebook plugin with help of this post,
but with admob I’m getting this “already defined module” error. tried several times with master and develop branch.

here is my log,

Updated project.properties
Updated local.properties
Updated file /Users/eduardoreges/Documents/cocos/admob/frameworks/runtime-src/proj.android/proguard-project.txt
Updated project.properties
Updated local.properties
Updated file /Users/eduardoreges/Documents/cocos/admob/frameworks/runtime-src/proj.android/../../js-bindings/cocos2d-x/cocos/platform/android/java/proguard-project.txt
Android NDK: WARNING: APP_PLATFORM android-19 is larger than android:minSdkVersion 9 in ./AndroidManifest.xml    
/Users/eduardoreges/Dev/android-ndk-r9d2/build/core/build-module.mk:34: *** Android NDK: Aborting.    .  Stop.
Android NDK: Trying to define local module 'PluginProtocolStatic' in /Users/eduardoreges/Documents/cocos/admob/frameworks/runtime-src/proj.android/../../js-bindings/cocos2d-x/plugin/protocols/proj.android/jni/Android.mk.    
Android NDK: But this module was already defined by /Users/eduardoreges/Documents/cocos/admob/frameworks/runtime-src/proj.android/../../js-bindings/cocos2d-x/plugin/publish/protocols/android/Android.mk.    
make: Entering directory `/Users/eduardoreges/Documents/cocos/admob/frameworks/runtime-src/proj.android'
make: Leaving directory `/Users/eduardoreges/Documents/cocos/admob/frameworks/runtime-src/proj.android'
Running command: compile
Building mode: debug
running: '/Applications/Android\ Studio.app/sdk/tools/android update project -t android-21 -p /Users/eduardoreges/Documents/cocos/admob/frameworks/runtime-src/proj.android'

running: '/Applications/Android\ Studio.app/sdk/tools/android update lib-project -p /Users/eduardoreges/Documents/cocos/admob/frameworks/runtime-src/proj.android/../../js-bindings/cocos2d-x/cocos/platform/android/java -t android-21'

building native
NDK build mode: release
running: '/Users/eduardoreges/Dev/android-ndk-r9d2/ndk-build -C /Users/eduardoreges/Documents/cocos/admob/frameworks/runtime-src/proj.android -j3 NDK_MODULE_PATH=/Users/eduardoreges/Documents/cocos/admob/frameworks/runtime-src/proj.android/../../js-bindings:/Users/eduardoreges/Documents/cocos/admob/frameworks/runtime-src/proj.android/../../js-bindings/cocos2d-x:/Users/eduardoreges/Documents/cocos/admob/frameworks/runtime-src/proj.android/../../js-bindings/cocos2d-x/cocos:/Users/eduardoreges/Documents/cocos/admob/frameworks/runtime-src/proj.android/../../js-bindings/cocos2d-x/external:/Users/eduardoreges/Documents/cocos/admob/frameworks/runtime-src/proj.android/../../js-bindings/cocos2d-x/plugin/publish'

Ndk build failed!

any thoughts on this? thanks in advance!

@abrac1980 , Is it problem for release mode? Did you can build project in debug mode?

same error in both modes

@abrac1980 I’m not confident, but may be something wrong in build-cfg.json file. Can you provide this file?

@Danilf16 Thanks for your help.

{
    "ndk_module_path" :[
        "../../js-bindings",
        "../../js-bindings/cocos2d-x",
        "../../js-bindings/cocos2d-x/cocos",
        "../../js-bindings/cocos2d-x/external",
        "../../js-bindings/cocos2d-x/plugin/publish"
    ],
    "copy_resources": [
        {
            "from": "../../../src",
            "to": "src"
        },
        {
            "from": "../../../res",
            "to": "res"
        },
        {
            "from": "../../../main.js",
            "to": ""
        },
        {
            "from": "../../js-bindings/cocos2d-x/plugin/jsbindings/script", 
            "to": ""
        },
        {
            "from": "../../js-bindings/cocos2d-x/plugin/protocols/proj.android/src", 
            "to": "../src"
        },
        {
            "from": "../../js-bindings/cocos2d-x/plugin/plugins/admob/proj.android/src", 
            "to": "../src"
        }, 
        {
            "from": "../../js-bindings/cocos2d-x/plugin/plugins/admob/proj.android/sdk", 
            "to": "../libs"
        }
    ],
    "must_copy_resources": [
        {
            "from": "../../js-bindings/bindings/script",
            "to": "script"
        },
        {
            "from": "../../../config.json",
            "to": ""
        },
        {
            "from": "../../../project.json",
            "to": ""
        } 
    ]
}

@abrac1980 Strangely… You say that you compile Facebook plugin. Is this plugin works in your project? And which software you use?

I use:
Android ndk: r9d
Apache ant: 1.9.4
Cocos2d-js: v3.0
Cocos IDE: V1.0.0 RC2
Python: 2.7
JDK: 1.7.0_67

I am using cocos2d-js 3.1 that must be the issue. I can’t downgrade my project now. so I wll keep trying to compile on 3.1 , I’m pretty sure the problem is in the android.mk files.
Thanks for the help anyway!.

Thank you, works great in my project :smile:
Any idea how to display interstitial ads? I managed to do it on iOS, I believe it is possible to do something similar on android as well…
Cheers!

There is a proj.android folder , import that project in to eclipse edit it the way you want just dont change the flow , edit the same way you did for interestitial ads on iOS set it up for android

Yeah well, that’s exactly what I had in mind… I thought maybe someone has already implemented it and I could avoid potential bugs…

I have implemented it and almost done with the sample project also but lil busy from last two weeks to finish off my blog , I have updated maximum plugin which were required for my project , one small thing is left had got bug in googleIAP plugin which I will be fixing this weekend

Does your implementation uses google play services, rather than the old google android sdk for interstitial ads?

Yes , Its working with the google play services and not with older libs

sounds good.
I’m currently checking other platforms for html5/js game development… I had a breakdown while dealing with facebook/admob/IAP integration for cocos2d-js :frowning: … seems like other platforms handing simpler methods to deal with this kind of stuff…

I think cocos2d-JS is the best one , where are you stuck ? Let me help you

I think cocos2D-JS is a great platform for developing games’ cores. in terms of plugins, I think it’s not there yet.
It lacks basic features of retrieving facebook profile pictures for example.
Integrating plugins and using them is difficult since you have to work your way through obj-c, java & c++ to make it work. I feel like I need to invest a lot of time preparing & integrating the plugins I need for my game, as first time user.
Also, documentation is rather poor. There are a lot of outdated manuals and tutorials and one need to go through a lot of work doing it alone.
It took me around two weeks to integrate facebook, just to face problems loading profile pictures on mobile platforms.
IAP on iOS doesn’t work (thread), no interstitial support for admob.
what about other platforms? chartboost, leadbolt, mopub and others?

Finally, I’m not sure performance is that important when creating simple 2d games. cocos2d would probably beat it contenders in this section but I truly believe the html canvas is just good enough for casual gaming. Other platforms are straight and easy to work with plugins and that is currently way more important for me.

Thank you!

After maticulously following your steps and double checking everything I am getting the following error when I try to debug my HelloWorld project:

JS: /data/data/org.cocos2dx.PrebuiltRuntimeJs/files/debugruntime/src/app.js:11:ReferenceError: plugin is not defined
Where my line 11 code is: var AdMob = plugin.PluginManager.getInstance.loadPlugin(“AdsAdmob”)

Thankyou for putting the time into writing a walkthrough

Hello, @Marteh . Please check your code. You must have this (pay attention to getInstance() but in your example you have getInstance without brackets):

var AdMob = plugin.PluginManager.getInstance().loadPlugin("AdsAdmob");