用fiddler/浏览器开发工具/apifox实现接口调试

前言：我们在开发/调试的时候如果使用工具可以更方便快捷，了解到更多的细节。

一：为什么需要调试工具

        常见时候，我们会选择在Windows上开发，在linux上部署程序。

        Windows作为图形界面操作系统，更便于编程入门的学习和操作。

        对于web服务，我们需要有合适的调试方法，如果将web服务部署到linux上后，想要调试最好通过合适的工具，所以这里我推荐fiddler，浏览器自带的开发工具，apifox这三个。

二：下载工具

        fiddler：抓包工具Fiddler的下载、安装、配置、基本使用_fiddler下载-CSDN博客

        浏览器开发工具：浏览器自带（这里建议使用google chorme）

        apifox：Apifox安装及使用_apifox安装教程-CSDN博客

三：功能和使用范围

fiddler的功能和使用简介

        fiddler：可以设置hosts代理，让本地通过域名访问IP
        hosts：域名 IP的形式，例如localhost代表访问本地127.0.0.1。

        我对fiddler的主要使用，体现在代理/抓包两个方面。
        首先，fiddler在运行后可以获取所有的接口调用信息，并且会把信息分类展示，我最常用的是成功（200），失败（400-500），跳转（300），url信息，请求头，参数，hosts配置。

         这里给出我个人的建议，仅通过文字来理解协议是相对困难的事情，可以多通过fiddler抓取各种信息，来丰富对http协议的认知，并且在调试接口出现错误的时候，可以通过fiddler抓取，然后分析错误出现的原因。
        先判断调用接口后有没有出现对应的域名和后缀，然后根据后缀判断状态（一般浅灰色的数据可以忽略，也可以设置默认不看浅灰色的数据）。双击左边的对应数据描述，可以打开右边的详细信息，然后分析请求头是否正确，请求参数是否正确，接着判断返回信息中的请求头和返回参数是否符合预期，再结合程序报错和日志分析代码的问题。

        fiddler的第二个功能，代理：通过配置hosts来通过域名访问指定的端口（一般需要确定端口可用），然后再浏览器中直接输入域名便可以在本地访问。
        例如这是正常访问www.baidu.com

        现在我们打开fiddler，点击Tools,然后点击HOSTS,可以看到界面如下。

         可以看到我将www.baidu.com这个域名指向了127.0.0.1然后在域名后面指定端口，成功访问到了我自己编写的web服务。用这种方法，例如我现在通过nginx配置域名代理若干个服务器，我想指定某一个服务器的IP的时候，可以使用上述方法指定IP地址，这个方法便于指定接口测试。

延申：

        只要我们使用网络，有心人就可以通过代理的手法，对正常的网络访问进行干扰，拦截。例如，使用三大运营商的流量，你的每次访问都会被运营商记录下来（这就是所谓的，每个人都是在网络上lou奔），不过大家放心，一般来说，大的运营商并不在意我们做了什么，只要不在网络上违法犯罪，是不会有警察叔叔上门聊天的。
        但是，如果住酒店/吃饭/游玩等时候连接了店家提供的WIFI，店家可以进行以下操作：
        1.修改域名对应的IP，制作界面和QQ，微信，支付宝，各大行.....等涉及重要密码的网站。在你访问的时候直接获取你的账号密码。
        2.不配置域名和IP，但是在服务端返回参数时，向其中添加一些参数等信息。这就是很多小广告之类的来源。

浏览器开发工具

        Chrome的开发者工具（Chrome DevTools）是一套内置于Google Chrome浏览器中的Web开发和调试工具，它为开发者提供了强大的功能，以帮助他们构建、调试和优化网站和Web应用。推荐初学者使用。

        在chrome中右键点击空白处，点击检查。或者使用快捷键Ctrl+Shift+I。可以打开如下界面：我最常用的两个界面（需要学习更多知识请自行搜索）

        chrome相比于其他浏览器，广告少，性能强大，使用便捷，支持的服务类型多。（不能英文转中文太难受了）新手程序员最好养成使用chorme的习惯，并且在接口文档和交付文档中最好提到建议使用chorme。毕竟目前有的程序就是IE上不支持访问。

apifox的功能和使用

        apifox属于我接触的最早的接口调试工具，中文的界面，支持团队协作，小组协作，API文档设计，API调试，API数据Mock，API数据Mock，代码生成。功能丰富，使用简单，界面还挺好看。我在这里粗略讲一下使用流程，让大家有个影响，如果想要详细学习请自行搜索。

 

        上述是使用apifox的基础教程。如果有什么疑问可以随时咨询（更深入的需要仔细研究）

四：接口调试的注意实现和个人经验

        在调试前，检查程序是否运行。
        通过浏览器检查是否可以直接访问。
        准备调试的时候，建议使用APIFOX，可以记录URL和请求参数，设置请求头，cookie等。
        如果在测试过程中出现了问题，先观察程序是否产生了错误/记录了错误日志。
        根据错误日志判断错误原因。
        没有错误或错误日志，可能是接口配置出错，没有成功调用，检查URL和（域名 IP）配置
        如果程序正常运行，参数和URL也正常，但是访问报502，有可能是程序运行时间太长，超过了nginx的默认最大等待时间。