qiming/qiming-mobile/.cursor/plans/-8f20f6d7.plan.md

微信小程序适配问题排查与修复计划

问题概览

经过排查，发现以下主要问题需要修复：

1. H5 特定 API 缺少条件编译保护

问题文件：

• utils/common.uts - 使用了 window.location 和 document
• utils/streamRequest.uts - 使用了 window.addEventListener
• servers/useRequest.uts - 使用了 window.location.hash 和 window.location.href
• utils/permissionHelper.uts - 使用了 navigator.permissions
• hooks/useMessageEventDelegate.uts - 使用了 window.open, URLSearchParams, DOM API
• servers/audioUploader.uts - 使用了 URL.revokeObjectURL

2. 流式请求实现不完整

问题：

• utils/streamRequest.uts 中的微信小程序分支使用了普通 uni.request，但没有正确实现流式数据接收
• 应该使用 enableChunked 和 onChunkReceived 或参考 weappEventSource 的实现方式

3. WebView 组件配置

问题：

• pages/webview/webview.uvue 使用了 <web-view> 组件
• 微信小程序中需要配置业务域名才能使用 web-view

4. 自定义导航栏

问题：

• pages.json 中所有页面都使用了 navigationStyle: "custom"
• 需要确保自定义导航栏组件在微信小程序中正常工作

修复计划

阶段一：修复 H5 特定 API 条件编译

1. utils/common.uts

• 将 getURLParams 函数中的 window.location 使用条件编译包裹
• 将 addBaseTarget 函数中的 document 使用条件编译包裹
• 将 findParentElement 和 findClassElement 中的 DOM API 使用条件编译

2. utils/streamRequest.uts

• 将顶部的 window.addEventListener 使用条件编译包裹（#ifdef H5）

3. servers/useRequest.uts

• window.location.hash 已在条件编译中，但需要确保兼容性
• window.location.href 已在条件编译中，需要验证

4. utils/permissionHelper.uts

• navigator.permissions 已在条件编译中，需要确认非 H5 平台的实现

5. hooks/useMessageEventDelegate.uts

• window.open 需要替换为 uni-app 的导航 API
• URLSearchParams 需要条件编译或使用 uni-app 兼容实现
• DOM API (closest, addEventListener) 需要替换为 uni-app 的事件处理方式

6. servers/audioUploader.uts

• URL.revokeObjectURL 仅在清理 Blob URL 时使用，需要条件编译保护

阶段二：修复流式请求实现

1. utils/streamRequest.uts

• 修改 requestWeapp 方法，使用 enableChunked: true 和 onChunkReceived 回调
• 参考 servers/useRequest.uts 中的 weappEventSource 实现方式
• 确保流式数据解析正确

阶段三：WebView 和导航配置

1. pages/webview/webview.uvue

• 确保 web-view 组件在微信小程序中正确使用
• 添加错误处理和兼容性检查

2. manifest.json

• 确认微信小程序配置中是否需要添加 web-view 相关配置

3. 自定义导航栏组件

• 检查 components/custom-nav-bar 在微信小程序中的兼容性
• 确保所有页面都能正常显示自定义导航栏

阶段四：测试与验证

1. 在微信开发者工具中编译和测试
2. 验证流式请求是否正常工作
3. 验证音频上传功能
4. 验证 WebView 页面跳转
5. 验证所有页面的导航功能

实施顺序

1. 先修复 H5 特定 API 的条件编译（避免运行时错误）
2. 修复流式请求实现（核心功能）
3. 处理 WebView 和导航相关配置
4. 最后进行全面测试

To-dos

• 修复 utils/common.uts 中的 H5 特定 API（window.location、document），添加条件编译保护
• 修复 utils/streamRequest.uts 中的 window.addEventListener，添加条件编译保护
• 修复 hooks/useMessageEventDelegate.uts 中的 DOM API 和 window.open，替换为 uni-app API
• 修复 servers/audioUploader.uts 中的 URL.revokeObjectURL，添加条件编译保护
• 修复 utils/streamRequest.uts 中的微信小程序流式请求实现，使用 enableChunked 和 onChunkReceived
• 验证 pages/webview/webview.uvue 在微信小程序中的兼容性，检查业务域名配置
• 验证自定义导航栏组件在微信小程序中是否正常工作
• 在微信开发者工具中编译测试，验证所有功能是否正常