qb-pc-sdk 1.0.0 → 1.0.1

package/README.md

@@ -0,0 +1,137 @@
+# qb-pc-sdk
+
+趣变广告 SDK 封装器 - PC端广告接入工具
+
+自动处理多级接口映射与原生渲染逻辑，简化广告接入流程。
+
+## 安装
+
+```bash
+npm install qb-pc-sdk
+```
+
+## 使用方法
+
+### ES6 模块方式
+
+#### 方式一：默认导入
+
+```javascript
+import AdSDK from 'qb-pc-sdk';
+
+// 使用
+const adSDK = new AdSDK({
+  appId: 'your-app-id',
+  placementId: 'your-placement-id',
+  container: '#ad-container',
+  onAdLoaded: (ad) => {
+    console.log('广告加载成功', ad);
+  },
+  onAdError: (error, message) => {
+    console.error('广告加载失败', error, message);
+  },
+  onAdExpose: () => {
+    console.log('广告已曝光');
+  },
+  onAdClick: () => {
+    console.log('广告被点击');
+  }
+});
+```
+
+#### 方式二：命名导入
+
+```javascript
+import { AdSDKWrapper } from 'qb-pc-sdk';
+
+// 使用（注意这里使用的是 AdSDKWrapper）
+const adSDK = new AdSDKWrapper({
+  appId: 'your-app-id',
+  placementId: 'your-placement-id',
+  container: '#ad-container',
+  onAdLoaded: (ad) => {
+    console.log('广告加载成功', ad);
+  },
+  onAdError: (error, message) => {
+    console.error('广告加载失败', error, message);
+  },
+  onAdExpose: () => {
+    console.log('广告已曝光');
+  },
+  onAdClick: () => {
+    console.log('广告被点击');
+  }
+});
+```
+
+> **注意**：两种引入方式引入的都是同一个类，使用方式完全相同。`AdSDK` 和 `AdSDKWrapper` 是同一个类的不同名称。
+
+### 浏览器直接引入
+
+```html
+<script src="./src/ad-sdk-wrapper.js"></script>
+<script>
+  // 使用 window.AdSDK
+  const ad = new window.AdSDK({
+    appId: 'your-app-id',
+    placementId: 'your-placement-id',
+    container: '#ad-container',
+    onAdLoaded: (ad) => {
+      console.log('广告加载成功', ad);
+    },
+    onAdError: (error, message) => {
+      console.error('广告加载失败', error, message);
+    }
+  });
+</script>
+```
+
+## API
+
+### 构造函数
+
+```javascript
+new AdSDK(config)
+```
+
+#### 参数
+
+- `appId` (string, 必需): 应用 ID
+- `placementId` (string, 必需): 广告位 ID
+- `container` (string | HTMLElement, 必需): 广告容器选择器或 DOM 元素
+- `onAdLoaded` (function, 可选): 广告加载成功回调
+- `onAdError` (function, 可选): 广告加载失败回调
+- `onAdExpose` (function, 可选): 广告曝光回调
+- `onAdClick` (function, 可选): 广告点击回调
+
+### 示例
+
+```javascript
+const AdSDK = require('qb-pc-sdk');
+
+const adSDK = new AdSDK({
+  appId: 'your-app-id',
+  placementId: 'your-placement-id',
+  container: '#ad-container',
+  onAdLoaded: (ad) => {
+    console.log('广告加载成功');
+  },
+  onAdError: (error, message) => {
+    console.error('广告加载失败:', message);
+  },
+  onAdExpose: () => {
+    console.log('广告已曝光');
+  },
+  onAdClick: () => {
+    console.log('广告被点击');
+  }
+});
+```
+
+## 依赖
+
+- `qb-pc-ad-sdk-origin`: 底层广告 SDK
+
+## License
+
+MIT

package/index.js

@@ -0,0 +1,13 @@
+/**
+ * qb-pc-sdk 入口文件
+ * 导出 AdSDKWrapper 类供用户使用
+ */
+
+// 导入 AdSDKWrapper 类
+const AdSDKWrapper = require('./src/ad-sdk-wrapper.js');
+
+// 导出（支持多种导入方式）
+module.exports = AdSDKWrapper;
+module.exports.default = AdSDKWrapper;
+module.exports.AdSDKWrapper = AdSDKWrapper;
+

package/package.json

