Cocos Creator微信小游戏添加banner广告

学了小游戏开发也有几个月了，这边写一下这几个月以来遇到的坑。
首先是添加banner广告
看过很多个写微信广告的写法。感觉其实是在误导萌新，这是一般别人的例子

let winSize = wx.getSystemInfoSync();
        
console.log(winSize);
let bannerHeight = 80;
let bannerWidth = 300;

this._bannerAd = wx.createBannerAd({
	adUnitId: '************', //填写广告id
	style: {
		left: (winSize.windowWidth-bannerWidth)/2,
		top: winSize.windowHeight - bannerHeight,
		width: bannerWidth,
	}
});
        this._bannerAd.show(); //banner 默认隐藏(hide) 要打开
        //微信缩放后得到banner的真实高度，从新设置banner的top 属性
        this._bannerAd.onResize(res => {
            this._bannerAd.style.top = winSize.windowHeight - this._bannerAd.style.realHeight;
         })

实际上，上述例子是一个中规中距的创建屏幕下方banner广告方法，但是对于萌新而言这套方法是需要改进的

例如我们创建广告this._bannerAd = wx.createBannerAd的时候，实际上我们最好是在创建一个common脚本然后在里面写一个bannerAd的参数并且赋值为null

export = {
    bannerAd : null,
    bannerAd2 : null,
    windowWidth : null,
    windowHeight : null,
}

我们先来说一下为什么有必要这样写
在我们加载广告的时候，并不是直接onload出来的，是需要等待一段的加载时间
因此，如果直接创建的话，你将会等一段时间才能看到广告，特别是你需要在需要的地方才显示【.show()】，或者在不需要的时候【.hide()】，而销毁广告也是可以直接使用的，不过并不推荐在使用destroy方法的时候之前一段时间才onload广告，会造成广告还未生成但是还没destroy导致后面广告会一直出现在屏幕上方永远消不掉了

在需要的地方引入这个脚本只要在需要的地方开头先写一个

var comm = require("./Common");

接下来是加载广告，一般可以写在loading界面的onload()事件里，代码如下

var comm = require("./Common");

onload(){
  if (typeof (wx) !== "undefined") {
           // 手机屏幕信息
            let winSize = wx.getSystemInfoSync({
                success(res) {
                	comm.windowWidth = res.windowWidth;
                	comm.windowHeight = res.windowHeight;
                }
            });
            console.log(comm.windowWidth,comm.windowHeight);
            // 广告1和2
            if(comm.bannerAd == null) {
                // 广告
                comm.bannerAd = window.wx.createBannerAd({
                    adUnitId: '**********************************',
                    style: {
                        left: comm.windowWidth/2 - 150,
                        top: comm.windowHeight - 90,
                        width:  300,
                    }
                })
                comm.bannerAd.onResize(()=>{
                    comm.bannerAd.style.left = comm.windowWidth/2 - 150 + 0.1;
                    comm.bannerAd.style.top = comm.windowHeight - comm.bannerAd.style.realHeight + 0.1;
                });
                comm.bannerAd.onError(function(res){
                    console.log(res);
                })
            }
     }
}

这里有几点要说明，微信的广告是固定的大小比例，最小300的宽，宽度确定高度，所以不需要去管高度
第二点，微信的广告位置是以左上角为坐标系的，因此在计算位置的时候需要进行相对应的判断，如上代码我是让他显示在屏幕之下，+0.1则是为了考虑到苹果机型的底边条

接下来在需要显示和隐藏的地方输入如下代码就可以了

comm.banner_1.show();
comm.banner_1.hide();