qb-pc-sdk 1.0.1 → 1.0.2

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 (4) hide show
  1. package/README.md +14 -7
  2. package/index.js +17 -2
  3. package/package.json +1 -1
  4. package/src/example-simple.html +7 -4
package/README.md CHANGED
@@ -1,8 +1,8 @@
1
1
  # qb-pc-sdk
2
2
 
3
- 趣变广告 SDK 封装器 - PC端广告接入工具
4
-
5
- 自动处理多级接口映射与原生渲染逻辑，简化广告接入流程。
3
+ 趣变广告 SDK 封装器 - PC端广告接入工具
4
+ 自动处理多级接口映射与原生渲染逻辑，简化广告接入流程。
5
+ 从 1.0.1 起，浏览器环境会自动加载底层依赖 `qb-pc-ad-sdk-origin`（已改名的原始 SDK），常规打包场景开箱即用。
6
6
 
7
7
  ## 安装
8
8
 
@@ -12,7 +12,7 @@ npm install qb-pc-sdk
12
12
 
13
13
  ## 使用方法
14
14
 
15
- ### ES6 模块方式
15
+ ### ES6 模块方式（开箱即用）
16
16
 
17
17
  #### 方式一：默认导入
18
18
 
@@ -64,11 +64,18 @@ const adSDK = new AdSDKWrapper({
64
64
  });
65
65
  ```
66
66
 
67
- > **注意**：两种引入方式引入的都是同一个类，使用方式完全相同。`AdSDK` 和 `AdSDKWrapper` 是同一个类的不同名称。
67
+ > **注意**：`AdSDK` / `AdSDKWrapper` 是同一个类。
68
+ > 在浏览器打包场景（webpack/Vite 等）无需再单独 `import 'qb-pc-ad-sdk-origin'`，入口已在有 `window` 时自动 `require` 底层 SDK。若在极端沙箱/SSR 场景下未能挂载 `window.GDTAdSDK`，可手动在入口补充 `import 'qb-pc-ad-sdk-origin';` 作为兜底。
68
69
 
69
- ### 浏览器直接引入
70
+ ### 浏览器直接引入（不经打包）
70
71
 
71
72
  ```html
73
+ <!-- 先引入底层 SDK（本地或 CDN 其一） -->
74
+ <script src="/qb-pc-ad-sdk.v1.0.0.js"></script>
75
+ <!-- 或 CDN 示例： -->
76
+ <!-- <script src="https://unpkg.com/qb-pc-ad-sdk-origin/dist/qb-pc-ad-sdk.v1.0.0.js"></script> -->
77
+
78
+ <!-- 再引入封装后的 qb-pc-sdk（UMD，本仓库 src/ad-sdk-wrapper.js） -->
72
79
  <script src="./src/ad-sdk-wrapper.js"></script>
73
80
  <script>
74
81
  // 使用 window.AdSDK
@@ -130,7 +137,7 @@ const adSDK = new AdSDK({
130
137
 
131
138
  ## 依赖
132
139
 
133
- - `qb-pc-ad-sdk-origin`: 底层广告 SDK
140
+ - `qb-pc-ad-sdk-origin`: 底层广告 SDK（已自动在浏览器环境加载）
134
141
 
135
142
  ## License
136
143
 
package/index.js CHANGED
@@ -1,13 +1,28 @@
1
1
  /**
2
2
  * qb-pc-sdk 入口文件
3
- * 导出 AdSDKWrapper 类供用户使用
3
+ * 1) 浏览器环境下预加载底层 SDK（qb-pc-ad-sdk-origin），确保 window.GDTAdSDK 可用
4
+ * 2) 导出封装器 AdSDKWrapper
4
5
  */
5
6
 
6
- // 导入 AdSDKWrapper 类
7
+ const isBrowser = typeof window !== 'undefined';
8
+
9
+ // 浏览器中预加载底层 SDK（仅 side-effect，挂载 window.GDTAdSDK）
10
+ if (isBrowser) {
11
+ try {
12
+ require('qb-pc-ad-sdk-origin');
13
+ } catch (err) {
14
+ // 这里不抛出，保持封装层逻辑可继续运行并给出错误回调
15
+ console.warn('[AdSDK] 底层 SDK 加载失败，请确认 qb-pc-ad-sdk-origin 已正确安装', err);
16
+ }
17
+ }
18
+
19
+ // 导入封装器
7
20
  const AdSDKWrapper = require('./src/ad-sdk-wrapper.js');
8
21
 
9
22
  // 导出（支持多种导入方式）
10
23
  module.exports = AdSDKWrapper;
11
24
  module.exports.default = AdSDKWrapper;
12
25
  module.exports.AdSDKWrapper = AdSDKWrapper;
26
+ // 可选：透出底层 SDK（若已加载）
27
+ module.exports.GDTAdSDK = isBrowser ? window.GDTAdSDK : undefined;
13
28
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "qb-pc-sdk",
3
- "version": "1.0.1",
3
+ "version": "1.0.2",
4
4
  "description": "趣变广告 SDK 封装器 - PC端广告接入工具，自动处理多级接口映射与原生渲染逻辑",
5
5
  "main": "index.js",
6
6
  "files": [
package/src/example-simple.html CHANGED
@@ -17,20 +17,23 @@
17
17
  <body>
18
18
  <div id="ad-slot-1"></div>
19
19
 
20
- <script src="https://qzs.gdtimg.com/union/res/pc/ylh-pc-ad-sdk.v1.25.25.js"></script>
20
+ <!-- 先加载底层广告 SDK（CDN 方式，避免本地路径 404） -->
21
+ <script src="https://unpkg.com/qb-pc-ad-sdk-origin/dist/qb-pc-ad-sdk.v1.0.0.js"></script>
22
+ <!-- 再加载封装后的 qb-pc-sdk（本地源码版，直接挂载 window.AdSDK） -->
21
23
  <script src="ad-sdk-wrapper.js"></script>
22
- AdSDK
23
24
  <script>
24
25
  window.addEventListener('DOMContentLoaded', () => {
25
- new ({
26
+ new window.AdSDK({
26
27
  appId: '1999336062823956569',
27
28
  placementId: '1999381081819709520',
28
29
  container: '#ad-slot-1',
29
30
  onAdLoaded: () => console.log('✅ 广告加载完成'),
30
- onAdError: (err) => console.log('❌ 广告报错:', err),
31
+ onAdError: (err, msg) => console.log('❌ 广告报错:', err, msg),
32
+ onAdExpose: () => console.log('👀 广告曝光'),
31
33
  onAdClick: () => console.log('🖱️ 用户点击了广告')
32
34
  });
33
35
  });
34
36
  </script>
35
37
  </body>
36
38
  </html>
39
+