JS Fetch - 无法从 BadRequest 响应中获取数据 [重复]答案

【问题标题】：JS Fetch - cannot get data from BadRequest response [duplicate]JS Fetch - 无法从 BadRequest 响应中获取数据 [重复]
【发布时间】：2019-07-20 00:47:00
【问题描述】：

我在客户端使用 React + Redux，我在 NET CORE 中有后端。客户端使用以下方式从 API 获取数据：

        return fetch(`api/login`, requestOptions)
        .then(response => {
            if(!response.ok) {
                return Promise.reject(response.json() as Promise<AuthError>);
            } else {
                return response.json() as Promise<ILoginResponse>
            }
        })

requstOptions 是：

        const requestOptions = {
        method: 'POST',
        headers: {
            'Accept': 'application/json', 
            'Content-Type': 'application/json' },
        body: JSON.stringify({ username, password })
        };

密码错误时，服务器返回

404 Bad request

而正文是：

{"errorCode":2,"description":"Invalid Password"}

我想阅读正文，但使用此代码，这是不可能的，因为 response.json() as Promise<AuthError> 产生一个空对象。有没有办法读取错误请求响应的正文？

【问题讨论】：

“当密码错误时，服务器返回404 Bad request” - 哎呀。设置这个的人有没有得到他们适当的殴打呢……？ :-)
@04FS 对不起，我没听懂你在说什么，你能解释一下吗？
HTTP 状态码有一个明确的含义，对于 404，这不是找到。因为提供的凭据不匹配而用它来回答任何请求是相当错误的。 401 Unauthorized 会更合适。（实际的错误请求是 400 - 但这是针对客户端发送服务器根本无法理解的数据的情况；仅仅错误的凭据也不能证明这一点。）
你用一个承诺来拒绝你的承诺。你想用AuthError 拒绝它。
@Bergi 但是当我输入return Promise.reject(response.json() as AuthError); 时，它说将“Promise”类型转换为“AuthError”类型可能是一个错误......并且无法编译。

标签： javascript reactjs ecmascript-6 redux es6-promise

【解决方案1】：

根据Fetch Documentation：

"从 fetch() 返回的 Promise 不会拒绝 HTTP 错误状态，即使响应是 HTTP 404 或 500。相反，它会正常解析（ok 状态设置为 false），它只会拒绝在网络故障或任何阻止请求完成的情况下。”

您还可以查看响应对象文档。在那里，您可以检查 Response ok 是否设置为 false（因此，在 then 子句中检查 response.ok），然后您可以检查 Response.text 属性。还要检查Response Documentation

【讨论】：

【解决方案2】：

您是否尝试过使用catch 然后检查错误对象？

...
.then(response => response.json())
.then(response => console.log('Success:', JSON.stringify(response)))
.catch(error => console.dir(error));

【讨论】：

我试过了，结果还是空对象。