qb-pc-sdk 1.3.6 → 1.3.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/core.min.js +1 -1
  2. package/package.json +3 -3
  3. package/src/ad-sdk-wrapper.js +0 -1061
  4. package/src/pcAdTest.html +0 -247
  5. package/src/pcLazyLoad.html +0 -37
package/src/pcAdTest.html DELETED
@@ -1,247 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="zh-CN">
3
-
4
- <head>
5
- <meta charset="UTF-8">
6
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
7
- <title>Native广告异步加载测试</title>
8
- <!-- 本地测试关闭按钮「首次点击=跳转」请用下面这行，发布用 unpkg -->
9
- <script src="../core.min.js"></script>
10
- <!-- <script src="https://unpkg.com/qb-pc-sdk@latest/inline-loader.js" defer></script> -->
11
- <style>
12
- body {
13
- margin: 0;
14
- padding: 20px;
15
- font-family: sans-serif;
16
- background: #f0f2f5;
17
- }
18
-
19
- .control-panel {
20
- background: white;
21
- padding: 20px;
22
- border-radius: 8px;
23
- box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
24
- margin-bottom: 20px;
25
- display: flex;
26
- gap: 15px;
27
- max-width: 900px;
28
- margin: 0 auto;
29
- }
30
-
31
- .input-group {
32
- display: flex;
33
- flex-direction: column;
34
- gap: 6px;
35
- flex: 1;
36
- }
37
-
38
- button#loadBtn {
39
- padding: 10px 24px;
40
- background-color: #007bff;
41
- color: white;
42
- border: none;
43
- border-radius: 6px;
44
- cursor: pointer;
45
- font-weight: 600;
46
- height: 42px;
47
- }
48
-
49
- button#loadBtn:disabled {
50
- background-color: #ccc;
51
- cursor: not-allowed;
52
- }
53
-
54
- button#showInterstitialBtn {
55
- padding: 10px 24px;
56
- background-color: #28a745;
57
- color: white;
58
- border: none;
59
- border-radius: 6px;
60
- cursor: pointer;
61
- font-weight: 600;
62
- height: 42px;
63
- }
64
- button#showInterstitialBtn:disabled {
65
- background-color: #ccc;
66
- cursor: not-allowed;
67
- }
68
-
69
- #ad-slot-wrapper {
70
- max-width: 900px;
71
- margin: 20px auto;
72
- background: #fff;
73
- padding: 20px;
74
- border-radius: 8px;
75
- min-height: 240px;
76
- border: 2px dashed #e0e0e0;
77
- }
78
-
79
- #log-container {
80
- max-width: 900px;
81
- margin: 20px auto;
82
- background: #2d2d2d;
83
- color: #00ff00;
84
- padding: 15px;
85
- border-radius: 8px;
86
- font-family: monospace;
87
- font-size: 12px;
88
- height: 250px;
89
- overflow-y: auto;
90
- }
91
-
92
- .log-error {
93
- color: #ff4444;
94
- }
95
-
96
- .log-success {
97
- color: #00ff00;
98
- }
99
- </style>
100
- </head>
101
-
102
- <body>
103
-
104
- <div class="control-panel">
105
- <div class="input-group">
106
- <label>App ID</label>
107
- <input type="text" id="appIdInput" value="2009110913851875373">
108
- </div>
109
- <div class="input-group">
110
- <label>Placement ID</label>
111
- <input type="text" id="placementIdInput" value="2009111010614468619">
112
- </div>
113
- <div class="input-group" style="justify-content: center;">
114
- <label style="opacity: 0;">占位</label>
115
- <label style="display: flex; align-items: center; gap: 8px; cursor: pointer; user-select: none;">
116
- <input type="checkbox" id="closeBtnFirstClickAsAd" checked>
117
- <span>点击=广告跳转</span>
118
- </label>
119
- </div>
120
- <button id="loadBtn" disabled>SDK 加载中...</button>
121
- <button id="showInterstitialBtn" disabled title="先加载广告后再点击">以插屏形式展示</button>
122
- </div>
123
-
124
- <div id="ad-slot-wrapper">
125
- <div id="ad-initial-tip" style="text-align: center; color: #999; padding-top: 80px;">
126
- 等待 SDK 异步就绪...
127
- </div>
128
- </div>
129
-
130
- <div id="log-container"></div>
131
- <!-- <div class="_krzjgiyls5a"></div> -->
132
-
133
- <script>
134
- // (window.slotbydup = window.slotbydup || []).push({
135
- // id: "u7009528",
136
- // container: "_krzjgiyls5a",
137
- // async: true
138
- // });
139
- let currentAdInstance = null;
140
- let isSdkReady = false;
141
-
142
- function log(msg, type = 'info') {
143
- const logContainer = document.getElementById('log-container');
144
- const div = document.createElement('div');
145
- let colorStyle = '';
146
- if (type === 'error') colorStyle = 'color:#ff4444;';
147
- if (type === 'success') colorStyle = 'color:#00ff00;';
148
- div.innerHTML = `<span style="color:#888">[${new Date().toLocaleTimeString()}]</span> <span style="${colorStyle}">${msg}</span>`;
149
- logContainer.appendChild(div);
150
- logContainer.scrollTop = logContainer.scrollHeight;
151
- }
152
-
153
- // --- 核心逻辑：处理异步加载的时序 ---
154
-
155
- const initUI = () => {
156
- const loadBtn = document.getElementById('loadBtn');
157
- loadBtn.disabled = false;
158
- loadBtn.innerText = '加载广告';
159
- document.getElementById('ad-initial-tip').innerText = '✅ SDK 已就绪，可以点击加载';
160
- log('✅ SDK 系统已就绪 (defer 模式)', 'success');
161
- };
162
-
163
- // 1. 监听自定义就绪事件
164
- window.addEventListener('qb-pc-sdk-ready', (e) => {
165
- if (e.detail && e.detail.error) {
166
- log(`❌ SDK 内部加载失败: ${e.detail.error.message}`, 'error');
167
- return;
168
- }
169
- if (!isSdkReady) {
170
- isSdkReady = true;
171
- initUI();
172
- }
173
- });
174
-
175
- // 2. 兜底轮询：防止由于 async 脚本执行太快，导致事件监听器还没注册好就错过了事件
176
- const checkReady = setInterval(() => {
177
- if (window.AdSDK && !isSdkReady) {
178
- clearInterval(checkReady);
179
- isSdkReady = true;
180
- initUI();
181
- }
182
- }, 100);
183
-
184
- // 10秒超时处理
185
- setTimeout(() => clearInterval(checkReady), 10000);
186
-
187
- // --- 广告加载逻辑 ---
188
-
189
- function handleLoadClick() {
190
- if (!isSdkReady) return;
191
-
192
- const appId = document.getElementById('appIdInput').value.trim();
193
- const placementId = document.getElementById('placementIdInput').value.trim();
194
-
195
- if (currentAdInstance) {
196
- currentAdInstance.destroy();
197
- log('销毁旧广告实例');
198
- }
199
- const interstitialBtn = document.getElementById('showInterstitialBtn');
200
- if (interstitialBtn) interstitialBtn.disabled = true;
201
-
202
- const wrapper = document.getElementById('ad-slot-wrapper');
203
- wrapper.innerHTML = '<div id="ad-target"></div>';
204
-
205
- const closeBtnFirstClickAsAd = document.getElementById('closeBtnFirstClickAsAd').checked;
206
- log(`开始请求广告: ${placementId}${closeBtnFirstClickAsAd ? '（关闭按钮：首次点击=跳转）' : ''}`);
207
-
208
- currentAdInstance = new window.AdSDK({
209
- appId: appId,
210
- placementId: placementId,
211
- container: '#ad-target',
212
- closeButtonFirstClickAsAdClick: closeBtnFirstClickAsAd,
213
- onAdLoaded: (ad, instance) => {
214
- log('✅ 广告展示成功', 'success');
215
- if (closeBtnFirstClickAsAd) {
216
- log('关闭按钮已绑定：第一次点击=广告跳转，第二次点击=关闭', 'success');
217
- }
218
- const interstitialBtn = document.getElementById('showInterstitialBtn');
219
- if (interstitialBtn) {
220
- interstitialBtn.disabled = false;
221
- interstitialBtn.title = '点击后当前广告将以全屏遮罩、居中插屏形式展示';
222
- }
223
- },
224
- onAdError: (err, msg) => log(`❌ 加载失败: ${msg}`, 'error'),
225
- onAdExpose: () => log('👀 广告曝光'),
226
- onAdClick: () => log('🖱️ 广告点击')
227
- });
228
- }
229
-
230
- document.getElementById('loadBtn').onclick = handleLoadClick;
231
-
232
- document.getElementById('showInterstitialBtn').onclick = function() {
233
- if (!currentAdInstance) {
234
- log('请先加载广告', 'error');
235
- return;
236
- }
237
- if (typeof currentAdInstance.showAsInterstitial !== 'function') {
238
- log('当前 SDK 版本不支持 showAsInterstitial', 'error');
239
- return;
240
- }
241
- currentAdInstance.showAsInterstitial();
242
- log('已以插屏形式展示广告（点击遮罩或关闭按钮可关闭）', 'success');
243
- };
244
- </script>
245
- </body>
246
-
247
- </html>
package/src/pcLazyLoad.html DELETED
@@ -1,37 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="zh-CN">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>Native 广告懒加载测试 (SDK 内置 .lazy-ad)</title>
7
- <!-- 用户只需引用 SDK，懒加载由 SDK 内部 IntersectionObserver 完成 -->
8
- <!-- <script src="https://unpkg.com/qb-pc-sdk@latest/inline-loader.js" defer></script> -->
9
- <script src="../core.min.js"></script>
10
- <style>
11
- body { margin: 0; padding: 20px; font-family: sans-serif; background: #f0f2f5; }
12
- .section { max-width: 900px; margin: 0 auto 24px; background: #fff; padding: 24px; border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.08); }
13
- .section h2 { margin: 0 0 16px; font-size: 18px; color: #333; }
14
- .lazy-ad { min-height: 220px; border: 2px dashed #e0e0e0; border-radius: 8px; display: flex; align-items: center; justify-content: center; color: #999; font-size: 14px; box-sizing: border-box; }
15
- </style>
16
- </head>
17
- <body>
18
-
19
- <div class="section">
20
- <h2>首屏广告位</h2>
21
- <div class="lazy-ad" id="ad-pos-1" data-app-id="2009110913851875373" data-ad-id="2009111010614468619" data-show-as-interstitial="true" data-close-button-first-click-as-ad="true">广告位 1 - 进入视口约 200px 内时加载</div>
22
- </div>
23
-
24
- <div class="section" style="height: 1200px;">
25
- <h2>占位内容（向下滚动触发下方广告）</h2>
26
- </div>
27
- <div class="section">
28
- <h2>下方广告位</h2>
29
- <div class="lazy-ad" data-app-id="2009110913851875373" data-ad-id="2009111010614468619" data-close-button-first-click-as-ad="true">广告位 2 - 懒加载</div>
30
- </div>
31
-
32
- <p style="max-width:900px;margin:20px auto;color:#666;font-size:14px;">
33
- 接入说明：页面中放入 <code>&lt;div class="lazy-ad" data-app-id="应用ID" data-ad-id="广告位ID"&gt;&lt;/div&gt;</code>，引用 SDK 后即可自动懒加载（rootMargin 200px），无需额外脚本。
34
- </p>
35
-
36
- </body>
37
- </html>