速成班101
10 模块
5 周数

网络请求

点击复制

追踪网络要求的详细信息


Developer Tools 的另一个有用部分是 Network.在它里面,你可以跟踪所有的网络请求和关于它们的详细信息,并解析收到的答案。让我们看一下关于国家信息的表格的例子。它是在模块8中创建的,我们可以肯定的是,一个 GET我们知道必须有一个请求来填充这个表。让我们打开相应的页面,确保请求确实被发送并正确组成。

这个表是正确的,它是自动填入的,因此发送请求的事实本身没有疑问。确实可以看到在 Network部分。但它的潜在缺失可能只是给出了一个答案,即为什么在表中没有数据。在这种情况下,就会变得很清楚,你需要寻找没有请求的原因 GET请求的原因(可能的选项:没有设置正确的发送触发器;没有发生激活触发器的事件;业务流程的编译有错误)。

为了更方便地显示必要的信息,你可以立即激活 Fetch / XHR过滤器(在这个阶段不需要的各种服务请求将不被显示),甚至使用关键字搜索。

Headers

在这里你可以解析请求的所有细节,并确保它是正确的。在这个例子中,在 Headers标签(General -> Request URL),请求被完全显示出来,并带有使用的参数。

我们可以验证参数是否设置好了。

  • _offset=0-数据被要求按原样,从一开始就没有缩进。
  • _with=1- 除了国家的信息外,还要求提供相关表格的信息(在这种情况下,1意味着获得城市的信息)
  • _limit=10- 请求只限于前10个元素
  • _sort_order=ASC- 按升序排列的数据
  • _sort_by=name- 按名称排序的数据

同样的参数可以在 Payload选项卡上看到同样的参数。当需要详细研究请求的组成时,它是相关的。这通常是在发送 POST请求时经常需要这样做,当一个模型对象被传递到数据库进行写入时,你需要详细考虑它的结构。

Preview

但最大的兴趣往往不是请求本身,而是对它的回答,即请求的结果。你可以看到它以结构化的形式出现在 Preview标签上。

在这个例子中,你可以看到,在响应中收到了三个国家的信息。你还可以看到它们的名称、描述、相关城市的数据,以及各种服务信息(ID、创建时间、修改时间等)。这里没有任何数据将解释为什么这个数据也不在表中(这意味着你需要了解这个数据应该是由什么业务流程获得的)。反之亦然,额外数据的存在将清楚地表明,该表可以做得更详细。

Was this article helpful?
还在寻找答案吗?
加入社区