Stellen Sie eine HTTP-POST-authentication basic-request mit Javascript

Möchte ich mit JavaScript führen Sie eine POST-Anforderung, die mit dem gemeinsamen "Authorization: Basic" - Methode. Der server beherbergt ein OWIN C# - App und bei erfolgreicher Authentifizierung sollte es geben, mir ein token im JSON-format.

Dies ist der wireshark entspricht, was ich erreichen wollen mit plain 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"}

ist es möglich, dies zu tun? Wenn ja, wie?

siehe Dokumentation - developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest
Vanille -, Javascript-oder jQuery ?
Alle updates zu diesem Thema?

InformationsquelleAutor Gianluca Ghettini | 2015-07-17

  1. 19

    Dies ist der javascript-Anfrage:

    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);
    }
};

    - und dies ist die jQuery version:

    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 beiden situation habe ich kodierte die clientId und die clientSecret in einen base64-string über einen jquery -plugin. Ich bin ziemlich sicher, dass Sie etwas ähnliches finden in einfachem javascript.

    Dies ist ein Projekt, wo Sie eine Owin Web Api läuft in einer Konsole und ein Projekt, bei dem Sie testen können Ihre Anfrage in eine web-Seite mit Hilfe von jQuery oder die plain-vanilla-javascript. Sie müssen möglicherweise ändern Sie die urls für die Anforderungen.

    grazie Alberto! ora lo provo
    Prego 🙂 Lass es mich wissen.
    Sieht aus wie plain window.btoa sollte den job tun, für $.base64.btoa...
    ClientId identifiziert der client-Anwendung: es könnte sein, eine mobile app, desktop oder einem anderen web-app. Sie könnten, bieten verschiedene Konfigurationen für jedes dieser.
    Beide code-Blöcke verwenden, jquery...

    InformationsquelleAutor LeftyX

Schreibe einen Kommentar