如何在Win电脑上调试iOS设备的网页

安装环境

• 参考
• 微软应用商店安装iTunes
• 安装scoop
  • powershell输入iwr -useb get.scoop.sh | iex
• 安装插件和环境
  • scoop bucket add extras
  • scoop install ios-webkit-debug-proxy
• 安装调试器（需要node.js）
  • npm install remotedebug-ios-webkit-adapter -g

    开始调试

• 打开iOS设备的设置—>Safari浏览器—>高级—>将网页检查器打开
• 启动iTunes
• 使用iPad数据线链接电脑的Type-C接口和iPad
• 首次连接可能需要在iOS设备上信任本电脑
• 开启插件remotedebug_ios_webkit_adapter --port=9000
  • 
• 添加上面监听的端口9000
  • 
  • 
• 连接上iPad设备
  • 
  • 点击inspect查看网页
  • 

    控制台传输问题

• 有时候safari无法捕捉到网页的控制台输出，导致chrome远程调试的时候无法输出JavaScript中的console.log()信息
• 
• console.error()一样无法输出，此时只能在html中创建一个元素手动修改其innerHTML来显示输出

  DOM元素参考

• w3school

  safari(iPad)端播放MP4的编码注意事项

• H.264 视频编码和 AAC 音频编码
• MP4 文件的元数据（称为 moov box）应该位于文件的开头
  • ffmpeg选项为-movflags faststart
• 将视频的声道设置为双声道（某些多声道的视频即使视频编码无问题也无法播放）
  • ffmpeg选项-ac 2
• html播放器遇到不支持的视频的时候可能会出现video标签的
  • networkState为3
  • readyState为0
  • error.code为4也就是MEDIA_ERR_SRC_NOT_SUPPORTED