远程调测：问题和实践方法（待补充）

调试的一些常用的手段和技巧：

 

序号	功能	工具
1	测试环境配置	Hosts（Gas Mask）, fiddler,Charles等
2	DOM节点，样式校正，Console	浏览器自带工具及第三方对比工具
3	网络抓包	浏览器自带工具或httpwatch、fiddler、Charles
4	文件替换	fiddler、Charles等代理工具
5	脚本调试	浏览器自带，Script debugger，IDE等
6	性能检查	浏览器自带Fiddler、Charles等第三方工具

 

H5在移动端调测方式：

1、继续PC上的开发和调试（不能体现移动终端的实际场景）

2、通过User-Agent的处理模拟终端请求等方式并不能真的让业务代码逻辑跑在预期的平台上，所以可使用模拟器。用模拟器的好处在于可以复用PC上的一些网络配置和抓包工具。（Android模拟器太慢，IOS可行）

3、使用浏览器的remote debugging模式，在真机上进行远程调试处理（对支持的操作系统和浏览器版本有要求）

4、使用iWebInspector，MIHTool，云服务等（有局限性，特别是不能单点调试javascript）。

      

 

问题1：

开发的JS、CSS等文件在不同的环境下，通常需要切换和绑定hosts。

 

解决方法：

手机绑定hosts（需要越狱/root；有的手机浏览器根本不认hosts文件，如UC）

 

root手机，修改手机端hosts文件，切换不同环境。

 

使用代理（Fiddler\Charles），手机连接代理服务器，修改代理服务器的hosts文件，或者用Fiddler\Charles的替换功能，直接替换成所需的response。

 

问题2：

线上发现问题，需要验证并debug。在本地拉WEB服务器并绑定HOSTS，使应用下载本地修改过后的JS、CSS等文件。

解决方法：

 

使用fiddler或Charles的替换Response功能替换请求下的文件。