iPhone页面的常用调试方法

在iPhone中调试,大体上与上文 安卓中的移动页面调试 类似,区别主要是iOS系统中的一些限制,导致某些工具无法使用。

本文基于此,简要介绍在iPhone中如何调试页面。

最终可以实现在Mac平台使用Safari(或结合ios_webkit_dubug_proxy使用Chrome)调试手机中Safari的页面,结合Charles进行抓包请求断点,再通过微信ipa包重签名来调试微信的WKWebView

在Windows中结合Fiddler与ios_webkit_debug_proxy中转实现Chrome调试手机的Safari浏览器

一、能够访问页面

某些页面需要设置HOST才能进行访问,在iPhone上不好设置HOST,所以需要一些代理工具帮助我们

除了Windows平台中常用的代理调试工具Fiddler之外,还可以使用Mac中的常用代理工具 Charles

Fiddler

与上文类似,在iPhone中的WiFi设置里面,设置代理为Windows的 ip:host,如果需要访问HTTPS的页面还需要设置证书

Charles

在手机上设置好代理后,访问页面时在Charles中统一请求接入即可

当需要进行HTTPS页面的访问时,也需要在Mac和iPhone中都设置好证书

安装后可在Mac证书列表中看到

并设置相关的域

根据Charles的提示,手机连接代理之后访问 chls.pro/ssl 安装证书,再访问即可

而对于某些需要账号授权登陆的页面,涉及到Cookie的模拟登录,可以使用这两个代理工具进行设置

在Fiddler中可以按前文安卓的配置

在Charles中也有对应的方法

二、审查元素查看页面输出

可以使用Chrome的设备模拟来查看页面

不过对于iPhone的调试,还需要进行真机的页面查看

一般来说,iPhone中的页面是在Safari浏览器中查看的

微信中的内置浏览器是WKWebView内核或 UIWebView ,WKWebView的版本依赖于IOS的版本。其中 UIWebViewer 只是系统浏览器的一部分组建,功能不全或有所 限制

所以某些情况下可直接在手机的Safari浏览器进行查看调试,某些情况还是少不了在微信内置浏览器中进行

Safari远程调试

这个方法需要结合Mac的Safari浏览器使用,通过Mac与iPhone进行连接来调试

手机上访问某个页面,选取进行调试,将会打开Safari的开发者工具,可以看到熟悉的几个面板

除了审查元素查看日志之外,还可进行脚本的断点调试,查看网络请求等操作。

不过功能相对Chrome DevTools来说,相对简单了些,对于简单的页面可直接使用

对于高版本的iOS系统(如iPhone 7),进行远程调试的Mac主机的系统版本也有限制,并非任何Mac和iPhone之间都能进行调试

此外,这种远程调试仅支持调试手机的Safari浏览器,无法调试微信的内置浏览器

基于Weinre的调试

参考前文

基于微信开发者工具的调试

参考前文

与前文类似,这两种方法都能进行基础的页面信息查看,不支持HTTPS,使用spy-debugger可支持HTTPS

基于 spy-debugger 的调试

参考前文,设置好相应的HTTPS证书

基于 ios-webkit-debug-proxy 的调试

Mac上的safari调试功能不够好,而且不能调试微信中的页面,使用weinre只能简单地调试微信页面,无法进行脚本断点等高级功能

最好的办法莫过于让iPhone可Chrome Devtools进行连接,充分利用好的调试工具与现有的平台,进行调试。

ios-webkit-debug-proxy 支持多平台,这么来说我们可以不借助Mac主机实现调试iPhone的需求。不过配置过程稍微有些繁琐

在Mac中安装

在前面install前面加上参数是因为brew的update太慢了,手动设置成不需要update

另外,可以看到报错了,在这里设置权限即可

在手机打开某个页面,然后访问 localhost:9221 ,即可进行调试

或者之间在chrome中输入 chrome://inspect 也可看到相应信息

美中不足还是无法检测微信中的页面

在Windows中配置

在windows中配置相对麻烦了些,首先需要安装powershell(win10中已经自带),然后安装 scoop ,再安装这个插件

