微信小程序激勵式視頻廣告組件使用詳解

更新時間：2019年12月06日 13:45:29 作者：行俠者

這篇文章主要介紹了微信小程序激勵式視頻廣告組件使用，本文給大家介紹的非常詳細(xì)，具有一定的參考借鑒價值,需要的朋友可以參考下

微信小程序搜索：短視頻去水印解析

目前微信小程序針對個人來說廣告是最好的變現(xiàn)方式，廣告主要分為：

1. Banner

2. 激勵式視頻

3. 插屏

Banner廣告很簡單，插入代碼就可以顯示

這里介紹下激勵式視頻廣告實現(xiàn)（觀看完整廣告獎勵積分）：

//視頻廣告
let videoAd = null;
//視頻廣告拉取狀態(tài)
let videoAdPushStatus = false;
 
Page({
 data: {
  //積分總數(shù)
  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(() => {
    //設(shè)置廣告拉取成功
    videoAdPushStatus = true;
   });
   videoAd.onClose((status) => {
    if (status && status.isEnded || status === undefined) {
     //正常播放結(jié)束,可以下發(fā)獎勵
     that.addUserCredits();
    } else {
     //不下發(fā)獎勵
     wx.showModal({
      content: '廣告未播放完成,無法獲取積分',
      showCancel: false
     })
    }
   });
   videoAd.onError(() => {
    that.showToast('獲取積分異常,請稍后重試');
   });
  }
 },
 //顯示廣告
 bindAddCredits: function() {
  let that = this;
  that.showVideoAd();
 },
 //視頻廣告
 showVideoAd: function() {
  let that = this;
  videoAd.load()
   .then(() => {
    //重置視頻廣告拉取狀態(tài)
    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
  })
 }
});

小程序體驗：