小程序添加激励视频广告演示代码详解

许坏

发布于 2019-07-08 19:52:41

5.8K0

文章被收录于专栏：宅机吧宅机吧

很多朋友反馈激励视频有点不好加，目前全网也没任何人写，故特记此教程。

进入小程序，选择一个号码后连续两次下拉刷新，自动会出现激励视频。

下面直接说教程

首先，先看官方文档说明

https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/ad/rewarded-video-ad.html

这里官方没有给任何dome，所以很多对js不熟悉的朋友很迷惑，但是仔细看看官方文档，其实写的很详细了，下面我直接展示我得dome

首先，在需要插入广告的页面定义一下

let rewardedVideoAd = null

然后，我们再加上激励广告设置的所有逻辑

ad_set:function(){
var that =this;
if(wx.createRewardedVideoAd) {
    rewardedVideoAd = wx.createRewardedVideoAd({ adUnitId: 'adunit-aff945372da8bd6a'})
    rewardedVideoAd.onLoad(() => {
console.log('拉取激励广告成功')
    })
    rewardedVideoAd.onError((err) => {
console.log('拉取激励广告失败')
    })
    rewardedVideoAd.onClose((res) => {
if (res && res.isEnded) {
       console.log('激励广告加载完成')
      } else {
console.log('激励广告被强制关闭')
     }
   })
  }
},

以上部分是默认的广告逻辑，我们在页面渲染时就默认加载，所以在onload中调用一下

  onLoad: function (e) {
      this.ad_set();
  },

然后接下来，就是控制广告的展示了

 ad_show:function(){
if (rewardedVideoAd){
     rewardedVideoAd.show(()=> {
      wx.showToast({
title: '看完视频就刷新哟',
icon: 'loading',
duration: 2000
      })
     });
   }
 },

最后在view视图层需要调用的地方添加冒泡事件即可

bindtap="ad_show"

整个功能实现代码既如此，其实官方写的很清楚，如果看不懂，建议多看看js相关教程。

本文参与腾讯云自媒体同步曝光计划，分享自微信公众号。

原始发表：2019-05-06，如有侵权请联系 cloudcommunity@tencent.com 删除

官方文档

小程序添加激励视频广告演示代码详解

小程序添加激励视频广告演示代码详解

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