如何在来自 javascript 的 REST API 调用中进行 http 身份验证
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/22413921/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to make http authentication in REST API call from javascript
提问by arin1405
I need to call OpenMRS REST APIfrom Java script to get data from OpenMRS. Below is my java script code:
我需要从 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);
}
Where YWRtaW46QWRtaW4xMjMis my base64 coded username:password as explained here. If I do not put the authorization line in the code and check the web app using Firebug, it returns 401 unauthorized status that is expected. But if I put the authorization, nothing is returned and in firebug I do not see any response as well. If I check the URL directly on browser, the page asks for username and password and after giving correct credential, it returns the data normaly. So I am getting some problem of providing the http authentication right from the java script of the app. I have also considered the methods explained herebut no luck. Can anyone please help me to authorize the http request right from the javascript?
哪里YWRtaW46QWRtaW4xMjM是我的base64编码的用户名：密码作为解释在这里。如果我不将授权行放在代码中并使用 Firebug 检查 Web 应用程序，它会返回 401 未授权状态，这是预期的。但是，如果我进行授权，则不会返回任何内容，并且在 firebug 中我也看不到任何响应。如果我直接在浏览器上检查 URL，页面会要求输入用户名和密码，并在提供正确的凭据后，正常返回数据。所以我在从应用程序的 java 脚本提供 http 身份验证方面遇到了一些问题。我也考虑过这里解释的方法，但没有运气。任何人都可以帮助我直接从 javascript 授权 http 请求吗？
回答by Kevin
Here is another similar but different example of how to set the header for authorization purposes, but instead using JQuery and AJAX.
这是另一个类似但不同的示例，说明如何为授权目的设置标头，但使用 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);
})
Below is also an example of how you might get an access token using xhr instead of AJAX.
下面也是一个示例，说明如何使用 xhr 而不是 AJAX 获取访问令牌。
var data = "grant_type=password&[email protected]&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);
Beware of cross-site domain requests(if you're requesting a token that's not on localhost or within the domain that you are currently working in), as you'll need CORS for that. If you do run into a cross-domain issue, see this tutorial for help, and be sure you have enabled CORS requests from the API as well.
当心跨站点域请求（如果您请求的令牌不在本地主机或您当前工作的域内），因为您需要 CORS。如果您确实遇到跨域问题，请参阅本教程以获取帮助，并确保您也已启用来自 API 的 CORS 请求。
