使用 Javascript 发出 HTTP POST 身份验证基本请求
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/31473420/
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
Make an HTTP POST authentication basic request using Javascript
提问by Gianluca Ghettini
I want to use JavaScript to perform a POST request using the common "Authorization: Basic" method. The server hosts an OWIN C# App and on successful authentication it should give me a token in JSON format.
我想使用 JavaScript 使用常见的“授权：基本”方法执行 POST 请求。服务器托管一个 OWIN C# 应用程序，在成功验证后，它应该给我一个 JSON 格式的令牌。
This is the wireshark equivalent of what I want to accomplish using plain Javascript:
这是我想要使用普通 Javascript 完成的wireshark等价物：
POST /connect/token HTTP/1.1
Authorization: Basic c2lsaWNvbjpGNjIxRjQ3MC05NzMxLTRBMjUtODBFRi02N0E2RjdDNUY0Qjg=
Content-Type: application/x-www-form-urlencoded
Host: localhost:44333
Content-Length: 40
Expect: 100-continue
Connection: Keep-Alive
HTTP/1.1 100 Continue
grant_type=client_credentials&scope=api1HTTP/1.1 200 OK
Cache-Control: no-store, no-cache, max-age=0, private
Pragma: no-cache
Content-Length: 91
Content-Type: application/json; charset=utf-8
Server: Microsoft-HTTPAPI/2.0
Date: Fri, 17 Jul 2015 08:52:23 GMT
{"access_token":"c1cad8180e11deceb43bc1545c863695","expires_in":3600,"token_type":"Bearer"}
is it possible to do so? If so, how?
有可能这样做吗？如果是这样，如何？
回答by LeftyX
This is the javascript request:
这是javascript请求：
var clientId = "MyApp";
var clientSecret = "MySecret";
// var authorizationBasic = $.base64.btoa(clientId + ':' + clientSecret);
var authorizationBasic = window.btoa(clientId + ':' + clientSecret);
var request = new XMLHttpRequest();
request.open('POST', oAuth.AuthorizationServer, true);
request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
request.setRequestHeader('Authorization', 'Basic ' + authorizationBasic);
request.setRequestHeader('Accept', 'application/json');
request.send("username=John&password=Smith&grant_type=password");
request.onreadystatechange = function () {
if (request.readyState === 4) {
alert(request.responseText);
}
};
and this is the jQuery version:
这是 jQuery 版本：
var clientId = "MyApp";
var clientSecret = "MySecret";
// var authorizationBasic = $.base64.btoa(clientId + ':' + clientSecret);
var authorizationBasic = window.btoa(clientId + ':' + clientSecret);
$.ajax({
type: 'POST',
url: oAuth.AuthorizationServer,
data: { username: 'John', password: 'Smith', grant_type: 'password' },
dataType: "json",
contentType: 'application/x-www-form-urlencoded; charset=utf-8',
xhrFields: {
withCredentials: true
},
// crossDomain: true,
headers: {
'Authorization': 'Basic ' + authorizationBasic
},
//beforeSend: function (xhr) {
//},
success: function (result) {
var token = result;
},
//complete: function (jqXHR, textStatus) {
//},
error: function (req, status, error) {
alert(error);
}
});
In both situation I've encoded the clientIdand the clientSecretin a string base64 using a jquery plugin. I am pretty sure you can find something similar in plain javascript.
在这两种情况下，我都使用 jquery插件将 theclientId和 the编码到clientSecret字符串 base64 中。我很确定你可以在普通的 javascript 中找到类似的东西。
This is a projectwhere you have a Owin Web Api running in a console and a project where you can test your request in a web page using jQuery or the plain vanilla javascript. You might need to change the urls for the requests.
这是一个项目，你必须在控制台Owin网络API运行和项目，您可以测试使用jQuery或普通的香草JavaScript的Web页面请求。您可能需要更改请求的 url。
