最近写东西比较少。
一方面是觉得自己似乎已经把知道的性能相关的内容都写过一遍了,再写重复的,味如嚼蜡。
另一方面是左泽位这小伙很勤快,经常写,保持了公众号的更新,并且篇篇质量都挺好。让我倍感压力。
还好我不至于因此就觉得自己没学习能力了,所以我也在努力成长,不然长江后浪也是很可怕的。
这不,这几天开始整理前端分析工具了。
说起前端分析工具,我翻来翻去。把Chrome/Safari/Firefox/IE....的性能工具翻了一个遍,真是觉得工具五花八门,但是.....
原理没变。
想着也该写个公众号文章了,以让别人知道我在干什么。可是写什么主题呢?
............
并且从历史上的文章来看,一步步基础操作的文章比较受欢迎。所以有了写这篇文章的想法。
我在整理前端工具的时候,发现charles工具还不错,虽说是收费的工具,但是支持的平台挺多。
但是在网上看到挺多文章说charles录制https的时候,都没有把录制android/IOS上的https应用写的非常清楚。在这里一步步写出来给大家参考下。
正文从这里开始。
环境:
1. 首先打开Charles,主界面如下。
2. 查看下代理配置。点Proxy Setting...。
同时把录制按钮点亮(其实默认就是亮的)。
这个端口要记住,默认是8888。
3. 安装Charles自己的根证书。
点击Help>SSL Proxying>Install Charles Root Certificate。
4. 查看下keychain中的Charles证书是否始终信任。
5. 保存Charles的根证书。点击Help>SSL Proxying>Save Charles Root Certificate。(保存到哪里不用我说了吧?要一定要说的话,那就是随你的便!)
6. 查看下本地IP。点击Help>Local IP Address。
以上都是电脑上的准备工作,下面开始配置手机。因为IOS和Android的配置有不同,所以这里,分成两部分写。
2. 在手机上配置了上一步之后,在电脑上会出现如下提示。这肯定是点Allow了。
3. 在手机上输入一个https的网址时会出现如下提示。点击信任。
这一步还有另一个方法,就是点击设置->通用->关于本机->证书信任设置-> 找到charles proxy custom root certificate,然后开启信任。
4. 在手机上打开https的页面。在电脑上查看录制效果。
左边是电脑上Charles的录制结果;左边是手机上的打开的页面。
2. 在手机上配置了上一步之后,在电脑上会出现如下提示。这肯定是点Allow了。
3. 在手机上安装证书。
3.1. 把保存的根证书文件传到手机上。(我是用微信的文件传输助手传的,你想用什么就随便了,前提是你能找得到文件保存在哪里了。)
3.2. 点击Install from SD card,找到证书文件(下面右图最上面的一个文件)。
3.3. 输入屏保密码和证书名。
我知道这里会有人问,为啥这一步要用拍的图,而不是截的图呢?哈哈。这就是因为呀,手机上不允许在这一步直接用截图功能!
4. 在手机上打开https的页面。在电脑上查看录制效果。
左边是电脑上Charles的录制结果;左边是手机上的打开的页面。
正文至此完。
在这个没有讲虚幻的原理和逻辑的文章中,一步步的操作是不是让你有很脚踏实地的感觉?
其实我强忍着没有写charles的抓包原理和逻辑(其实就一个proxy,有啥好讲的呢)。
这样的抓包过程,并不是原理有多复杂,而是逻辑有点绕(不是操作上感觉逻辑绕,而是解释逻辑起来有点绕),点开了也不难懂,就是网络中的数据包是怎么走的。只要明白这一点,管它是什么手机,管他是什么系统在运行类似这样的抓包工具,都是可以配置得出来的。