本文记录了如何在 iOS Simulator 和 Android 设备上调试 h5 页面，并在提供了 Alfred 脚本来便捷地管理 Simulator。

iOS 模拟器调试

1.启动Simulator.app

open -a /Applications/Xcode.app/Contents/Developer/Applications/Simulator.app

tips：xcode-select -p 会打印当前 xcode developer 目录：

/Applications/Xcode.app/Contents/Developer

上述命令可以写为

open -a `xcode-select -p`/Applications/Simulator.app

2.模拟器上打开要调试的页面

2.1 在 Safari 中打开

xcrun simctl openurl booted https://www.baidu.com

xcrun 会自动在 xcode developer 目录下查找simctl命令，而simctl 是操作Simulator.app的命令。

参数 booted 将操作目标指向当前启动的模拟器。

2.2 在 app 中打开

模拟器安装 app

xcrun simctl install booted youriPhone.app

在 app 上打开网页

xcrun simctl openurl booted APP_SCHEME:URL

APP_SCHEME 及后面的路径根据自己 app 注册的去更改。

3.打开 mac 上的Safari

Menu -> Develop -> Simulator，选择打开的网址即可调试了。

Android 真机调试

  1. usb 链接 Android 设备到 mac
  2. 打开开发者选项模式，开启 usb debug
  3. Chrome 浏览器打开 chrome://inspect/#devices
  4. 如果该页面没有显示设备，全局翻墙或者重新拔插 usb 后刷新页面重试。

有的 app 使用的是手Q X5 内核，在 app 中打开http://debugx5.qq.com

  1. 在 “X5调试页面” 上，点击进入 “信息” Tab。

  2. 找到TBS settings栏目，勾选"是否打开TBS内核Inspector调试功能"，然后点击确认，进程自动退出。

  3. 重新打开Web页面，使用Inspector页面调试功能。

（有时候，为了确认是 X5内核引起的兼容性问题，还可以打开http://debugtbs.qq.com，选择使用系统自带内核。）

利用 Alfred 快捷打开 Simulator

利用 xcode command 提供的命令，可以在 Alfred 中快速打开 Simulator 并导航到待调试页面。

# coding=utf-8
import json
import re
import subprocess
import sys
import urllib

from workflow import Workflow3

APP_NAME = 'Mogujie4iPhone.10.4.0.app'
APP_SCHEME = 'mogujie://open?url='


def luanch():
    cmd = 'open -a `xcode-select -p`/Applications/Simulator.app'
    return subprocess.check_call(cmd, shell=True)


def install(json_str=''):
    option = json.loads(json_str)
    # no booted devices found
    if option['identifier'] == '':
        luanch()
        cmd = 'xcrun simctl install booted ~/.ios-simulator/' + APP_NAME
        return subprocess.check_call(cmd, shell=True)
    else:
        cmd = 'xcrun simctl install {identifier} ~/.ios-simulator/' + APP_NAME
        cmd = cmd.format(identifier=option['identifier'])
        return subprocess.check_call(cmd, shell=True)


def open(json_str=''):
    option = json.loads(json_str)

    url = APP_SCHEME + urllib.pathname2url(option['url'])
    cmd = 'xcrun simctl openurl {identifier} {url}'
    cmd = cmd.format(identifier=option['identifier'], url=url)

    return subprocess.check_call(cmd, shell=True)


def get_booted():
    # get booted list
    cmd = 'xcrun simctl list | grep Booted'
    # iPhone X (3D62292C-C2C4-4DE5-B2E0-EDA1AC846115) (Booted)
    return subprocess.check_output(cmd, shell=True).splitlines()


def main(wf):
    args = wf.args

    try:
        booted_list = get_booted()
        items = []
        for booted in booted_list:
            match = re.search(r'\((.*?)\)', booted)
            if match:
                identifier = match.group(1)
                items.append({
                    'title': booted.strip(),
                    'subtitle': identifier,
                    'identifier': identifier,
                })

        for item in items:
            if len(args) > 0:
                url = args[0]
            else:
                url = ''
            # pass the url args down use json str
            arg = json.dumps({'url': url, 'identifier': item['identifier']})
            wf.add_item(title=item['title'],
                        subtitle=item['subtitle'],
                        arg=arg,
                        valid=True)
    except subprocess.CalledProcessError:
        luanch()

    wf.send_feedback()


if __name__ == '__main__':
    wf = Workflow3()
    sys.exit(wf.run(main))

注意更改代码中的 APP_NAME 和 APP_SCHEME

可以使用下面快捷命令：

# 启动模拟器
is luanch 
# 在模拟器中安装 ~/.iso-simulator 目录下的 app
is install 
# 在模拟器中打开h5地址
is open http://xxxx.com

最终效果如图