uniapp中对接开发激励广告视频

官网地址:激励视频广告 | uni-app官网

我开发的app激励视频广告使用的是api的方式生成激励视频

核心语法

官方示例代码

复制代码
rewardedVideoAd.onLoad(() => {
  console.log('激励视频 广告加载成功')
})

rewardedVideoAd.show()
.then(() => console.log('激励视频 广告显示'))

app要传的是adpid,在hbulider广告联盟后台创建自己的adpid,

微信小程序要传的是adUnitId,在微信小程序的广告主后台获取这个值

复制代码
	showCustomAd(redPacket) {
				if (this.isVideoPlaying || !this.isPageAlive) {
					this.showToast("视频播放中,请稍候");
					return;
				}
				const that = this;
				const {
					adpid
				} = this.base.groupConfig;

				that.resetAdData();
				that.isVideoPlaying = true;

				uni.showLoading({
					title: "加载中...",
					mask: true
				});

				const orderNo = that.generateOrderNo();

				let adInstance = null;

              //生成app的激励视频
				//#ifdef APP-PLUS
				adInstance = uni.createRewardedVideoAd({
					adpid: adpid,
					urlCallback: {
						userId: uni.getStorageSync('userInfo').uid || '',
						extra: JSON.stringify({
							type: 2,
							no: orderNo,
							box: redPacket.source === "treasureChest" ? 1 : ''
						})
					}
				});
				//#endif


                //生成微信小程序的激励视频
				//#ifdef MP-WEIXIN
				adInstance = uni.createRewardedVideoAd({
					adUnitId: adpid,
				});
				//#endif

				that.ad.instance = adInstance;
				that.ad.currentRedPacket = redPacket; //红包
				that.ad.orderNo = orderNo; //提交订单号去后台

				adInstance.onLoad(() => {
					uni.hideLoading();
					setTimeout(() => {
						adInstance.show()
					}, 200)

				});

				adInstance.onError((err) => {
					uni.hideLoading();
					that.isVideoPlaying = false;
					that.cleanupAdInstance();
				});

				adInstance.onClose((res) => {
					uni.hideLoading();
					that.isVideoPlaying = false;
					if (res && res.isEnded) {
						that.handleVideoFinish(that.ad.currentRedPacket, that.ad.orderNo);
					} else {
						that.showToast("中途退出,领取失败");
					}

					//#ifdef APP-PLUS
					// 清理广告实例
					that.cleanupAdInstance();
					//#endif
				});

				//#ifdef MP-WEIXIN
				adInstance.show().catch(err => {
					adInstance.load().then(() => {
						return adInstance.show();
					}).catch(err2 => {
						uni.hideLoading();
						that.isVideoPlaying = false;
					});
				});
				//#endif
			},

提示:在正式开始之前,一定要多去看看官方文档,看看他们的写法和api的用法, 不要直接上手就去写,很浪费时间,而且用法不对,还会一直报错!多看文档多看文档!!!!

相关推荐
宠友信息11 小时前
一套基于uniapp+springboot完整社区系统是如何实现的?友猫社区源码级功能解析
java·spring boot·后端·微服务·微信·uni-app
碎像20 小时前
掌握uniapp发布微信小程序、App(Android)
微信小程序·小程序·uni-app
stpzhf20 小时前
uniapp nvue组件多个text在一行并且高亮其中一些文字
前端·javascript·uni-app
qq_3168377520 小时前
制作uniapp原生插件 在本地离线打包中测试 集成在云打包中
uni-app
Fate_I_C2 天前
uniappx 鸿蒙运行包制作失败
华为·uni-app·uniapp·harmonyos
chQHk57BN2 天前
跨平台前端开发:用Flutter和UniApp一次编写多端运行
flutter·uni-app
自然 醒2 天前
uni-app开发微信小程序,如何使用towxml去渲染md格式和html标签格式的内容?
微信小程序·uni-app·html
CHB2 天前
uni-agent,你的数字员工来了
人工智能·uni-app·vibecoding
h_jQuery2 天前
uniapp使用canvas实现逐字书写任意文字内容,后合成一张图片提交
前端·javascript·uni-app
困困的果果头2 天前
【uniapp】解决H5嵌套在web-view中时打包页面与状态栏重叠
前端·uni-app