移动网络下的页面调试

以前我们调试移动端的时候,一般都是在谷歌浏览器直接用模拟器打开,先保证所有的逻辑都跑的通。

接着我们可能就会用代理,将手机代理到本地主机,设置host,保证各个机型的兼容问题,再次检查程序的功能和逻辑。

当以上都完全跑通之后,基本也差不到哪里去了,但是一般QA还是会在移动网络下对所有功能再进行一次调试。

今天我想说的一个就是如何在移动网络下审查你的页面。

也许你会问,为什么非要移动网络。不知道你们注意过没有,打开http网页的时候,经常会出现一些弹框或者流量球一样的东西,这时你就应该开始反应过来,这应该属于运营商对你页面插入的代码,也叫做运营商劫持。

哦,忘了说,只能android

需要什么

  1. pc端安装最新的chrome(54+)
  2. 手机端安装最新的chrome (Android机) (54+)
  3. USB连接线

Tip:之前的的chrome如果要实现这种调试需要安装一个ADB插件(需要FQ) 但是最新的chrome已经直接支持对Android的识别 所以也不用再在chrome上安装ADB插件了 但需要下载最新的chrome

假设你准备好了

  1. USB设置 在你的手机里打开”设置”->”开发人员工具”->”USB调试” 打开USB调试。

  2. 假设你已经将手机设置为”USB调试”打开的状态 将手机连接到电脑 手机会弹出一串连接码,并询问你是否链接,点击确定

  1. 打开电脑的chrome 在地址栏输入 chrome://inspect 选中 Discover USB devices 可以检测到你的设备

4.打开手机上的chrome

image

上图可以看到手机上chrome打开的页面 此时我手机上打开过一个网页

6.点击inspect

7.可以点击弹出的审查元素框右上角的方形小图标切换到视图模式 这时会把你手机打开的页面拉到pc上显示

image

评论

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×