5+API，AD广告组件

最新推荐文章于 2023-03-24 12:23:46 发布

sunly_

最新推荐文章于 2023-03-24 12:23:46 发布

阅读量750

点赞数 1

分类专栏： 5+API

本文链接：https://blog.csdn.net/qq_40745143/article/details/117929301

版权

5+API 专栏收录该内容

14 篇文章 1 订阅

订阅专栏

这篇博客详细介绍了如何在APP启动时创建并调用全屏视频广告、插屏广告以及激励视频广告的代码实现。通过`onLoad()`函数，分别加载并展示不同类型的广告，同时处理广告加载成功、失败和关闭的各种情况，确保用户体验的顺畅。在广告加载失败或播放完成后，会进行相应的页面跳转。

摘要由CSDN通过智能技术生成

创建全屏视频广告，，APP启动后在第一个页面调用onLoad中的代码

onLoad(){
	if(window.plus != undefined){
		// console.log('5+APP打开，走这里')
		let _this = this;
		var adFull = null;
		function fullVideoAd() {
			if (adFull) {
				console.log('正在加载全屏视频广告');
				return;
			}
			console.log('#全屏视频广告#');
			adFull = plus.ad.createFullScreenVideoAd({
				adpid: '1507000611'
			}); //1507000611是HBuilder测试基座使用的广告位，正式环境下请使用在uni-AD后台申请的
			adFull.onLoad(function() {
				console.log('加载成功')
				adFull.show();
			});
			adFull.onError(function(e) {
				console.log('加载失败: ' + JSON.stringify(e));
				adFull.destroy();
				adFull = null;
				_this.$goBack(4,'/pages/video/index')
			});
			adFull.onClose(function(e) {
				if (e.isEnded) {
					console.log('全屏视频播放完成');
					plus.nativeUI.toast('全屏视频播放完成');
					_this.$goBack(4,'/pages/video/index')
					//这里实现完成全屏视频逻辑
				} else {
					console.log('全屏视频未播放完成关闭!')
					_this.$goBack(4,'/pages/video/index')
				}
				adFull.destroy();
				adFull = null;
			});
			adFull.load();
		}
		fullVideoAd()
	}else{
		this.$goBack(4,'/pages/video/index')
	}
}

效果图如下：
在这里插入图片描述

创建：插屏广告

onLoad(){
	var adInter = null;
	//插屏广告
	function fullVideoAd() {
		if (adInter) {
			console.log('正在加载插屏广告');
			return;
		}
		console.log('#插屏广告#');
		adInter = plus.ad.createInterstitialAd({
			adpid: '1111111113'
		}); //1111111113是HBuilder测试基座使用的广告位，正式环境下请使用在uni-AD后台申请的广告位
		adInter.onLoad(function() {
			console.log('加载成功')
			adInter.show();
		});
		adInter.onError(function(e) {
			console.log('加载失败: ' + JSON.stringify(e));
			adInter.destroy();
			adInter = null;
		});
		adInter.onClose(function(e) {
			console.log('插屏广告被关闭');
			adInter.destroy();
			adInter = null;
		});
		adInter.load();
	}
	fullVideoAd();
}

效果如下图，插屏广告
在这里插入图片描述

创建：激励视频广告

//激励视频广告
onLoad() {
	//激励视频广告
	if(window.plus != undefined){
		// console.log('5+APP打开，走这里')
		let _this = this;
		var adReward = null;
		function rewardedVideoAd() {
			if (adReward) {
				console.log('正在加载激励视频广告');
				return;
			}
			console.log('#视频激励广告#');
			adReward = plus.ad.createRewardedVideoAd({
				adpid: '1507000689'
			});
			adReward.onLoad(function() {
				console.log('加载成功')
				adReward.show();
			});
			adReward.onError(function(e) {
				console.log('加载失败: ' + JSON.stringify(e));
				adReward.destroy();
				adReward = null;
			});
			adReward.onClose(function(e) {
				if (e.isEnded) {
					console.log('激励视频播放完成');
					plus.nativeUI.toast('激励视频播放完成');
					//这里实现完成激励视频逻辑
					_this.$goBack(4,'/pages/video/index')
				} else {
					console.log('激励视频未播放完成关闭!')
					_this.$goBack(4,'/pages/video/index')
				}
				adReward.destroy();
				adReward = null;
			});
			adReward.load();
		}
		rewardedVideoAd()
	}else{
		// console.log('网页中打开页面走这里')
		this.$goBack(4,'/pages/video/index')
	}
},