angularjs - 捕获 AngularJS / Angular-ui-routing HTTP 错误以便采取行动

Question

我使用 Angular 1.3.14 开发了一个 AngularJS 应用程序 (SPA)。

我已经使用 Angular-ui-router (0.2.15) 设置了我的路由。

SPA 基本上分为两个部分；(1) “网站”，即所有公开的东西；(2) 需要SessionID在标头中有效的“应用程序”。否则，它会引发 HTTP 401。

一切都运行得相对良好，并且符合预期。只要我有一个有效的 SessionID。如果我的 SessionID 已过期（或未提供），则返回 HTTP 401（根据需要）。

由于我使用带有templateUrlandcontroller选项的 Angular-ui-routing，所有页面（视图）都会自动加载。

所以我不太确定我将在哪里/如何拦截 HTTP 401 以便适当地重定向到登录页面。现在它们被默默地忽略并且页面（视图）没有加载。

我想捕获 HTTP 401 错误（或至少其中一个）并向用户提供有效消息（即：“会话已过期”或“需要登录”或重定向到登录页面后的其他内容。

提前致谢。

---

更新：2018.10.04 21:44

我发现了以下内容：

$rootScope.$on('$stateChangeError', function(event, toState, toParams, fromState, fromParams, error) {
    console.log("State change error:");
    console.log(" > Event      : ", event);
    console.log(" > toState    : ", toState);
    console.log(" > toParams   : ", toParams);
    console.log(" > fromState  : ", fromState);
    console.log(" > fromParams : ", fromParams);
    console.log(" > error      : ", error);
    //event.preventDefault();
});

有趣的是，该error参数包含以下内容：

  > error :  {data: {…}, status: 401, headers: ƒ, config: {…}, statusText: ""}

这允许我这样做：

if (error.data.success === false) {
  console.log("Redirecting to 'Sign-in' page...");
  $state.go('sign-in');
}

剩下的唯一问题是我有很多关于状态的视图，虽然我可以捕获错误并重定向，但所有其他视图仍然发送到服务器并失败。这是因为它们都是并行发送的吗？会继续挖！

标签： angularjsangular-ui-router