# 视频前贴广告
小程序广告流量主操作指引：[文档地址](https://wximg.qq.com/wxp/pdftool/get.html?post_id=851)  
开发者可以在 [video](/miniprogram/dev/api/wxml/NodesRef.context.md) 组件中添加属性配置，创建小程序视频前贴广告组件，视频广告组件在创建后会自动拉取广告数据，视频播放前展示广告。

## 广告样式

展示样式在开发者所设置的video组件中，以16：9的比例，垂直或者水平居中

## 广告创建

在[video](/miniprogram/dev/api/wxml/NodesRef.context.md) 组件中添加了以下广告相关的属性配置，设置`ad-unit-id`后可以展示对应广告

|属性|	类型|	默认值|	必填|	说明|
| --- | ---- | -------- |-----|---|
|ad-unit-id|string| |是|广告单元 ID，可在小程序管理后台的流量主模块新建|
|bindadload|eventhandle| |否|广告加载成功的回调|
|bindaderror|eventhandle| |否|广告加载失败的回调,返回码同[ad](/miniprogram/dev/api/ai/visionkit/VKSession.addMarker.md)组件|
|bindadclose|eventhandle| |否|广告关闭的回调|
|bindadplay|eventhandle| |否|广告开始，结束播放的回调 event.detail = {type: 'begin/end'}|

添加广告单元，绑定广告事件
```html
<video 
  class="xxx"
  src="xxx"
  bindadplay="onAdplay"
  bindadload="onAdload"
  bindadclose="onAdclose"
  bindaderror="onAdError"
  ad-unit-id="xxx"
>
</video>

```
监听广告事件
```js
Page({
  onAdplay(e) {
    console.log('onAdplay', e)
  },
  onAdload(e){
    console.log('onAdload', e)
  },
  onAdclose(e) {
    console.log('onAdclose', e)
  },
  onAdError(e) {
    console.log('onAdError', e)
  },
})
```

## 广告预加载

开发者可以调用 `wx.preloadVideoAd` 的方式进行广告的预加载

```js

const adUnitId1 = 'xxx'
const adUnitId2 = 'xxx'
wx.preloadVideoAd([adUnitId1, adUnitId2])

```

## 错误码

错误码是通过bindaderror回调获取到的错误信息，前贴广告在`普通广告组件`[ad](/miniprogram/dev/api/ai/visionkit/VKSession.addMarker.md)错误码基础上新增了以下错误码。

|代码|异常情况|解决方案|
|---|---|---|
|3001|命中频控策略|按照没有广告处理|
|3002|命中频控策略|按照没有广告处理|
|3003|命中频控策略|按照没有广告处理|
|3004|命中频控策略|按照没有广告处理|

## 注意事项
1、支持视频预加载能力：[文档地址](https://wximg.qq.com/wxp/pdftool/get.html?post_id=1698)。

2、仅支持同层渲染模式下的video组件。

3、开发者可监听bindadplay事件获取广告播放状态，做出相应处理。

4、ad-unit-id不支持异步设置，只支持设置在 wxml 或者 JS 文件的`data`属性里，通过`setData`设置的无效。

5、全屏模式下不展示视频前贴广告。