如何在javascript的RESTAPI调用中进行http身份验证

我需要从Java脚本调用OpenMRS REST API来从OpenMRS获取数据.下面是我的java脚本代码：

function myfunction(){
var xhr = new XMLHttpRequest();
xhr.open("GET", "http://localhost:8081/openmrs-standalone/ws/rest/v1/person?q=John", false);
xhr.setRequestHeader("Authorization: Basic YWRtaW46QWRtaW4xMjM");
xhr.send("");
alert(xhr.status);
}


其中YWRtaW46QWRtaW4xMjM是我的base64编码用户名：密码,如here所述.如果我没有在代码中放置授权行并使用Firebug检查Web应用程序,它将返回401预期的未授权状态.但如果我提出授权,则不会返回任何内容,而且在萤火虫中我也没有看到任何响应.如果我直接在浏览器上检查URL,页面会询问用户名和密码,在提供正确的凭据后,它会正常返回数据.所以我遇到了一个从应用程序的java脚本提供http身份验证的问题.我也考虑过here解释的方法,但没有运气.任何人都可以帮我从Javascript授权http请求吗？

解决方法:

下面是另一个类似但不同的示例,说明如何为授权目的设置标头,而是使用JQuery和AJAX.

var token = "xyz"
var url = "http://localhost:8081/openmrs-standalone/ws/rest/v1/person?q=John"
$.ajax({
url: url,
beforeSend: function(xhr) {
xhr.setRequestHeader("Authorization", "Bearer " + token)
},
})
.done(function (data) {
$.each(data, function (key, value) {
// Do Something
})
})
.fail(function (jqXHR, textStatus) {
alert("Error: " + textStatus);
})


下面是一个如何使用xhr而不是AJAX获取访问令牌的示例.

var data = "grant_type=password&username=myusername@website.com&password=MyPassword";
var xhr = new XMLHttpRequest();
xhr.withCredentials = true;
xhr.addEventListener("readystatechange", function () {
if (this.readyState === 4) {
console.log(this.responseText);
}
});
xhr.open("POST", "https://somewebsite.net/token");
xhr.setRequestHeader("cache-control", "no-cache");
xhr.setRequestHeader("client_id", "4444-4444-44de-4444");
xhr.send(data);


请注意跨站点域请求(如果您要求的令牌不在localhost上或您当前正在使用的域内),因为您需要CORS.如果您遇到跨域问题,see this tutorial for help,并确保您也已从API启用了CORS请求.