随着移动设备的快速发展，H5开发已经成为F2E不可或缺的能力。移动开发最重要的是掌握调试技巧，让bug无形化。一、概述由于手机操作系统分为iOS和Android，本文中的调试技巧也会根据不同的系统进行区分。只有找到最合适、最高效的方法，才能事半功倍。文章将列出目前适用于移动端调试的多种方案，快来选择你的最佳实践吧！2、iOS设备Safari：iphone调试工具，检查错误和更改样式的首选，我们需要做如下设置：浏览器设置：Safari-首选项-高级-勾选“在菜单栏中显示开发”菜单iphone设置：设置-Safari-高级-打开网页检查器就大功告成了。这时候通过手机的Safari打开H5页面，我们可以通过浏览器开发选项看到：iOS模拟器：不需要真机，适合调试交互频繁的webview和H5功能页面。首先下载Xcode，运行项目，选择模拟器iphonex，编译后打开模拟器，如下：可以看到H5已经在“shell”中运行了，接下来可以尝试调用Webview的方法，以及"shell""交互。更多调试技巧可参考文章：iOS模拟器调试，具体调试功能还是要看浏览器的开发选项，同上，不再赘述3.抓包Charles：MacOS系统首选抓包工具，适合查看和控制网络请求，分析数据情况，Charles首先需要配置手机代理，Wifi-配置代理（IP地址）-手动，如下图：配置好手机代理后，此时打开Charles，会收到确认提示，选择Allow。接下来就可以抓取手机的请求了，不过这些都是常规操作，我们做一些先进的事情。有意思的是，我们可以用本地文件替换在线文件，方便调试和远程定位在线问题。选择Structure，找到需要替换的文件，右键菜单-MapLocal，如下图：此时会打开一个弹窗，填写具体配置：OK,you大功告成，去改本地文件，再也不怕在线调试起来了。需要注意的是，如果抓取HTTPS请求，必须安装信任证书，下面会详细介绍。相应的，Windows平台的Fiddler也有大致类似的功能，这里不再赘述。
