pfan123/Articles

iOS 模拟器调试

pfan123 opened this issue · 0 comments

iOS 模拟器调试

Hybrid App(混合模式移动应用)iOS 应用使用 WKWebView 进行 weapp 页面渲染,

如何多机型调试 WKWebView 渲染的 weapp 页面呢?可以通过 iOS 模拟器模拟多机型进行调试。

一. 安装 & 启动

安装 Xcode

配置 Xcode 命令行工具

Xcode 安装完毕后,需安装 Command-line-tools 命令行工具,执行 :

xcode-select --install # install Command-line-tools

# 遇问题,可操作
softwareupdate --list # 查看可更新的版本
softwareupdate --install --all  # 更新所有过时的版本
softwareupdate --install <product name> # 更新对应的版本

启动

安装完毕后搜索Simulator,或者按 Command+Shift+G, 输入/Applications/Xcode.app/Contents/Developer/Applications/Simulator.app,便可运行模拟器。

可以使用命令行来管理和启动模拟器:

# 列出可用模拟器设备, 分类展示
xcrun simctl list devices

# 列出可用的 iOS 模拟器
xcrun instruments -s

# 启动对应模拟器
xcrun instruments -w XXX

# 启动录屏 use-debug-tools-easy-config.mov 是动态的, 即视频的文件名
xcrun simctl io booted recordVideo use-debug-tools-easy-config.mov

# 安装你的 app
xcrun simctl install booted /Users/yourself/Downloads/youApp.app

# 启动你的 app
xcrun simctl launch booted com.yourself.packagename

# 在 app 中直接打开 url
xcrun simctl openurl booted 'https://webview.yourname.com/aaa/index.htm?param1=1'

Simulator 默认只有最新的 iOS 版本 的模拟器,若需要在多版本的 iOS 上调试,可通过【Xcode】-> 【Preferences】-> 【Components】安装对应 iOS 版本

二. 调试

配置代理

在调试过程中,需要把模拟器的网络请求代理到抓包工具上 Whistlecharles, 如 Whistle, 代理默认地址 http://127.0.0.1:8899

调试网页

  • 模拟器中启动 Safari
  • Mac 上启动 Safari,在首选项中启用开发菜单

img

  • 模拟器访问需要调试的页面,在开发菜单中找到我们的页面:

img

WebView 调试

除了直接调试 Safari 中的页面,还可以借助模拟器调试 APP 中的 Web 页面。可以在 APP 中直接打断点、走单步调试等。

首先我们需要客户端同学给模拟器打一个.app包,把包拖到模拟器安装。然后启动 APP,访问要调试的 Web 页面,如法炮制:

img

注意:打给 iPhone 的 .app 包不能直接给模拟器使用(会闪退),因为模拟器是运行在 X86 指令集上的,需要专门打包。

扩展 - Android 模拟器

从命令行启动模拟器

# 查看 AVD 名称的列表,请输入以下命令:
emulator -list-avds

# 启动某台终端
emulator -avd Pixel_3a_API_30_x86

# 查看帮助
emulator -help

Other Resources

Simulator User Guide
spy-debugger
构建基于 iOS 模拟器的前端调试方案
node-simctl