CocosCreator微信小游戏广告接入(banner、激励式视频、插屏)

  • 开启小游戏流量主
    • 开启流量主(访问量>=1000)
  • 创建广告位
    • 微信小游戏平台的广告类型主要分为1:banner广告,2:插屏广告,3:激励视频,4:格子广告以及5:原生模版广告。
      在这里插入图片描述
  • 创建好广告位就开始编写代码
    • 定义几个全局变量,分别为
window.bannerAdv = null;
window.videoAdv = null;
window.interstitialAd = null;
  • 初始化广告组件
    • 这里我直接初始化了3个广告类型(banner,视频,插屏)
		let winSize = wx.getSystemInfoSync();//获取像素size
        // 创建 Banner 广告实例,提前初始化
        let bannerWidth = 300
        let bannerHeight = 80
        bannerAdv = wx.createBannerAd({
            adUnitId: '',//传入自己的id,此处为banner广告位ID
            adIntervals: 30,//定时刷新,最低30S
            style: {
                left: (winSize.windowWidth - bannerWidth) / 2,
                top: winSize.windowHeight - bannerHeight,
                width: bannerWidth,
            },
        })
        //重新定banner位置
        bannerAdv.onResize((res) => {
            bannerAdv.style.top = winSize.windowHeight - bannerAdv.style.realHeight-1;
        })
        // 在适合的场景显示 Banner 广告
        bannerAdv.show();//不建议直接显示
		//拉取失败处理
        bannerAdv.onError((err) => {
            console.log(err);
        })

        // 创建激励视频广告实例,提前初始化
        videoAdv = wx.createRewardedVideoAd({
            adUnitId: ''//传入自己的id,此处为视频广告位ID
        })

        // 创建插屏广告实例,提前初始化
        if (wx.createInterstitialAd) {
            interstitialAd = wx.createInterstitialAd({
                adUnitId: ''//传入自己的id,此处为插屏广告位ID
            })
        }
    },

  • 创建好后,在合适的地方调用
    • banner广告调用
//显示banner
bannerAdv.show()
//隐藏banner
bannerAdv.hide()
//销毁banner
bannerAdv.destroy()
  • 激励式视频广告调用
            // 用户触发广告后,显示激励视频广告
            videoAdv.show().catch(() => {
                // 失败重试
                videoAdv.load()
                    .then(() => videoAdv.show())
                    .catch(err => {
                        console.log('激励视频 广告显示失败')
                    })
            })
            //拉取异常处理
            videoAdv.onError((err) => {
                console.log(err);
            })
            videoAdv.onClose((res) => {
                if(!videoAdv)return;
                videoAdv.offClose();//需要清除回调,否则第N次广告会一次性给N个奖励
                //关闭
                if (res && res.isEnded || res === undefined) {
                    //正常播放结束,需要下发奖励
                    
                } else {
                    //播放退出,不下发奖励
                }
            })
  • 插屏广告调用
					// 在适合的场景显示插屏广告
                    if (interstitialAd) {
                        interstitialAd.show().catch((err) => {
                            console.error(err)
                        })
                    }
  • 接下来就可以打包微信平台,然后将代码放入微信开发者工具中,在开发者工具中看到广告是否正常拉取了喔。请添加图片描述
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
THE END
分享
二维码
< <上一篇
下一篇>>