angular HTTP 身份验证：未收到浏览器登录提示

Question

在我的 angular 应用程序中，我正在尝试进行基本的 HTTP 身份验证。

我最初从 angular 发送 http get 请求时没有任何凭据，因为我假设当后端发送 401 状态时，浏览器会要求我提供凭据，然后自行重新提交请求.

但是从不显示浏览器登录提示。这是我得到的错误：

angular.js:11756 GET http://localhost:8080/appName/rest/keys/Keys?batch=0&userName=Test 401 (Unauthorized)

这些是我收到的 headers 回复：

Access-Control-Allow-Credentials:true
Access-Control-Allow-Headers:origin, content-type, accept, authorization
Access-Control-Allow-Methods:GET, POST, PUT, DELETE, OPTIONS, HEAD
Access-Control-Allow-Origin:http://localhost:3001/
Content-Length:0
Date:Tue, 09 Aug 2016 14:53:26 GMT
Server:Apache-Coyote/1.1
WWW-Authenticate:Basic

本来希望浏览器在遇到状态401时自动出现提示，但是这里好像不是这样。我错过了什么吗？

编辑：

它在 Chrome 和 Firefox 中不工作，但在 IE 中工作，当我尝试访问 url 时，IE 显示登录提示，并且使用用户名和密码可以正常工作，而 Chrome直接给出401错误。

如果我尝试直接从地址栏访问服务器 url，然后 Chrome 会显示登录提示并要求我提供凭据。不确定，但这可能是 CORS 问题吗？

Answer 1

好的，我能够解决问题。

这个问题确实与 CORS 有关，但没有直接关系。此外，它在 IE 上工作，因为 IE 不尊重 CORS，并且无论如何都会让你访问跨源。

缺少两件事：

最初我从服务器发送（连同其他 headers）Access-Control-Allow-Origin : *，以启用 CORS。然后我知道了这个：

Firefox and Chrome require exact domain specification in Access-Control-Allow-Origin header. For servers with authentication, these browsers do not allow "*" in this header. The Access-Control-Allow-Origin header must contain the value of the Origin header passed by the client.

https://www.webdavsystem.com/ajax/programming/cross_origin_requests/

然后出现与跨源浏览器身份验证相关的问题：

By default, in cross-site XMLHttpRequest invocations, browsers will not send credentials. A specific flag has to be set on the XMLHttpRequest object when it is invoked.

https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS#Requests_with_credentials

这个具体的flag是withCredentials : true，需要和xhr请求一起设置。我设法用来自 angular 应用程序的 http 请求设置了它，瞧，它成功了！

angular HTTP 身份验证：未收到浏览器登录提示

angular HTTP auth: not getting browser login prompt

browser

http-authentication

http-headers

angularjs