uni-app Hbuilder3.98打包5+app ios使用WKWebView出现白屏
uni-app Hbuilder3.98打包5+app ios使用WKWebView出现白屏
示例代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
</head>
<body>
<div id="app" class="container app_container" >
<div class="loading_text color-gray">
系统加载中...
</div>
</div>
</body>
</html>
操作步骤:
- 新建一个项目,选择5+App,默认模版
- 发行,选择ios传统打包
- 安装运行
预期结果:
正常打开页面
实际结果:
白屏
bug描述:
模块配置->IOS UIWebview不勾选,打包ios app之后打开app白屏;
1 回复
在使用 uni-app 和 HBuilderX 3.98 打包 5+ App 时,如果在 iOS 上使用 WKWebView 出现白屏问题,可能是由于以下原因导致的。以下是一些常见的排查和解决方法:
1. 检查 WKWebView 的兼容性
- WKWebView 是 iOS 8 及以上版本引入的,确保你的 iOS 设备版本支持 WKWebView。
- 如果目标用户使用的是较旧的 iOS 设备,建议回退到 UIWebView(但需要注意,UIWebView 已被苹果标记为过时,可能会影响 App Store 审核)。
2. 检查页面加载逻辑
- 白屏可能是由于页面加载失败或资源路径错误导致的。检查以下内容:
- 确保页面路径正确。
- 检查是否有跨域问题(WKWebView 对跨域请求更严格)。
- 确保所有资源(如 JS、CSS、图片)都能正确加载。
3. 检查 WKWebView 的配置
- 在
manifest.json
中,确保 WKWebView 的配置正确。例如:"plus": { "kernel": { "ios": "WKWebView" } }
- 如果需要更详细的配置,可以参考 5+ App WKWebView 文档。
4. 检查 JavaScript 错误
- WKWebView 对 JavaScript 的执行更严格,可能会导致某些代码无法正常运行。
- 使用 Safari 的开发者工具(连接设备后,通过 Safari 的“开发”菜单调试)检查是否有 JavaScript 错误。
5. 检查网络请求
- WKWebView 对网络请求的限制较多,尤其是 HTTPS 请求。确保所有请求都使用 HTTPS,或者配置允许 HTTP 请求:
"plus": { "kernel": { "ios": "WKWebView", "allowHTTP": true } }
6. 检查页面渲染问题
- 某些 CSS 或 JavaScript 可能会导致页面渲染失败。尝试简化页面,逐步排查问题。
- 确保页面内容在 WKWebView 中能够正常渲染。
7. 更新 HBuilderX 和 uni-app
- 确保使用的是最新版本的 HBuilderX 和 uni-app,旧版本可能存在已知的兼容性问题。
- 更新方法:在 HBuilderX 中,点击菜单栏的“帮助” -> “检查更新”。
8. 调试日志
- 在代码中添加日志,检查页面加载和渲染的各个阶段是否正常。
- 使用
console.log
或uni.showToast
输出关键信息。
9. 回退到 UIWebView
- 如果问题无法解决,可以暂时回退到 UIWebView:
"plus": { "kernel": { "ios": "UIWebView" } }