stat_ads.md
19.2 KB
903847c20766edafc0e4275ed852bc9f73b8adc5/inner/stat_ads.md#">交叉推广位
903847c20766edafc0e4275ed852bc9f73b8adc5/inner/stat_ads.md#">简介
交叉推广位是在游戏中展示其他游戏，用户点击某个游戏跳转进入游戏，达到共享用户的目的。
噗嗤游戏提供了3种类型的交叉推广位，后台可对交叉推广位进行配置管理，对交叉推广位各项指标分析阅览。
3种广告类型：交叉悬浮广告框、交叉抽屉式广告位、交叉猜你喜欢广告位
- 交叉悬浮广告框，放置到首页、结算页
- 交叉抽屉式广告位，放置到首页、结算页
- 交叉猜你喜欢广告位，推荐放置到结算页
903847c20766edafc0e4275ed852bc9f73b8adc5/inner/stat_ads.md#">后台使用
完成接入交叉推广位后，登录后台->头部tab切换到【游戏数据】->【流量分析】->【广告导出】即可查看推广位的各项数据信息（需要后台管理人员添加权限）：
903847c20766edafc0e4275ed852bc9f73b8adc5/inner/stat_ads.md#">接入必读
由于微信对每个游戏可跳转其他游戏有10个限制，可跳转的其它游戏需要在小游戏根目录下的全局配置文件game.json中进行添加配置：navigateToMiniProgramAppIdList，该参数定义请详读小程序全局配置。
噗嗤游戏为了方便开发者接入调试交叉推广位，【后台测试服】已经配置测试使用的不同类型推广位，并提供以下10个测试服广告位appid：
水果爆破 ："wx26822126b4d99eda",
球球涂涂涂："wxac0750884d5bed0c",
狂野漂移3D："wx019a09df638e6683",
星星爱消消："wx9ff47d13a88e5511",
土耳其方块消消乐："wx89efb2282d65a2d0",
成语小才子："wxd4d478c7d331ce80",
球球蹦蹦蹦："wxabee9afe62d0b114",
俄罗斯方块连连消："wx4cd087f19f4cb7c3",
球球爆爆爆："wxae33d68413f40641",
疯狂水果一刀切："wxdf26a04c53d6f1e9"
"navigateToMiniProgramAppIdList": [
"wx26822126b4d99eda",
"wxac0750884d5bed0c",
"wx019a09df638e6683",
"wx9ff47d13a88e5511",
"wx89efb2282d65a2d0",
"wxd4d478c7d331ce80",
"wxabee9afe62d0b114",
"wx4cd087f19f4cb7c3",
"wxae33d68413f40641",
"wxdf26a04c53d6f1e9"
]
- 完成下面的操作步骤，即可拉取交叉推广位：
1、开发者复制上面的10个其他游戏的appid，配置到game.json的navigateToMiniProgramAppIdList参数：
2、修改config.js的Env配置为110，开发者测试联调阶段，走测试环境
提示：广告位接入完毕测试通过，提交审核前，修改Env为100。
接入API：
| 名称 | 功能说明 |
|---|---|
| PCSDK.stat.bannerList | 根据类型获取对应类型交叉广告列表，目前SDK支持3种类型：40（交叉悬浮广告框）、70（交叉抽屉式广告位）、50（交叉猜你喜欢广告位） |
| PCSDK.stat.bannerNavigateTo | 交叉推广位点击跳转到对应appid的游戏，该接口封装了小游戏的跳转功能（navigateToMiniProgram） |
| PCSDK.stat.addExposure | 交叉推广位一条或者多条广告展示，添加曝光数据，SDK在onHide时候上报数据到后台 |
- ##### bannerList
PCSDK.stat.loadingFinish(banner_type): Promise<any>
定义：根据类型获取对应类型交叉广告列表，目前SDK支持3种类型
参数：
banner_type: number 必填 目前支持三种广告类型：40、50、70
返回值：Promise
返回的是Promise类型，Promise resolve成功回调数据结构为：
{
"banner_list": [
{
"banner_id": "3568",
"banner_name": "土耳其方块",
"banner_type": "40",
"banner_location": "100",
"banner_ad_id": "50",
"banner_launch_appid": "",
"banner_launch_path": "",
"banner_appid": "wx89efb2282d65a2d0",
"banner_path": "?channel_id=20361",
"banner_icon": "https://dep.miso-lab.com/data_analysis/games/res/5D42CB97RK.png",
"banner_user_num": "0",
"banner_exposure_num": "0",
"banner_sort": "1",
"banner_game_id": "1000053",
"banner_qqgame": "0",
"banner_qqgame_id": "0",
"banner_game_type": 0,
"banner_bone": "0",
"banner_system": "0",
"banner_online": "1",
"banner_reddot": "0",
"banner_gender": "0",
"banner_resident": "0",
"banner_qrcode": "0",
"banner_qrcode_img": "",
"banner_bone_info": false,
"banner_img_info": {
"banner_icon": "https://dep.miso-lab.com/data_analysis/games/res/5D42CB97RK.png"
}
},
{
"banner_id": "3571",
"banner_name": "水果一刀切",
"banner_type": "40",
"banner_location": "100",
"banner_ad_id": "99",
"banner_launch_appid": "",
"banner_launch_path": "",
"banner_appid": "wxdf26a04c53d6f1e9",
"banner_path": "?channel_id=20361",
"banner_icon": "https://dep.miso-lab.com/data_analysis/games/res/5D42CBACTt.png",
"banner_user_num": "0",
"banner_exposure_num": "0",
"banner_sort": "1",
"banner_game_id": "1000053",
"banner_qqgame": "0",
"banner_qqgame_id": "0",
"banner_game_type": 0,
"banner_bone": "0",
"banner_system": "0",
"banner_online": "1",
"banner_reddot": "0",
"banner_gender": "0",
"banner_resident": "0",
"banner_qrcode": "0",
"banner_qrcode_img": "",
"banner_bone_info": false,
"banner_img_info": {
"banner_icon": "https://dep.miso-lab.com/data_analysis/games/res/5D42CBACTt.png"
}
}
]
}
返回的数据banner_list列表解析为 Array，BannerData是banner_list每一项数据实体，下面的bannerNavigateTo与addExposure接口api参数banner_data属于此BannerData结构。
示例：
/**
* 演示交叉推广位使用示例
*/
export default class TestBannerSample {
constructor() {
// 示例：加载交叉悬浮广告框
this.loadBannerList(BannerType.TYPE_CROSS)
.then((dataList: Array<BannerData>) => {
// 渲染广告位数据
this.renderAdCrossList(dataList);
}).catch(err => {
// bannerList不存在获取请求拉取失败
});
}
/**
* 渲染广告位列表
* @param dataList 广告位列表
*/
private renderAdCrossList(dataList: Array<BannerData>) {
// ...
}
/**
* 根据类型获取交叉推广位列表
* @param banner_type 广告位类型
*/
private loadBannerList(banner_type: BannerType): Promise<any> {
return new Promise((resolve, reject) => {
PCSDK.stat.bannerList(banner_type)
.then(data => {
let bannerList: Array<BannerData> = data.banner_list || [];
if (bannerList.length) {
// 处理bannerList数据列表
resolve(bannerList);
} else {
// 处理数据为空情况
reject(null);
}
}).catch(err => {
// 请求接口报错情况
reject(err);
});
});
}
}
// 广告位类型的枚举
enum BannerType {
TYPE_CROSS = 40, // 交叉悬浮广告框
TYPE_LIKE = 50, // 交叉猜你喜欢广告位
TYPE_LIST = 70, // 交叉抽屉广告位
}
/*
* banner数据实体结构
*/
class BannerData {
public banner_id: string;
public banner_appid: string;
public banner_diamond: number;
public banner_type: string;
public banner_icon: string;
public banner_name: string;
public banner_resident: string; // 是否常驻
}
- ##### bannerNavigateTo
PCSDK.stat.bannerNavigateTo( location:number, banner_data: any, opts?: { extraData?: string; envVersion?: string }): Promise<any>
定义：交叉推广位点击游戏跳转到对应appid的游戏，该接口封装了小游戏的跳转功能（navigateToMiniProgram）, 第三个参数配置可参考wx.navigateToMiniProgram extraData、envVersion配置信息
参数：
location: number 必传，统一传递为：100
banner_data：any 必传，点击跳转项对应数据，该数据的结构为BannerData，为bannerList获取的Array<BannerData>的单元实体项
opts: object 选传，调试阶段可参照[wx.navigateToMiniProgram(Object object) extraData配置信息]进行裴旭
{
extraData: string 选传, 需要传递给目标小程序的数据，目标小程序可在 App.onLaunch，App.onShow 中获取到这份数据
envVersion: string 选传，要打开的小程序版本，合法值：develop、trial、release
}
示例：获取猜你喜欢推广位，以列表的形式显示在界面上，点击任意一项游戏跳转其他游戏
// 发起登录请求，得到登录数据信息，调用setLogind设置SDK用户信息
/**
* 演示交叉推广位使用示例
*/
export default class TestBannerSample extends ui.shop.ShopPopwinUI {
private list: Laya.List;
constructor() {
super();
// 创建List ui
this.list = new Laya.List();
this.list.itemRender = AdItem;
this.list.vScrollBarSkin = "";
this.list.scrollBar.elasticBackTime = 500;
this.list.scrollBar.elasticDistance = 350;
this.list.x = 0;
this.list.y = 0;
this.list.spaceY = 10;
this.list.height = 1000;
this.list.renderHandler = new Laya.Handler(this, this.renderAdItem);
this.boxList.addChild(this.list);
// 示例：加载猜你喜欢广告位数据列表
this.loadBannerList(BannerType.TYPE_LIKE)
.then((dataList: Array<BannerData>) => {
this.renderAdLikeList(dataList);
}).catch(err => {
// bannerList不存在获取请求拉取失败
});
}
/**
* 渲染单个广告位ui
* @param cell
*/
private renderAdItem(cell: AdItem) {
cell.init();
}
/**
* 渲染广告位列表
* @param dataList 广告位列表
*/
private renderAdLikeList(dataList: Array<BannerData>) {
this.list.array = dataList;
}
/**
* 根据类型获取交叉推广位列表
* @param banner_type 广告位类型
*/
private loadBannerList(banner_type: BannerType): Promise<any> {
return new Promise((resolve, reject) => {
PCSDK.stat.bannerList(banner_type)
.then(data => {
let bannerList: Array<BannerData> = data.banner_list || [];
if (bannerList.length) {
// 处理bannerList数据列表
resolve(bannerList);
} else {
// 处理数据为空情况
reject(null);
}
}).catch(err => {
// 请求接口报错情况
reject(err);
});
});
}
}
class AdItem extends ui.ads.GameIconUI {
constructor() {
super();
this.on(Laya.Event.CLICK, this, this.onJumpGame);
}
init() {
let { banner_icon, banner_name, banner_reddot } = this.dataSource;
this.iconTex.skin = banner_icon;
this.nametxt.text = banner_name;
this.hot.visible = banner_reddot + '' === '1';
}
private onJumpGame(ev: Laya.Event) {
PCSDK.stat.bannerNavigateTo(100, { ...this.dataSource }).catch(err => {
// 跳转游戏微信弹出二次确认框，点击取消执行此处
});
}
}
// 广告位类型的枚举
enum BannerType {
TYPE_CROSS = 40, // 交叉悬浮广告框
TYPE_LIKE = 50, // 交叉猜你喜欢广告位
TYPE_LIST = 70, // 交叉抽屉广告位
}
/*
* banner数据实体结构
*/
class BannerData {
public banner_id: string;
public banner_appid: string;
public banner_diamond: number;
public banner_type: string;
public banner_icon: string;
public banner_name: string;
public banner_resident: string; // 是否常驻
}
- ##### addExposure
PCSDK.stat.addExposure( location: number, banner_data: Array< any > | any ): void
定义：对一个或者多个展示的推广位添加曝光，SDK在onHide时候上报曝光数据到后台，后台进行统计查阅
参数：
location: number 必传，统一传递为：100
banner_data：any 必传，添加展推广位曝光数据，可添加一个或者多个曝光数据，banner_data参数数据结构为上面bannerList api返回的列表数据的项BannerData实体结构：Array<BannerData> | BannerData
提示：
展示猜你喜欢/抽屉推广位：获取到9个推广位数据，展示了其中5个，调用曝光接口传入推广位数据为展示的5个，剩余的4个需在其展示的时候再调用曝光api接口传入。
展示交叉悬浮框推广位：展示一个，将此推广位传入曝光接口，点击展示下一个，则把这个最新的数据传入曝光api
示例：根据交叉悬浮框类型调用PCSDK.stat.bannnerList接口获取交叉悬浮框推广位列表，显示第一个，每隔4秒切换到下一个，点击一个切换下一个展示。此示例没有使用定时器方式，采用的是监听动画帧实现。
/**
* 演示交叉推广位使用示例
*/
export default class TestBannerSample extends ui.ads.ADbtnUI {
private data;
private count: number;
private adList: Array<BannerData>;
constructor() {
super();
this.count = 0;
this.adList = [];
this.on(Laya.Event.CLICK, this, this.onJumpGame);
}
// 初始化显示交叉悬浮框广告位
init(isFirst: boolean) {
isFirst && (this.count = 0);
this.anim_entice.play(0, true);
this.anim_entice.addLabel('refresh', 38);
// 交叉悬浮框动画执行到第38帧，自动更新下一个，开发者可根据实际使用定时器实现切换下一个
this.anim_entice.on(Laya.Event.LABEL, this, this.handleAutoRrefresh);
// 第一次
this.refresh();
}
// 清理交叉悬浮框广告位
clear() {
this.anim_entice.gotoAndStop(0);
this.anim_entice.removeLabel('refresh');
this.anim_entice.off(Laya.Event.LABEL, this, this.handleAutoRrefresh);
}
private refresh() {
let list = this.adList;
if (!list || !list.length) {
this.loadBannerList(BannerType.TYPE_CROSS).then(() => this.refresh());
return;
}
let data = list.pop();
this.renderAdui(data);
this.data = data;
// 添加曝光数据
PCSDK.stat.addExposure(100, data);
// 也可以采用传递多个方式
// PCSDK.stat.addExposure(100, [{...data}]);
}
private renderAdui(data) {
let { banner_bone_info, banner_img_info } = data;
if (banner_bone_info) {
this.imgIcon.visible = false;
} else {
this.imgIcon.visible = true;
this.imgIcon.skin = banner_img_info.banner_icon;
}
this.imgHot.visible = data.banner_reddot + '' === '1';
}
private onJumpGame(ev: Laya.Event) {
this.anim_entice.gotoAndStop(39);
this.anim_entice.play(39, true);
// 切换下一个
this.refresh();
PCSDK.stat.bannerNavigateTo(100, { ...this.data }).catch(err => {
// 跳转游戏微信弹出二次确认框，点击取消执行此处
});
}
/**
* 处理自动切换下一个
* @param name
*/
private handleAutoRrefresh(name) {
if (name === 'refresh' && this.count !== 0) {
this.refresh();
}
this.count++;
}
/**
* 根据类型获取交叉推广位列表
* @param banner_type 广告位类型
*/
private loadBannerList(banner_type: BannerType): Promise<any> {
return new Promise((resolve, reject) => {
PCSDK.stat.bannerList(banner_type)
.then(data => {
let bannerList: Array<BannerData> = data.banner_list || [];
if (bannerList.length) {
// 处理bannerList数据列表
resolve(bannerList);
} else {
// 处理数据为空情况
reject(null);
}
}).catch(err => {
// 请求接口报错情况
reject(err);
});
});
}
}
// 广告位类型的枚举
enum BannerType {
TYPE_CROSS = 40, // 交叉悬浮广告框
TYPE_LIKE = 50, // 交叉猜你喜欢广告位
TYPE_LIST = 70, // 交叉抽屉广告位
}