在通知中显示 API 错误

Question

我在文档中缺少一些基本的东西。当我收到 API 验证错误时，我会返回一个状态代码和消息。看起来 React-Admin 正在将状态代码转换为通用的 HTTP 错误代码。

我的错误响应。

{"error":
    {"statusCode":422,
    "name":"Error",
    "message":"User with same first and last name already on team."}
}

当我的 API 响应该响应时，我在通知框中看到“不可处理的实体”。我正在使用 SimpleForm。

我知道状态代码正在被识别，因为我已经更改了 422 并且它显示了相应的 HTTP 错误描述。

在文档中它说在你的数据提供者中抛出和错误。我已经将 Simple Rest 数据提供程序移到我的项目中，并尝试在各个地方抛出错误，但客户端没有任何变化。

https://marmelab.com/react-admin/DataProviders.html#error-format

如果您从您的 API 中自定义了错误，我很感激您提供的任何提示。谢谢。

Answer 1

下面是实际的错误处理：

1. 当 fetch 被触发时（通常来自数据提供者），如果发生错误，它会被捕获并转换为 anHttpError并重新抛出（source）
2. 在此过程中，HTTP 错误消息变为json.message或 响应statusText。在这里，422 HTTP 错误变成了Unprocessable Entity（来源）
3. 然后在更高级别再次捕获错误以转换为 redux action。（来源）
4. 最后，错误被转换为包含错误消息的通知。

因此，为了自定义您的错误消息，您可以通过首先捕获错误、自定义错误消息并再次发送它来轻松地从您的自定义提供程序执行此操作：

const dataProvider = (type, resource, params) => new Promise((resolve, reject) => {
    if (type === 'GET_LIST' && resource === 'posts') {
        return fetch(...args)
            .then(res => res.json())
            .then(json => {
                if (json.error) {
                    // The notification will show what's in { error: "message" }
                    reject(new Error(json.error.message));
                    return;
                }

                resolve(json);
            });
    }

    // ...
});