小程序插入激励视频广告例子

鼓捣了一段时间,终于算是明白了,现在想想确实很简单,毕竟只是函数与函数调用的问题。
首先设置需要定义广告函数,在网上看到的很多都在把他直接加在了onload函数里面,但是对于小白来言,处理不好与其他之间事件的关系,导致出错。所以我直接定义了一个广告加载函数。
首先在.js文件page上方定义videoAd,

var videoAd = null;

在.js页面里

//加载激励广告
  adGet: function () {

    if (qq.createRewardedVideoAd) {
      // 加载激励视频广告
      videoAd = qq.createRewardedVideoAd({
        adUnitId: 'egffhghfhfgfag7'//你的广告key
      })
      //捕捉错误
      videoAd.onError(err => {
        // 进行适当的提示
      })
      // 监听关闭
      videoAd.onClose((status) => {
        if (status && status.isEnded || status === undefined) {
          // 正常播放结束,下发奖励
          // continue you code
         

        } else {
          // 播放中途退出,进行提示
        }
      })
    }
  },

有的教程说需要加入到onload事件函数中,我试了试好像不用,在后面直接调用就可以了。
然后就是创建点击事件函数了。

//激励广告展示,函数名称是随意的,和前面对应就行了。
  openVideoAd() {
    console.log('打开激励视频');

    qq.showToast({
      title: '广告完成后跳转至空间',
      icon: 'none',
      duration: 2000
    });
    this.adGet();//这个地方就是调用了广告函数,然后直接展示

    // 在合适的位置打开广告
    if (videoAd) {
      videoAd.show().catch(err => {
        // 失败重试
        videoAd.load()
          .then(() => videoAd.show())
      })
    }
  },

现在我们只需要在wxml的按钮上添加点击事件就可以实现了。

<button class="goodbutton" hover-class="hover" bindtap="openVideoAd">广告展示</button>

这样就完美完成了点击响应插屏广告了

在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/qq_43513350/article/details/104058368