同样地,访问相应的页面

或者使用Chrome自身的DevTools来调试,即可实现在Window中调试手机Safari页面(然而还是不支持微信内置的)

调试微信内置的webview

要调试微信内置的webview,就需要对其进行重签名打包, 让iOS觉得我们是微信这个APP的开发者(苹果的限制太多了)

相关链接  相关链接

相关步骤:

在现有证书基础上(如果没有证书需要自己设置)

1. 下载 IPAPatch,解压。

可以看到如下文件信息

2. 下载越狱版的微信ipa(尽量通过正规渠道获取,也可直接在PP助手下载,下载的时候不要连接手机)

ipa是iOS的应用程序文件包,类似安卓中的apk,正常版本的带有加密信息,打包后会出问题,越狱版已经去壳,可以签入我们的证书

3. 将 IPAPatch文件夹中的 /Assets/app.ipa 替换成这个微信 ipa

4. 用XCode打开 /IPAPatch.xcodeproj

5. 设置 一个新的 BundleID,选用AppleID Team,设置Code Signing,选择真机 target,然后运行安装即可

遇到报错信息就按提示进行解决

可能遇到的问题有:

no matching provisioning profiles found   确认是否配置了证书,简单的操作可以直接按提示进行fixed

Code signing is required for product type ‘Framework‘ in     不要忘了设置Framework中的签名

Xcode: failed to get the task for process  打开应用是会伴有闪退现象。 签名需要使用开发版(iOS Developer),不要使用发布版(iOS Distribution),ipa包需使用越狱版

Xcode “Device Locked” When iPhone is unlocked   记得在手机上选择信任电脑

could not find developer disk image   低版本的XCode不包含新版iOS的系统依赖,需要更新XCode为最新版,或者直接下载对应的包,放到XCode的包目录中

安装成功后一直停留在启动画面 可能是XCode开启了调试断点功能,取消即可

安装之后原有微信应用打不开了,如果使用不恰当的ipa包,会有意外的副作用,所以得谨慎选择ipa包

安装成功后,即可打开新的微信使用

登陆后,访问相关页面,就可以调试webview了

方法同上,可在Mac上使用Safari来调试内置浏览器的页面,公众号,小程序等

或者,直接使用我们的windows系统,开启 ios_webkit_debug_proxy 后,在Chrome中调试即可

原文地址:https://www.cnblogs.com/imwtr/p/8675701.html

时间: 2024-10-08 09:31:32

iPhone页面的常用调试方法的相关文章

VC的常用调试方法

前言 VS是非常强大的IDE,所以掌握VSVC的常用方法,将会使得我们找出问题解决问题事半功倍. 目录 VSVC的常用调试方法 前言 1. Watch窗口查看伪变量 2. 查看指针指向的一序列值 3. 内存泄露查找 4. 调试Release版本 5. 远程调试 6. 函数断点 7. 数据断点. 8. 代码执行时间 9. 格式化数据 10. 格式化内存 Watch窗口查看伪变量 按MSDN的介绍,伪变量就是用来查看特定信息的术语.例如当调用的API失败时,可以用GetLastError获取对应的错

linux 下C/C++程序常用调试方法(gdb)

 不管是在开发或者运行过程中,调试保证程序正常运行最基本的手段,熟悉这些调试方式,方便我们更快的定位程序问题所在,提高开发效率. 一 程序正常运行调试 (1)  直接使用gdb 开发过程中最常用的方式,我们可以在其过程中给程序添加断点,监视等辅助手段,监控其行为是否与我们设计相符,比如: (2)      程序已经运行,通过attach附加到进程 二 程序中断后调试 首先简单介绍下linux 下的信号: 软中断信号(signal,又简称为信号)用来通知进程发生了异步事件.进程之间可以互相通过

Matlab的常用调试方法

