小程序banner广告和激励广告

1、小程序banner广告

1.1、先要在小程序公众后台获取广告位ID

代码片

   <view class="empty">
     <ad unit-id="广告id"></ad>
   </view>

注意事项： Banner 广告不允许直接设置样式属性，默认宽度为100%（width: 100%），高度会自动等比例计算，因此开发者可以设置广告外层组件的宽度调整广告的尺寸。 广告外层组件的宽度不允许小于300px，当宽度小于300px时，Banner 广告的宽度会强制调整为300px

2、小程序激励广告

2.1、先创建广告实例
广告实例要在初始化就开始创建，可以在小程序页面的 onLoad 事件回调中创建广告实例，
代码片

// 在页面中定义激励视频广告
let videoAd = null
Page({
  onLoad() {
   // 在页面onLoad回调事件中创建激励视频广告实例
   if (wx.createRewardedVideoAd) {
    videoAd = wx.createRewardedVideoAd({
      adUnitId: 'xxxx'
    })
    videoAd.onLoad(() => {})
    videoAd.onError((err) => {})
    videoAd.onClose((res) => {})
  }
  }
})

2.2、广告拉取
激励视频广告组件是自动拉取广告并进行更新的，在组件创建后会拉取一次广告，用户点击 关闭广告 后会去拉取下一条广告
代码片

           if (videoAd) {
          // 用户触发广告后，显示激励视频广告
          videoAd.show().catch(() => {
            // 拉取失败，重新拉取
           videoAd.load()
              .then(() =>videoAd.show(
              ))
              .catch(err => {
                console.log('激励视频 广告显示失败')
              })
          })
           // 用户点击了【关闭广告】按钮
          videoAd.onClose(res => {
            if (res && res.isEnded) {
                // 正常播放结束，可以下发游戏奖励

              })
            } else {
              // 播放中途退出，不下发游戏奖励
              
            }
        })
       }

注意事项：多个地方调用videoAd.onClose() 等方法监听广告事件会产生多次事件回调，会导致事件经常窜，在一个页面触发该事件，导致另一个页面有相同事件会被触发，可以在每个自己页面调用后取消原有的监听事件再重新监听，也可以在页面关闭的钩子里取消原有的监听事件
代码片

       if (videoAd) {
          // 用户触发广告后，显示激励视频广告
          videoAd.show().catch(() => {
            // 拉取失败，重新拉取
           videoAd.load()
              .then(() =>videoAd.show(
              ))
              .catch(err => {
                console.log('激励视频 广告显示失败')
              })
          })
           // 用户点击了【关闭广告】按钮
          videoAd.onClose(res => {
          if(!videoAd) return
             videoAd.offClose()
            if (res && res.isEnded) {
                // 正常播放结束，可以下发游戏奖励

              })
            } else {
              // 播放中途退出，不下发游戏奖励
              
            }
        })
       }