如何利用chrome和firefox进行接口分析

冷不防 2022-03-10 11:40 307阅读 0赞

有时候，我们可能看到了比较好的资源网站，就想把它的接口抽象出来，然后存起来，收藏下来。供我们自己去调用。  
这往往离不开利用浏览器去分析接口。

因为我们一开始无法判断页面上的数据到底是局部渲染出来的、后端绑定的还是利用后端返回的js，然后再进行渲染的（指的是并不在页面里面，而是在 < s c r i p t > <script> <script>标签里面的）。利用firefox，点开页面和开发者工具，刷新一下，  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3hpZWxpbnJ1aTEyMw_size_16_color_FFFFFF_t_70]  
得到这些请求，不过，这里使用的是百度，我们可以在自己希望的页面中来这样做。如果需要获得接口，首先可以忽略那些框架类的js文件的请求，然后再来寻找。不过此时，可以借助另一个地方，就是网络  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3hpZWxpbnJ1aTEyMw_size_16_color_FFFFFF_t_70 1]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3hpZWxpbnJ1aTEyMw_size_16_color_FFFFFF_t_70 2]  
如果找到了这种返回Json的接口，可以先存起来，不一定有用。去除掉所有这些json的接口之后，可能还留下一些页面的基础js文件，这个时候就需要细细的浏览代码了。

看源码之后可能会遇到一些问题，比如某个变量定义为全局变量，我找不到定义在哪，办法是在console中打印出来。例如：  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3hpZWxpbnJ1aTEyMw_size_16_color_FFFFFF_t_70 3]  
如果需要在全局搜索某些值在哪出现了，可以通过 chrome的搜索功能，默认快捷键是 ctrl+shift+F ，不过这和搜狗输入法的默认快捷键冲突了，所以还是手动去点吧（因为冲突太多了，比如 idea 里面也有 ctrl + shift + F的全局搜索）。

如果你发现有个地方调用了某个方法，但是确实也没有找到那个方法的实现方法。也可以在console中输出：

demoObject.demoFuntion.toString()

接口分析最麻烦的还是读请求的过程，再利用这些快捷的方法，会事半功倍一些

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3hpZWxpbnJ1aTEyMw_size_16_color_FFFFFF_t_70]: /images/20220310/c00f29fd5b0049ca8c78ab2e667df180.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3hpZWxpbnJ1aTEyMw_size_16_color_FFFFFF_t_70 1]: /images/20220310/ccc009dfad4640b5acaae0b398966ad3.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3hpZWxpbnJ1aTEyMw_size_16_color_FFFFFF_t_70 2]: /images/20220310/aa9d5580a8624f9f9e22714ba3100653.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3hpZWxpbnJ1aTEyMw_size_16_color_FFFFFF_t_70 3]: /images/20220310/b840f81853404e46b907d7dcbd0a8d10.png