M程序调试器的热键设置和VC的设置有些类似,如果用户有其他语言的编程调试经验,则调试M程序显得相当简单.因为它没有指针的概念,这样就避免了一大类难以查找的错误. 不过,M程序可能会经常出现索引错误,如果设置了 stop if error( Breakpoint 菜单下),则程序的执行会停在出错的位置,并在MATLAB命令行窗口显示出错信息.下面列出了一些常用的调试方法. (1)设置或清除断点:使用快捷键F12: (2)执行:使用快捷键F5; (3)单步执行:使用快捷键F10: (4)step i

(转载)VS2005常用调试方法集

1.如何在Release状态下进行调试 Project->Setting=>ProjectSetting对话框,选择Release状态.C/C++标签中的Category选General,Optimizations选Disable(Debug),Debut info选Program Database.在Link标签中选中Generate debug info复选框. 注:只是一个介乎Debug和Release的中间状态,所有的ASSERT.VERIFY都不起作用,函数调用方式已经是真正的调用,

Eclipse常用快捷键和调试方法

原文链接:http://my.oschina.net/u/1054538/blog/741561 常用快捷键 Eclipse最全快捷键,熟悉快捷键可以帮助开发事半功倍,节省更多的时间来用于做有意义的事情. Ctrl+1 快速修复(最经典的快捷键,就不用多说了) Ctrl+D: 删除当前行 Ctrl+Alt+↓ 复制当前行到下一行(复制增加) Ctrl+Alt+↑ 复制当前行到上一行(复制增加) Alt+↓ 当前行和下面一行交互位置(特别实用,可以省去先剪切,再粘贴了) Alt+↑ 当前行和上面一

eclipse常用快捷键及调试方法(虽然现在看不懂,但是感觉以后肯定会用到,先转了)

常用快捷键 Eclipse最全快捷键,熟悉快捷键可以帮助开发事半功倍,节省更多的时间来用于做有意义的事情. Ctrl+1 快速修复(最经典的快捷键,就不用多说了) Ctrl+D: 删除当前行 Ctrl+Alt+↓ 复制当前行到下一行(复制增加) Ctrl+Alt+↑ 复制当前行到上一行(复制增加) Alt+↓ 当前行和下面一行交互位置(特别实用,可以省去先剪切,再粘贴了) Alt+↑ 当前行和上面一行交互位置(同上) Alt+← 前一个编辑的页面 Alt+→ 下一个编辑的页面(当然是针对上面那条

eclipse 常用快捷键及调试方法

原文链接:http://my.oschina.net/u/1054538/blog/741561 常用快捷键 Eclipse最全快捷键,熟悉快捷键可以帮助开发事半功倍,节省更多的时间来用于做有意义的事情. Ctrl+1 快速修复(最经典的快捷键,就不用多说了) Ctrl+D: 删除当前行 Ctrl+Alt+↓ 复制当前行到下一行(复制增加) Ctrl+Alt+↑ 复制当前行到上一行(复制增加) Alt+↓ 当前行和下面一行交互位置(特别实用,可以省去先剪切,再粘贴了) Alt+↑ 当前行和上面一

JavaScript封闭函数、常用内置对象、js调试方法

1.封闭函数 封闭函数是JavaScript中匿名函数的另外一种写法,创建一个一开始就执行而不用命名的函数 /在封闭函数前加';',可以避免js压缩时出错/;(function(){ alert('hello world!'); })(); /*当i大于78时等于78,小于时等于89*/ var i = 90>78?78:89; alert(i); /*第二个写法*/ !function(){ alert('hello world!'); }(); /*第三个写法*/ ~function(){

iOS开发——调试篇&Xcode常用调试技巧

Xcode常用调试技巧 Enable NSZombie Objects(开启僵尸对象) Enable NSZombie Objects可能是整个Xcode开发环境中最有用的调试技巧.这个技巧非常非常容易追踪到重复释放的问题.该技巧会以非常简洁的方式打印指出重复释放的类和该类的内存地址. 怎么开启僵尸对象呢?首先打开“Edit Scheme”(或者通过热键?<),然后选择Diagnostics选项卡,勾选Enable NSZombie Objects选项. 现在我们可以关掉ARC来测试重复释放的问