preventing HTTP使用基本身份验证对话框AngularJS拦截器 [英] Preventing HTTP Basic Auth Dialog using AngularJS Interceptors

问题描述

我要建一个AngularJS有一个RESTful API（1.2.16）的Web应用程序，我想送401未经授权的响应提出的申请认证信息无效或present。当我这样做，即使是一个HTTP拦截器present，我看到了浏览器的presented当一个AJAX请求通过AngularJS做出基本的身份验证要求对话框。我的拦截器运行的在的该对话框，这是来不及做一些有用的事情。

I'm building an AngularJS (1.2.16) web app with a RESTful API, and I'd like to send 401 Unauthorized responses for requests where authentication information is invalid or not present. When I do so, even with an HTTP interceptor present, I see the browser-presented basic "Authentication Required" dialog when an AJAX request is made via AngularJS. My interceptor runs after that dialog, which is too late to do something useful.

一个具体的例子：

我的后台API返回401 / API /事情，除非授权令牌是present。尼斯和简单。

My backend API returns 401 for /api/things unless an authorization token is present. Nice and simple.

在AngularJS应用程序方面，我看了看文档和设置像这样的配置块中的拦截器：

On the AngularJS app side, I've looked at the docs and set up an interceptor like this in the config block:

$httpProvider.interceptors.push(['$q', function ($q) {
  return {
    'responseError': function (rejection) {
      if (rejection.status === 401) {
        console.log('Got a 401')
      }
      return $q.reject(rejection)
    }
  }
}])

当我打开我的应用程序，删除认证令牌，并执行一个AJAX调用 / API /事情（有希望触发上述拦截器），我看到这样的：

When I load my app, remove the authentication token, and perform an AJAX call to /api/things (to hopefully trigger the above interceptor), I see this:

如果我取消对话框中，我看到了的console.log 输出得到了401，我希望看到的，而不是该对话框中的 ：

If I cancel that dialog, I see the console.log output of "Got a 401" that I was hoping to see instead of that dialog:

显然，拦截器的工作，但它拦截为时已晚！

Clearly, the interceptor is working, but it's intercepting too late!

我看到网络上关于与中就是这样的情况下AngularJS认证无数的职位，他们似乎都使用HTTP拦截器，但它们都没有提到基本身份验证对话框弹出。一些错误的想法我已经为它的外观包括：

I see numerous posts on the web regarding authentication with AngularJS in situations just like this, and they all seem to use HTTP interceptors, but none of them mention the basic auth dialog popping up. Some erroneous thoughts I had for its appearance included:

• 缺少的Content-Type：对响应应用程序/ JSON 头？不，它的存在。
• 在需要返回的东西比承诺拒绝其他？这code始终运行对话框后，无论什么被退回。

• Missing Content-Type: application/json header on the response? Nope, it's there.
• Need to return something other than promise rejection? That code always runs after the dialog, no matter what gets returned.

我缺少一些设置步骤或使用不正确的拦截器？

Am I missing some setup step or using the interceptor incorrectly?

推荐答案

想通了！

诀窍是要发出一个 WWW验证响应值不是基本其它头。然后，您可以捕捉401基本 $ HTTP 拦截器，或者一些更聪明的象的角HTTP-auth的。

The trick was to send a WWW-Authenticate response header of some value other than Basic. You can then capture the 401 with a basic $http interceptor, or something even more clever like angular-http-auth.

这篇关于preventing HTTP使用基本身份验证对话框AngularJS拦截器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！