使用普通Javascript/AJAX实现基于客户端令牌的身份验证

有人能给我指出一篇文章，解释使用Javascript实现客户端令牌身份验证吗

我找到了很多关于Angular的文章，但这不是我要找的。这就引出了一个问题：是否可以用Javascript来实现

---

还有如何处理身份验证服务器抛出401错误时的场景。是否存在用于检测该响应的内置异常？还是需要实现自定义异常？

我个人在我的一个项目中使用了JSON web令牌。 是关于如何在服务器端设置JSON web令牌的教程

获得令牌作为对客户端的响应后，可以将令牌存储在window.localStorage上

var credentials = {
    username : document.getElementById("username").value,
    password : document.getElementById("password").value
};
var url = window.localStorage.getItem('appUrl');
$.ajax({
  url: url + '/register',
  type: 'POST', 
  data: { username: credentials.username, password: credentials.password },
  success: function(Data) {
           window.localStorage.setItem('token', Data.token);
          },
  beforeSend: function(xhr){xhr.setRequestHeader('Authorization', window.localStorage.getItem('token'));},
  error: function() {
          alert('Error occured');
          }
});

}))

然后，在导航到其他页面时，可以将其作为标题附加到AJAX调用中

$.ajax
 ({
  type: "GET",
  url: "index1.php",
  data: '{}',
  beforeSend: function (xhr){ 
     xhr.setRequestHeader('Authorization',window.localStorage.getItem('token')); 
  },
 success: function (){
  alert('Thanks for your comment!'); 
 }
});

这对我很有用

var token = gettoken();
function getDatatypes() {
    if (isEmpty(token)) {
        token = gettoken();

    }

    var request = getDatatypesFromApi();
        request.success(function (data) {
            alert('success!');

        });
        request.error(function (httpObj, textStatus) {
            if (httpObj.status == 401)
                gettoken();
        });    
}
function getDatatypesFromApi() {
    var request = $.ajax
 ({
     type: "GET",
     url: "http://yoururl.com/",
     data: '',
     headers:{
         'Authorization': 'Basic ' + token
     },
     dataType: "json",
     timeout: 5000,
 });
    return request;
}
function gettoken() {
    var credentials = {
        username: "userid",
        password: "PASS",
        domain: "",
        extensionsAppId:"{extAppId}"

    };
    var url = "http://thelinktoresource/"
    $.ajax({
        url: url,
        type: 'GET',
        data: { userId: credentials.username, password: credentials.password, domain: credentials.domain, extensionsAppId: credentials.extensionsAppId },
        dataType: "json",
        contentType: 'application/json; charset=UTF-8',
        success: function (Data) {
            console.log(Data);
            token = Data.replace(/"/ig, ''); 
            return token;
        },

        error: function () {
            alert('Error occured');
            return "undefined";
        }
    });

}

function isEmpty(strIn) {
    if (strIn === undefined) {
        return true;
    }
    else if (strIn == null) {
        return true;
    }
    else if (strIn == "") {
        return true;
    }
    else {
        return false;
    }
}