微信小程序激励式视频广告组件使用

微信小程序搜索:短视频去水印解析

目前微信小程序针对个人来说广告是最好的变现方式,广告主要分为:

1. Banner

2. 激励式视频

3. 插屏

Banner广告很简单,插入代码就可以显示

这里介绍下激励式视频广告实现(观看完整广告奖励积分):

//视频广告
let videoAd = null;
//视频广告拉取状态
let videoAdPushStatus = false;

Page({
  data: {
    //积分总数
    creditsAmountSum: 100
  },
  onLoad(options) {
    let that = this;

    that.videoAdShowSetting();
  },
  onShow() {
  },
  videoAdShowSetting: function() {
    var that = this;
    if (wx.createRewardedVideoAd) {
      videoAd = wx.createRewardedVideoAd({
        adUnitId: '自己申请的广告ID'
      })
      videoAd.onLoad(() => {
        //设置广告拉取成功
        videoAdPushStatus = true;
      });
      videoAd.onClose((status) => {
        if (status && status.isEnded || status === undefined) {
          //正常播放结束,可以下发奖励
          that.addUserCredits();
        } else {
          //不下发奖励
          wx.showModal({
            content: '广告未播放完成,无法获取积分',
            showCancel: false
          })
        }
      });
      videoAd.onError(() => {
        that.showToast('获取积分异常,请稍后重试');
      });
    }
  },
  //显示广告
  bindAddCredits: function() {
    let that = this;
    that.showVideoAd();
  },
  //视频广告
  showVideoAd: function() {
    let that = this;
    videoAd.load()
      .then(() => {
        //重置视频广告拉取状态
        videoAdPushStatus = false;
        videoAd.show();
      })
      .catch(err => {
        that.showToast('加载异常,请稍后重试...');
      });
  },
  addUserCredits: function() {
    let that = this;

    that.setData({
      creditsAmountSum: 10,
    });
    that.showSuccessToast('已获取积分+10');
  },
  showSuccessToast(title) {
    wx.showToast({
      title: title,
      icon: 'success',
      duration: 3000
    })
  },
  showToast(title) {
    wx.showToast({
      title: title,
      icon: 'none',
      duration: 2000
    })
  }
});

小程序体验:

 

 

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值