Appearance
后贴广告播放管理器
点击查看 ESADBehindPlayerManager API
第1步:package.json
引入库
点击查看源码
js
"@extscreen/es-component": "3.0.1",
"@extscreen/es-player": "x.x.x",
"@extscreen/es-ad-player": "x.x.x",
"@extscreen/es-ad-behind-player-manager": "x.x.x",
第2步:main-native.js
中注册组件
点击查看源码
js
import "@extscreen/es-ad-player-view/dist/index.css";
import "@extscreen/es-ad-behind-player-manager/dist/index.css";
import {ESComponent} from "@extscreen/es-component";
Vue.use(ESComponent)
第3步:ESPage
页面中中引入组件
点击查看源码
vue
<template>
<div class="es-ad-player-root-css">
<es-ad-behind-player-manager
ref="es_ad_player_manager"
class="es-ad-player-manager-css"
:ad-player-view-list="adPlayerViewList"
:ad-test-server="true"
:player-window-type="2"
:player-z-index="0"
@onPlayerPlaying="onPlayerPlaying"
@onPlayerStopped="onPlayerStopped"
@onPlayerCompleted="onPlayerCompleted"/>
</div>
</template>
<script>
import {ESADBehindPlayerManager} from "@extscreen/es-ad-behind-player-manager";
export default {
components: {
'es-ad-behind-player-manager': ESADBehindPlayerManager,
}
}
</script>
第4步:播放广告
1、广告提供者AdProvider
点击查看源码
js
import {ES_AD_TYPE_LAUNCH} from "@extscreen/es-ad-player";
export function adProvider(provideParams) {
return new Promise(function (resolve, reject) {
let result = {
adId: 'extscreen-cast',
mediaId: '222',
adType: ES_AD_TYPE_LAUNCH,
adCount: 1,
}
resolve(result);
});
}
2、注册广告提供者并且播放
点击查看源码
js
let playInfo = {
seriesIndex: 0,
seriesList: [{
id: 0,
urls: {
urlIndex: 0,
urlList: [],
},
urlsProvider: {
support: true,
provider: adProvider,
providerParams: {}
}
}]
}
this.$refs.es_ad_player_manager.playVideo(playInfo);