微量小程序联盟SDK接入流程(标准版)

微量小程序联盟官网:www.51weiliang.com

在接入之前,请确认您的小程序已在微量小程序联盟后台添加成功。

一、准备工作
1、在官网下载SDK包,或点此下载最新SDK包。
2、进入微信公众号平台|小程序后台,点击页面左侧的“开发”,进入“开发设置”,在服务器域名设置项中添加request合法域名
https://log.51weiliang.com

二、SDK接入小程序
1、引入js文件:将解压后的utils文件夹中wlad_sdk.js和wlad_conf.js放入小程序utils文件夹中,若没有utils请创建。
2、引入广告组件:将components文件夹中wlAD文件夹放入小程序components文件夹中,若没有components请创建。
引入完成后目录结构如下:

三、基本配置
1、配置wlad_conf.js文件:
进入微量小程序联盟后台,依次点击“我的小程序”、“小程序列表”菜单,找到您添加的将要接入SDK的小程序,将APPKey填入到wlad_conf.js中的app_key中即可。
exports.app_key = “xxxx”; //如下图所示,小程序列表页面获取到的APPKey
exports.plugin = false;//若您的小程序中使用了插件,请参考支持插件版的接入文档

2、在根目录下app.js文件首行引入sdk代码
const wlad = require(’./utils/wlad_sdk.min.js’);

四、接入广告
目前有插屏广告、banner广告、悬浮广告三种展示形式,用微信扫下方小程序码即可体验。

假设您要接入的页面为/pages/index/index.wxml
1、在index.wxml同级目录下的index.json中引入wl-ad组件:
{
“usingComponents”: {
“wl-ad”: “/components/wlAD/wlAD”
}
}
2、在index.wxml同级目录下的index.js中Page参数对象的data节点中配置广告数据变量
Page({
data: {
wlad: {
adData: {},
ad: {
banner: [“banner”], //是否展示banner广告,如不需展示删掉该字段即可
insert: “insert”, //是否展示插屏广告,如不需展示删掉该字段即可
fixed: “fixed” //是否展示右下角悬浮广告,如不需展示删掉该字段即可
}
}

// 您的其他数据

}

//您的其他方法
});

3、在index.wxml中按需引入对应类型广告




4、单页展示多banner广告(可选)
index.js需修改为

index.wxml修改为

5、通过调用接口获取要展示广告的数据来自定义展示(可选)
调用方式:
app.wlad.getAds(num,callback)
let app = getApp(); //获取app对象
app.wlad.getAds(3,function (res) { //第一个参数为获取广告条数,第二个参数为获取成功后回调方法
console.log(res);
})
回调参数对象格式如下
{
“code”: 0,
“data”: [
{
“appid”: “wxe369801ba197a6c8”,
“desc”: “免费做活动,免费领奖品,先奖一个亿!”,
“img”: “https://wllm.oss-cn-beijing.aliyuncs.com/trackposter/wxe369801ba197a6c8/50c1a15.jpg”,
“logo”: “https://wllm.oss-cn-beijing.aliyuncs.com/logoa/wxe369801ba197a6c8.png”,
“name”: “测试号2”
},
{
“appid”: “wxec9471079f8b6c27”,
“desc”: “免费抽大奖,免费领奖品,再奖一个亿!",
“img”: “https://wllm.oss-cn-beijing.aliyuncs.com/trackposter/wxec9471079f8b6c27/75428.jpg”,
“logo”: “https://wllm.oss-cn-beijing.aliyuncs.com/logoa/wxec9471079f8b6c27.png”,
“name”: “测试号1”
}
]
}
字段含义

五、接入后检测
按照上述步骤接入SDK后,在微信小程序开发工具的控制台下观察有没有关于微量SDK的报错信息,如果没有,则说明接入成功。
接入成功后请登录微量小程序后台,点击左侧菜单“我的小程序”,进入“小程序列表”页面,找到刚接入SDK的小程序,如果状态是“待完成SDK测试”,点击右侧的“接入和测试SDK选项”,按提示操作即可。

遇到问题
如果没有显示广告或者后台数据展示不正常,请检查一遍接入流程,确保没有漏掉其中步骤。
如果检查接入没问题还是没有广告,请截图控制台console和网络请求network反馈给工作人员。

联系方式
微信:weiliang3721,电话:18301656915,公众号:wllm51,官网:www.51weiliang.com

猜你喜欢

转载自blog.csdn.net/w364483790/article/details/86500989
今日推荐