uniapp可以加字节跳动、微信、百度等平台的广告代码,广告标签就直接用每个平台的,uniapp会自动处理,不用管。当时我也就是不知道,找了一遍文档才发现只要照着每个平台的开发文档加广告代码标签就行了。

但 js 的会稍微不同,下面我就以抖音的激励广告和 banner广告 示例来分享

激励广告

直接上代码

<script>
	
	var videoAd = null;
	export default {

		data() {
			return {
				show_result: false,
				page_id: '',
				end: false,
				is_douyin: false
			}
		},
		
		onLoad: function (option) {
			this.isLoad = true
			tt.getSystemInfo(
			    {
					success: (res) =>  {
						if (res.appName === 'Douyin') {this.is_douyin = true}
					}
				}
			)
		},
        methods: {
			adLoad: function() {
			    if (tt.createRewardedVideoAd) {
			        videoAd = tt.createRewardedVideoAd({
			            adUnitId: "xxx"
			        })
					videoAd.show()
					videoAd.onLoad((status) => {
						if (!this.result) {
							this.getResult()
						}
					})
			        videoAd.onError(err => {})
			        videoAd.onClose((status) => {
						if (status && status.isEnded || status === undefined) {
							this.end = false
						} else {
							this.end = true
						}
			        })
			    }
			},
	    }
    }
</script>

记住,videoAd一定不能预加载,一定要在逻辑上结束时,调用 adLoad()来展示,要不然很难通过审核。

Banner广告

这个比较简单,根据上述代码,已经判断了小程序宿主 is_douyin,然后加下面的标签代码


		<view v-else-if="!is_douyin && end" style="margin-top: 10px;">
			
			<ad
				unit-id="xxx"
				type="banner"
				bindload="adloadhandler"
				binderror="aderrorhandler"
				bindclose="adclosehandler"
			></ad>
		</view>

下面是我做好的,大家可以对比下我的效果(用手机抖音app扫描)我的是测试玩后要看结果的时候才展示,这样才对用户友好。

 

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