@leeguoo/pwtk-network-debugger 1.2.49-beta.9 → 1.3.1-beta.0

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 (13) hide show
  1. package/README.md +125 -4
  2. package/dist/index.cjs.js +4 -4
  3. package/dist/index.esm.js +230 -29
  4. package/dist/index.js +4 -4
  5. package/package.json +1 -1
  6. package/types/index.d.ts +1 -0
  7. package/types/index.d.ts.map +1 -1
  8. package/types/ui/panel.d.ts +7 -0
  9. package/types/ui/panel.d.ts.map +1 -1
  10. package/types/webgl/core/renderer.d.ts +20 -0
  11. package/types/webgl/core/renderer.d.ts.map +1 -1
  12. package/types/webgl/core/scene.d.ts +20 -0
  13. package/types/webgl/core/scene.d.ts.map +1 -1
package/README.md CHANGED
@@ -16,16 +16,29 @@
16
16
 
17
17
  ## 📦 安装
18
18
 
19
+ ### npm 安装
20
+
19
21
  ```bash
20
- npm install @leeguoo/network-debugger
22
+ npm install @leeguoo/pwtk-network-debugger
21
23
  ```
22
24
 
23
- 或使用 CDN:
25
+ ### CDN 引入
26
+
27
+ **推荐使用精确版本号，避免缓存问题：**
24
28
 
25
29
  ```html
26
- <script src="https://unpkg.com/@leeguoo/network-debugger/dist/index.js"></script>
30
+ <!-- 推荐：使用精确版本号 -->
31
+ <script src="https://cdn.jsdelivr.net/npm/@leeguoo/pwtk-network-debugger@1.3.0/dist/index.js"></script>
32
+
33
+ <!-- 或使用 unpkg -->
34
+ <script src="https://unpkg.com/@leeguoo/pwtk-network-debugger@1.3.0/dist/index.js"></script>
27
35
  ```
28
36
 
