javascript – 浏览器应该缓存通过Ajax发送的HTTP Auth凭证吗？

我正在构建一个限制访问的静态网站.我已将服务器配置为使用HTTP Basic Auth保护子文件夹(例如www.example.com/restricted).
现在,我不想使用标准的浏览器弹出窗口进行登录,因为它很难看并且不记得跨会话的密码.它很难看,我提到了吗？ =)

所以,我正在显示一个html表单,并尝试通过JavaScript进行身份验证(这里,在jQuery的帮助下,但“原始”版本显示相同的行为).我调用的函数看起来像

try_login = function(username,password){
  $.ajax({
      url: '/restricted/login.token',method: 'GET',beforeSend: function(request) {
          request.setRequestHeader(
             'Authorization','Basic ' + Base64.encode(username + ':' + password));
      },success: function () { window.location='/restricted/'; },error: function () { $('#error_message').text("Wrong password."); }});

}

现在,身份验证适用于ajax请求.如果我使用正确的用户名和密码,则“login.token”正确提供,状态代码为200,如果不使用,我将获得401.

但浏览器(我测试过Chrome 28和IE 10)再次询问成功回调中重定向后的凭据.它似乎没有保存凭据.

我做错了什么,或者这确实是预期的行为？如果是的话,有没有办法作弊？我真的认为浏览器弹出窗口是丑陋的.

由于这是一个静态站点,因此遗憾的是,任何认证方案都需要活动服务器端代码.

解决方法

您需要为每个请求发送Authorization标头.

试试这种方法 – How to use Basic Auth with jQuery and AJAX?