Adsense 游戏广告 (AFG) 接入


Adsense 游戏广告 (AFG) 接入

  • html中要有放置广告的div
1
2
<div id="GameDiv">
</div>
  • 广告类

初步代码,还可以优化为预加载广告,等需要时再播放广告

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
let AdSense = cc.Class({

properties: {
preloadedRewardedVideoCallbackObj: null,
adsManager: null,
adsLoader: null,
adDisplayContainer: null,
intervalTimer: null,
adTagUrl: null,
linearAdSlotWidth:Number,
linearAdSlotHeight:Number,
nonLinearAdSlotWidth:Number,
nonLinearAdSlotHeight:Number,
advertiseDiv: null,
videoContent: null,
adContainerDiv: null,
},

init() {
window['googletag'] = window['googletag']|| {};
let googletag = window['googletag'];
googletag.cmd = googletag.cmd || [];

(function() {
let gads = document.createElement('script');
gads.type = 'text/javascript';
gads.src = 'https://s0.2mdn.net/instream/html5/ima3.js';//'https://imasdk.googleapis.com/js/sdkloader/ima3.js'
let node = document.getElementsByTagName('script')[0];
node.parentNode.insertBefore(gads, node);
})();

this.advertiseDiv = document.getElementById('advertise');
if (this.advertiseDiv == null) {
this.advertiseDiv = document.createElement('div');
this.advertiseDiv.id = 'advertise';
this.advertiseDiv.style.border = '0';
this.advertiseDiv.style.position = 'absolute';
this.advertiseDiv.style.left = '0';
this.advertiseDiv.style.right = '0';
this.advertiseDiv.style.top = '0';
this.advertiseDiv.style.bottom = '0';
this.advertiseDiv.style.visibility = 'hidden';

let gameDiv = document.getElementById('GameDiv');//GameDiv content
gameDiv.appendChild(this.advertiseDiv);
}

this.videoContent = document.createElement('video');

let contentDiv = document.createElement('div');
contentDiv.id = 'contentDiv';
contentDiv.appendChild(this.videoContent);

this.adContainerDiv = document.createElement('div');
this.adContainerDiv.id = 'adContainerDiv';
this.adContainerDiv.style.position = 'absolute';
this.adContainerDiv.style.left = '0px';
this.adContainerDiv.style.top = '0px';

this.advertiseDiv.appendChild(contentDiv);
this.advertiseDiv.appendChild(this.adContainerDiv);
},

/**
* 显示adsense
* @param type 1 banner;2 插屏;3 激励视频
*/
show(type, obj) {
let size = cc.view.getFrameSize();
let width = size.width;
let height = size.height;
switch(type){
case 1:
this.adTagUrl = game.setting.adsense.text;
height = 64;
break;
case 2:
this.adTagUrl = game.setting.adsense.image;
break;
case 3:
this.adTagUrl = game.setting.adsense.video;
this.preloadedRewardedVideoCallbackObj = obj;
break;
}

this.linearAdSlotWidth = width;
this.linearAdSlotHeight = height;
this.nonLinearAdSlotWidth = width;
this.nonLinearAdSlotHeight = height;

this.scheduleTimer = setInterval(() => {
if (window['google'])
{
clearInterval(this.scheduleTimer);

// 开始提出广告请求
this.requestAds();
}
}, 1000);
},
requestAds() {
// 创建广告显示容器。
// 我们假设 adContainer 是
// 将要容纳广告的元素的 DOM ID。
this.adContainerDiv.innerHTML = '';
this.adDisplayContainer =
new google.ima.AdDisplayContainer(this.adContainerDiv);

// 如果 requestAds 在用户操作过程中调用,则初始化容器。
// 仅在 iOS/Android 设备上需要此操作。
this.adDisplayContainer.initialize();
// 创建广告加载器。
this.adsLoader = new google.ima.AdsLoader(this.adDisplayContainer);
// 监听并响应已加载的广告和错误事件。
this.adsLoader.addEventListener(
google.ima.AdsManagerLoadedEvent.Type.ADS_MANAGER_LOADED,
this.onAdsManagerLoaded.bind(this),
false);
this.adsLoader.addEventListener(
google.ima.AdErrorEvent.Type.AD_ERROR,
this.onAdError.bind(this),
false);

// 提出视频广告请求。
let adsRequest = new google.ima.AdsRequest();
adsRequest.adTagUrl = this.adTagUrl;

// 指定线性和非线性广告位的尺寸。如果返回多个广告,这有助于 SDK
// 选择正确的广告。
adsRequest.linearAdSlotWidth = this.linearAdSlotWidth;
adsRequest.linearAdSlotHeight = this.linearAdSlotHeight;

adsRequest.nonLinearAdSlotWidth = this.nonLinearAdSlotWidth;
adsRequest.nonLinearAdSlotHeight = this.nonLinearAdSlotHeight;

// 强制使图片/文字广告以全幅界面展示
//adsRequest.forceNonLinearFullSlot = true;

this.adsLoader.requestAds(adsRequest);
},
onAdsManagerLoaded(adsManagerLoadedEvent) {
// 获取广告管理器。
this.adsManager = adsManagerLoadedEvent.getAdsManager(
this.videoContent); // 应被设置为内容视频元素

// 为所需事件添加监听器。
this.adsManager.addEventListener(
google.ima.AdErrorEvent.Type.AD_ERROR,
this.onAdError.bind(this));
this.adsManager.addEventListener(
google.ima.AdEvent.Type.CONTENT_PAUSE_REQUESTED,
this.onContentPauseRequested.bind(this));
this.adsManager.addEventListener(
google.ima.AdEvent.Type.CONTENT_RESUME_REQUESTED,
this.onContentResumeRequested.bind(this));
this.adsManager.addEventListener(
google.ima.AdEvent.Type.ALL_ADS_COMPLETED,
this.onAdEvent.bind(this));

// 如有必要,请监听其他任何事件。
this.adsManager.addEventListener(
google.ima.AdEvent.Type.LOADED,
this.onAdEvent.bind(this));
this.adsManager.addEventListener(
google.ima.AdEvent.Type.STARTED,
this.onAdEvent.bind(this));
this.adsManager.addEventListener(
google.ima.AdEvent.Type.COMPLETE,
this.onAdEvent.bind(this));

try {
// 初始化广告管理器。广告规则播放列表将在此时开始。
this.adsManager.init(this.linearAdSlotWidth, this.linearAdSlotHeight, google.ima.ViewMode.NORMAL);
// 调用播放以开始展示广告。单个视频和重叠式广告将
// 在此时开始;广告规则将忽略此调用。
this.adsManager.start();
} catch (adError) {
// 如果 VAST 响应存在问题,可能会引发错误。
}
},
onAdEvent(adEvent) {
// 从事件检索广告。有些事件(例如 ALL_ADS_COMPLETED)
// 没有相关联的广告对象。
let ad = adEvent.getAd();
switch (adEvent.type) {
case google.ima.AdEvent.Type.LOADED:
// 这是为广告发送的第一个事件 - 可以
// 确定该广告是视频广告还是重叠式广告。
if (!ad.isLinear()) {
// 准确定位重叠式广告的 AdDisplayContainer。
// 使用 ad.width 和 ad.height。
}
console.log('ad.g.contentType:' + ad.g.contentType);// text 'image/jpeg'
this.setupUIForAds(ad.g.contentType);
break;
case google.ima.AdEvent.Type.STARTED:
// 此事件表示广告已启动 - 视频播放器
// 可以调整用户界面,例如显示暂停按钮和
// 剩余时间。
if (ad.isLinear()) {
// 对于线性广告,可以启动计时器来查看
// 剩余时间。
this.intervalTimer = setInterval(() => {
let remainingTime = this.adsManager.getRemainingTime();
}, 300); // every 300ms
}
break;
case google.ima.AdEvent.Type.COMPLETE:
// 此事件表示广告已完成 - 视频播放器
// 可以执行相应的用户界面操作,例如删除
// 剩余时间检测的定时器。
if (ad.isLinear()) {
clearInterval(this.intervalTimer);
}
this.setupUIForContent();
break;
}
},

onAdError(adErrorEvent) {
if(this.preloadedRewardedVideoCallbackObj){
this.preloadedRewardedVideoCallbackObj.showRewardedVideoCallback(adErrorEvent);
this.preloadedRewardedVideoCallbackObj = null;
}
// 处理错误日志记录。
console.log(adErrorEvent.getError());
},

onContentPauseRequested() {
//this.videoContent.pause();
// 您应该使用此函数设置用户界面来展示广告(例如
// 展示广告计时器倒计时、停用搜寻等)
this.setupUIForAds();
},

onContentResumeRequested() {
if(this.preloadedRewardedVideoCallbackObj){
this.preloadedRewardedVideoCallbackObj.showRewardedVideoCallback();
this.preloadedRewardedVideoCallbackObj = null;
}
//this.videoContent.play();
// 您应该使用此函数确保用户界面已准备好
// 播放内容。发布商负责
// 在必要时实施此函数。
this.setupUIForContent();

},

setupUIForAds(contentType){
if(contentType == 'text'){
this.advertiseDiv.style.height = '63px';
this.advertiseDiv.style.top = '';
}else{
this.advertiseDiv.style.height = '';
this.advertiseDiv.style.top = '0';
}
this.advertiseDiv.style.visibility = 'visible';
},
setupUIForContent(){
this.advertiseDiv.style.visibility = 'hidden';
},
});
game.adSense = module.exports = new AdSense();
  • 广告使用
1
2
game.adSense.init(); // 初始化广告
game.adSense.show(1); // 加载banner