37
+ **注意**: 如果使用 `@latest` 标签，可能由于 CDN 缓存导致加载到旧版本。建议：
38
+ 1. 使用具体版本号
39
+ 2. 添加时间戳参数：`?t=${Date.now()}`
40
+ 3. 查看最新版本：[npm 主页](https://www.npmjs.com/package/@leeguoo/pwtk-network-debugger)
41
+
29
42
  ## 🚀 快速开始
30
43
 
31
44
  ### ESM/TypeScript 项目
@@ -70,10 +83,12 @@ NetworkDebugger.init({
70
83
  <body>
71
84
  <!-- 您的页面内容 -->
72
85
 
73
- <script src="https://unpkg.com/@leeguoo/network-debugger/dist/index.js"></script>
86
+ <!-- 推荐：使用精确版本号避免缓存 -->
87
+ <script src="https://cdn.jsdelivr.net/npm/@leeguoo/pwtk-network-debugger@1.3.0/dist/index.js"></script>
74
88
  <script>
75
89
  // 等待页面加载完成
76
90
  window.addEventListener('DOMContentLoaded', async () => {
91
+ const NetworkDebugger = window.NetworkDebugger?.default || window.NetworkDebugger;
77
92
  await NetworkDebugger.init({
78
93
  position: 'bottom-right',
79
94
  minimized: false
@@ -84,6 +99,42 @@ NetworkDebugger.init({
84
99
  </html>
85
100
  ```
86
101
 
102
+ ### 控制台一键安装（推荐用于临时调试）
103
+
104
+ 在任何网站的开发者控制台中运行：
105
+
106
+ ```javascript
107
+ (function(){
108
+ 'use strict';
109
+ const VERSION='1.3.0';
110
+ const CDN_URLS=[
111
+ 'https://cdn.jsdelivr.net/npm/@leeguoo/pwtk-network-debugger@'+VERSION+'/dist/index.js',
112
+ 'https://unpkg.com/@leeguoo/pwtk-network-debugger@'+VERSION+'/dist/index.js'
113
+ ];
114
+ let idx=0;
115
+ function load(){
116
+ if(idx>=CDN_URLS.length){
117
+ console.error('[PWTK] 所有 CDN 都失败');
118
+ return;
119
+ }
120
+ const s=document.createElement('script');
121
+ s.src=CDN_URLS[idx];
122
+ s.crossOrigin='anonymous';
123
+ s.onload=async()=>{
124
+ await new Promise(r=>setTimeout(r,500));
125
+ const nd=window.NetworkDebugger?.default||window.NetworkDebugger;
126
+ if(nd){
127
+ await nd.init({position:'bottom-right',decrypt:{enabled:true}});
128
+ console.log('✅ PWTK 解密工具已加载！');
129
+ }
130
+ };
131
+ s.onerror=()=>{idx++;load();};
132
+ document.head.appendChild(s);
133
+ }
134
+ load();
135
+ })();
136
+ ```
137
+
87
138
  ## ⚙️ 配置选项
88
139
 
89
140
  ```typescript
@@ -253,6 +304,76 @@ const wasmLoaded = debugger.isWasmLoaded()
253
304
  - 所有网络请求的拦截和解密都在浏览器内完成
254
305
  - 可以完全离线使用
255
306
 
307
+ ## 🔧 故障排除
308
+
309
+ ### 问题：加载的是旧版本
310
+
311
+ **症状**: 安装后，功能没有更新，控制台显示的版本号是旧的。
312
+
313
+ **原因**: CDN 缓存导致。jsDelivr 和 unpkg 会缓存 `@latest` 标签，缓存时间可能长达 12-24 小时。
314
+
315
+ **解决方案**:
316
+
317
+ 1. **使用精确版本号（强烈推荐）**:
318
+ ```html
319
+ <!-- 替换 @latest 为具体版本号 -->
320
+ <script src="https://cdn.jsdelivr.net/npm/@leeguoo/pwtk-network-debugger@1.3.0/dist/index.js"></script>
321
+ ```
322
+
323
+ 2. **添加缓存破坏参数**:
324
+ ```html
325
+ <script src="https://cdn.jsdelivr.net/npm/@leeguoo/pwtk-network-debugger@latest/dist/index.js?t=1234567890"></script>
326
+ ```
327
+
328
+ 3. **硬刷新浏览器**:
329
+ - Windows/Linux: `Ctrl + Shift + R` 或 `Ctrl + F5`
330
+ - Mac: `Cmd + Shift + R`
331
+
332
+ 4. **清除浏览器缓存**:
333
+ - 打开开发者工具 (F12)
334
+ - 右键点击刷新按钮
335
+ - 选择"清空缓存并硬性重新加载"
336
+
337
+ 5. **手动清除 jsDelivr 缓存**:
338
+ ```bash
339
+ curl -X PURGE https://cdn.jsdelivr.net/npm/@leeguoo/pwtk-network-debugger@latest/dist/index.js
340
+ ```
341
+
342
+ ### 问题：面板不显示
343
+
344
+ **可能原因**:
345
+ 1. 脚本加载失败（检查控制台错误）
346
+ 2. CSP（内容安全策略）限制
347
+ 3. 其他脚本冲突
348
+
349
+ **解决方案**:
350
+ 1. 检查浏览器控制台是否有错误信息
351
+ 2. 尝试使用不同的 CDN
352
+ 3. 确保在 `DOMContentLoaded` 之后初始化
353
+
354
+ ### 问题：解密功能不工作
355
+
356
+ **可能原因**:
357
+ 1. WebAssembly 文件未正确加载
358
+ 2. 密钥提取器配置不正确
359
+
360
+ **解决方案**:
361
+ 1. 检查 `wasmUrl` 配置是否正确
362
+ 2. 验证 `keyExtractor` 和 `slkExtractor` 函数
363
+ 3. 查看控制台日志了解详细错误
364
+
365
+ ### 查看当前版本
366
+
367
+ 在控制台中运行：
368
+ ```javascript
369
+ console.log(window.NetworkDebugger?.version || 'Unknown');
370
+ ```
371
+
372
+ 或查看成功加载的日志：
373
+ ```
374
+ ✅ PWTK 解密工具 v1.3.0 已成功加载！
375
+ ```
376
+
256
377
  ## 🤝 贡献
257
378
 
258
379
  欢迎提交 Issue 和 Pull Request！