Utwórz podstawowe żądanie uwierzytelniania HTTP POST przy użyciu kodu JavaScript

Question

Chcę użyć kodu JavaScript do wykonania żądania POST przy użyciu zwykłej metody "Authorization: Basic". Na serwerze znajduje się aplikacja OWIN C#, a po pomyślnym uwierzytelnieniu powinien dać mi token w formacie JSON.

Jest to odpowiednik Wireshark, co chcę osiągnąć stosując zwykły javascript:

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"} 

jest to możliwe, aby to zrobić? Jeśli tak to jak?

Answer 1

To żądanie javascript:

var clientId = "MyApp"; 
var clientSecret = "MySecret"; 

var authorizationBasic = $.base64.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); 
    } 
}; 

i jest to wersja jQuery:

var clientId = "MyApp"; 
var clientSecret = "MySecret"; 

var authorizationBasic = $.base64.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); 
    } 
}); 

W obu przypadkach mam kodował clientId i clientSecret w ciągu base64 ciąg przy użyciu jQuery plugin. Jestem prawie pewien, że możesz znaleźć coś podobnego w zwykłym javascript.

To jest project, gdzie masz aplikację Owin Web Api działającą w konsoli i projekt, w którym możesz przetestować swoje żądanie na stronie internetowej za pomocą jQuery lub zwykłego JavaScriptu javascript. Może być konieczna zmiana adresów URL dla żądań.