使用 fetch api 处理 500 响应 [英] Handle a 500 response with the fetch api

问题描述

我们有以下对 fetch 的调用.

We have the following call to fetch.

this.http.fetch('flasher', { method: 'post', body: jsonPayload })
    .then(response => response.json())
    .then(data => console.log(data));

这在我们收到 200 响应时有效，但在我们收到 500 响应时不会向控制台记录任何内容.我们如何处理500?

This works when we receive a 200 response but logs nothing to the console when we receive a 500 response. How do we handle a 500?

推荐答案

工作解决方案

将 then 与 catch 结合使用.

fetch('http://some-site.com/api/some.json')  
  .then(function(response) {                      // first then()
      if(response.ok)
      {
        return response.text();         
      }

      throw new Error('Something went wrong.');
  })  
  .then(function(text) {                          // second then()
    console.log('Request successful', text);  
  })  
  .catch(function(error) {                        // catch
    console.log('Request failed', error);
  });

详情

fetch() 返回一个包含 Response 对象的 Promise.Promise 可以变为已完成或已拒绝.Fulfillment 运行第一个 then()，返回它的 promise，然后运行第二个 then().拒绝抛出第一个 then() 并跳转到 catch().

Details

fetch() returns a Promise containing a Response object. The Promise can become either fulfilled or rejected. Fulfillment runs the first then(), returns its promise, and runs the second then(). Rejection throws on the first then() and jumps to the catch().

MDN - 承诺

MDN - 检查提取是否成功

Google - Fetch 简介

这篇关于使用 fetch api 处理 500 响应的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！