@@ -1,8 +1,29 @@
 {
   "name": "qb-pc-sdk",
-  "version": "1.0.0",
-  "description": "PC端广告接入项目",
+  "version": "1.0.1",
+  "description": "趣变广告 SDK 封装器 - PC端广告接入工具，自动处理多级接口映射与原生渲染逻辑",
+  "main": "index.js",
+  "files": [
+    "index.js",
+    "src/",
+    "README.md"
+  ],
+  "keywords": [
+    "ad",
+    "advertisement",
+    "sdk",
+    "qubian",
+    "pc",
+    "广告",
+    "广告SDK"
+  ],
+  "author": "",
+  "license": "MIT",
   "dependencies": {
     "qb-pc-ad-sdk-origin": "^1.0.0"
+  },
+  "repository": {
+    "type": "git",
+    "url": ""
   }
 }

package/src/ad-sdk-wrapper.js

@@ -2,8 +2,11 @@
  * 趣变广告 SDK 封装器
  * 自动处理多级接口映射与原生渲染逻辑
  */
-(function(window) {
+(function(global) {
     'use strict';
+    
+    // 兼容浏览器和 Node.js 环境
+    const window = typeof global !== 'undefined' && global.window ? global.window : (typeof window !== 'undefined' ? window : global);
 
     // 内部常量配置
     const API_CONFIG = {
@@ -212,5 +215,25 @@
         }
     }
 
-    window.AdSDK = AdSDKWrapper;
-})(window);
+    // 浏览器环境：挂载到 window
+    if (typeof window !== 'undefined' && window.document) {
+        window.AdSDK = AdSDKWrapper;
+    }
+    
+    // CommonJS 模块导出
+    if (typeof module !== 'undefined' && module.exports) {
+        module.exports = AdSDKWrapper;
+        module.exports.default = AdSDKWrapper;
+        module.exports.AdSDKWrapper = AdSDKWrapper;
+    }
+    
+    // AMD 模块导出
+    if (typeof define === 'function' && define.amd) {
+        define(function() {
+            return AdSDKWrapper;
+        });
+    }
+    
+    // 返回类供直接使用
+    return AdSDKWrapper;
+})(typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : this);

package/src/example-simple.html

@@ -19,10 +19,10 @@
 
     <script src="https://qzs.gdtimg.com/union/res/pc/ylh-pc-ad-sdk.v1.25.25.js"></script>
     <script src="ad-sdk-wrapper.js"></script>
-
+    AdSDK
     <script>
         window.addEventListener('DOMContentLoaded', () => {
-            new AdSDK({
+            new ({
                 appId: '1999336062823956569',
                 placementId: '1999381081819709520',
                 container: '#ad-slot-1',

package/config/ylh-ad-config.js

@@ -1,20 +0,0 @@
-/**
- * 参考文档: https://ylh.qq.com/help_detail.html?cid=5068&pid=12808
- */
-
-const YLH_AD_CONFIG = {
-  // 应用ID
-  appId: '1212355090',
-
-  // 广告位ID
-  // 注意：在API调用时使用 placementId 参数名
-  posId: '4204613922235231'
-};
-
-// 导出配置
-if (typeof module !== 'undefined' && module.exports) {
-  module.exports = YLH_AD_CONFIG;
-} else if (typeof window !== 'undefined') {
-  window.YLH_AD_CONFIG = YLH_AD_CONFIG;
-}
-

package//345/220/257/345/212/250/346/234/215/345/212/241/345/231/250.bat

@@ -1,34 +0,0 @@
-@echo off
-chcp 65001 >nul
-echo ========================================
-echo 广告接入 - 启动本地服务器
-echo ========================================
-echo.
-
-REM 检查是否安装了Node.js
-where node >nul 2>&1
-if %ERRORLEVEL% NEQ 0 (
-    echo [错误] 未检测到Node.js
-    echo 请先安装Node.js: https://nodejs.org/
-    echo.
-    pause
-    exit /b 1
-)
-
-echo [信息] 检测到Node.js
-node --version
-echo.
-
-echo [信息] 正在启动HTTP服务器（已启用CORS）...
-echo [信息] 服务器地址: http://localhost:8080
-echo [信息] 访问地址: http://localhost:8080/src/example-simple.html
-echo.
-echo [提示] 按 Ctrl+C 停止服务器
-echo ========================================
-echo.
-
-REM 启动服务器（启用CORS）
-npx http-server -p 8080 --cors
-
-pause
-