0

我使用react+ react-router+ redux。我想创建一个全局的东西来处理应用程序中抛出的所有错误。是否可以同时捕获API调用错误和401状态？

我在Root.jsx：

window.addEventListener("error", (e) => {});

它适用于我可以记录的严重错误。但是如果我想提供一些API错误怎么办？

例如：我想保存一些网格数据，但是服务器抛出了一个错误，即 10 个给定行中有 3 个没有保存（我知道这是一个常见问题，应该使用事务解决，但我Mongo在这里使用:P）。现在我想为用户显示一个简单的对话框，其中显示错误消息和 3 行未保存。如果我没有权限并且服务器抛出401状态码怎么办？可能我想将用户重定向到索引或登录页面。

这是一些假设的例子，因为我想简化我目前正在实施的事情。

我是新来的React，所以我现在不知道解决方案，但是如果我在 中编写相同的东西Angular，我会用它Angular's HTTP Interceptors来解决我的问题。我想我在这里需要类似的东西（或者也许这是一些常见的解决方案？）。

[编辑]

唔。看来我找到了解决我问题的方法：fetch-intercept

无论如何，您知道其他解决方案吗？

4

1 回答 1

2

我假设您正在使用 ajax 调用来访问您的 API；

我会创建一个看起来像这样的简单 ajax 包装器；

AjaxWrapper = function(options){
    return $.ajax($.extend({}, options, {
        error: function (jqXHR, textStatus, errorThrown){
            if(jqXHR.status === 401){
                browserHistory.push('/unauthorized_route_handler');
            }
            options.error(jqXHR, textStatus, errorThrown);
        }
    }))
}

然后你可以简单地使用这个包装器来调用你的 api，像往常一样传入一个选项对象$.ajax。根据需要更新该部分jqXHR === 401，或添加 403 和 500 的处理程序。

于 2016-05-31T09:36:25.867 回答