章鱼广告 SDK-快应用接入文档

快速接入

$3

在快应用项目根目录下安装广告模块，每次发布快应用前可更新包版本，新版本中广告体验更好、功能更丰富。

``bash
npm install octopus-quickapp-sdk


or


yarn add octopus-quickapp-sdk
`

$3

manifest.json文件中features属性中添加权限声明代码。

`json
"features": [
{"name": "system.sensor"},
{"name": "system.prompt"},
{"name": "system.network"},
{"name": "system.router"},
{"name": "system.fetch"},
{"name": "system.request"},
{"name": "system.device"},
{"name": "system.package"},
{"name": "system.storage"},
{"name": "system.file"},
{"name": "@system.clipboard"},
{"name": "@system.downloadtask"}
]
`

信息流广告

$3

| 属性名 | 类型 | 默认值 | 说明 |
| ------------------ | ------ | ------ | ---------------- |
| app-id | string | none | 章鱼平台应用 ID |
| ad-id | string | none | 章鱼平台广告 ID |
| donwload-panel | boolean | false | 下载类广告是否显示下载弹层 |
| width | string | none | 组件图片或视频的宽度 |
| height | string | none | 组件图片或视频的高度 |
| muted | boolean | false | 视频是否静音 |
| autoplay | boolean | true | 视频是否自动播放 |
| @loaded | string | none | 广告加载触发事件 |
| @shown | string | none | 广告展示触发事件 |
| @closed | string | none | 广告关闭触发事件 |
| @clicked | string | none | 广告点击触发事件 |
| @failed-to-load | string | none | 广告加载失败事件 |
| @empty | string | none | 广告无填充内容 |

---

$3


`js

````

插屏广告

$3

| 属性名 | 类型 | 默认值 | 说明 |
| ------------------ | ------ | ------ | ---------------- |
| app-id | string | none | 章鱼平台应用 ID |
| ad-id | string | none | 章鱼平台广告 ID |
| donwload-panel | boolean | false | 下载类广告是否显示下载弹层 |
| width | string | none | 组件图片或视频的宽度 |
| height | string | none | 组件图片或视频的高度 |
| muted | boolean | false | 视频是否静音 |
| autoplay | boolean | true | 视频是否自动播放 |
| @loaded | string | none | 广告加载触发事件 |
| @shown | string | none | 广告展示触发事件 |
| @closed | string | none | 广告关闭触发事件 |
| @clicked | string | none | 广告点击触发事件 |
| @empty | string | none | 广告无填充内容 |
| @failed-to-load | string | none | 广告加载失败事件 |

$3

`js



`

开屏广告




$3

| 属性名 | 类型 | 默认值 | 说明 |
| ------------------ | ------ | ------ | ---------------- |
| app-id | string | none | 章鱼平台应用 ID |
| ad-id | string | none | 章鱼平台广告 ID |
| donwload-panel | boolean | false | 下载类广告是否显示下载弹层 |
| width | string | none | 组件图片或视频的宽度 |
| height | string | none | 组件图片或视频的高度 |
| muted | boolean | false | 视频是否静音 |
| autoplay | boolean | true | 视频是否自动播放 |
| skiptime | string | 5 | 倒计时总时长，2-5秒 |
| @loaded | string | none | 广告加载触发事件 |
| @shown | string | none | 广告展示触发事件 |
| @closed | string | none | 广告关闭触发事件 |
| @clicked | string | none | 广告点击触发事件 |
| @empty | string | none | 广告无填充内容 |
| @failed-to-load | string | none | 广告加载失败事件 |
| @tick | string | none | 倒计时回调 |




$3

`js



`

激励视频广告

$3

| 属性名 | 类型 | 默认值 | 说明 |
| ------------------ | ------ | ------ | ---------------- |
| app-id | string | none | 章鱼平台应用 ID |
| ad-id | string | none | 章鱼平台广告 ID |
| donwload-panel | boolean | false | 下载类广告是否显示下载弹层 |
| width | string | none | 组件图片或视频的宽度 |
| height | string | none | 组件图片或视频的高度 |
| muted | boolean | false | 视频是否静音 |
| autoplay | boolean | true | 视频是否自动播放 |
| @ad-loaded | string | none | 广告加载触发事件 |
| @ad-failed-to-load | string | none | 广告加载失败事件 |
| @ad-shown | string | none | 广告展示触发事件 |
| @ad-clicked | string | none | 广告点击触发事件 |
| @ad-closed | string | none | 广告关闭触发事件 |
| @ad-clicked | string | none | 广告点击触发事件 |
| @ad-video-finished | string | none | 视频播放完毕回调 |

$3

`js



`

激励视频预加载

sdk 提供preloadVideo方法，可预加载一条激励视频广告，展示广告时优先取缓存中的广告物料，若取缓存不成功则请求线上广告。 preloadAd方法返回类型是promise，可用于判断是否加载成功。

`js
// app.ux

import { preloadVideo } from 'octopus-quickapp-sdk/utils'

export default {
preloadVideo,
onCreate() {
},
}

// 页面中调用
this.$app.$def.preloadVideo(appId, adId).then(() => {
this.$child('ad').show();
});
`

竞胜竞败回传

章鱼广告平台根据媒体传回来的竞胜竞败价格，通过相应算法自动提高出价来获得广告曝光，媒体RTB时一定要调用，否则会导致价格出不上去。

$3

`js



``