安卓移动微信页调试大法

安卓移动微信页调试大法

 

在开发移动端页面时，一般都得保证在微信页面中能够正常访问，虽说微信内置浏览器统一了各个不同安卓机的WebView，但在不同的机子上，还是会出现不一样的兼容问题。
调试页面，有几个维度要考虑：能够访问页面、审查元素查看页面输出、抓包查看请求模拟登陆、断点调试、性能测试、在模拟器上调试、在真机上调试
本文仅涉及基础页面的调试，不涉及Hybrid app、公众号JDK 、小程序的相关调试

一、能够访问页面

在开发安卓微信页面时，刚开始一般是会在PC上进行，等到开发后期的自测阶段再转到安卓模拟器上、转到各种真机上自测，上线了如果出问题还需要在真机上调试测试。

能够访问页面，当然简单，但难在能够访问页面，并能为接下去的调试页面打好基础。

很多公司会有内外网之分，开发环境是在内网，外网访问不到，就需要使用代理工具作一个中转。

某个活动页的开发环境地址是， http://local.abc.com/wx/page-spring ，测试机上估计也会有对应的一个地址 http://test.abc.com/wx/page-spring

为了访问这个页面，在PC的开发机上会设置HOST： 127.0.0.1 http://local.abc.com 12.70.0.1http://test.abc.com

同样的移动端手机为了能够访问，也需要设置HOST，但大部分机型都需要进行ROOT，不可取

使用Fiddler工具，手机设置代理

1. 首先，使手机和PC处在同一个局域网中，查看PC的IP（目前为 11.22.33.44）

2. 开启Fiddler，在 options 中设置 Allow remote computers to connect ， 如果是HTTPS的页面，还需要设置允许HTTPS的解析

 

 

3. 如果是HTTPS，就先在手机上安装Fiddler的证书，在手机浏览器中访问IP:port 然后按照提示进行安装

 

 

4. 在手机的Wi-Fi连接上设置代理，设置成 IP:port

不同手机修改方式不一样，但也类似，一般在更多或者高级修改网络里头

 

 

这样一来，就可以在手机上直接用域名进行访问页面了。

但在手机上设置代理还是稍微麻烦了一点，还可以使用Fiddler的开放端口功能

使用Fiddler工具，开放端口直连

省略上面的第四步，改为使用Fiddler开放一个端口（比如8877），在命令行中执行

 

 

在FiddlerScript脚本面板中添加替换规则，请求前匹配IP:port来进行host转换，然后保存应用

 

 

然后在PC上访问 11.22.33.44:8877/wx/page-spring 试看是否正常转换，再在手机上访问这个链接即可

另外，有些页面需要绑定微信oAuth授权，这些页面上线之后（比如为