如何在ios和android应用(application)中调试

Posted on | In |

前言

作为一名前端工程师，经常会出现在浏览器好好的，结果到手机上就不行了，还不知道该怎么做，pc端可以用f12看报错，手机端就没办法，那该怎么办呢？
接下来将带学习大家如何android和ios中如何调试

一.android 真机调试


1.先决条件:app中开启了 WebView.setWebContentsDebuggingEnabled(true);
2.windows电脑或者mac电脑均可

1.真机一台(android4.4之上)，先下载一个google浏览器
2.连上usb线，选择传输文件或者照片
3.在电脑google上面输入chrome://inspect/#devices 如下图所示
4.在app(需要原生提供一个webView)中输入地址 我这边用的本机ip地址
http://172.16.33.33:3330/demo/demo
inspect
5.点击inspect进入，就会看到熟悉的调试界面
debugger
6.接下来就可以在当中按浏览器的操作进行debugger以及查看console的一些报错，是不是感觉很开心
7.需要特别注意的是，需要翻墙才行，如果不能翻墙，啥都打不开
8.具体翻墙教程，我这边提供一个第三方不错的教程,自己动手搭建SS服务器科学上网 https://www.yigeni.com/build-a-wall-ss-server/

二.ios 真机调试

1.需要一台Mac电脑和iphone手机，这个是先决条件
2.开启Safari开发菜单,Safari -> 偏好设置… -> 高级 -> 勾选在菜单栏显示“开发”菜单。
safari
3.iPhone开启Web检查器,具体步骤为：设置 -> Safari -> 高级 -> Web 检查器。
safari


4.打开app,随便打开一个地址注意，需要用xcode的开发者模式
safari
5.正常一般可能没办法用app查看，用safari进行直接调试，具体步骤为: Safari -> 输入地址 -> 重复上面的4步骤
safari
safari