Wie bekomme ich das Token mit Django Rest Framework und Ajax

Question

Ich möchte eine Rest API erstellen, wo Benutzer mit Token authentifizieren können. Ich habe rest_framework.authtoken in die Liste der installierten Apps aufgenommen. Auch hat die erforderliche Konfiguration im settings.py:

INSTALLED_APPS = (
    ... 
    'rest_framework.authtoken' 
) 

REST_FRAMEWORK = { 
    'DEFAULT_PERMISSION_CLASSES': (
     'rest_framework.permissions.IsAuthenticated', 
    ), 
    'DEFAULT_AUTHENTICATION_CLASSES': (
     'rest_framework.authentication.TokenAuthentication', 
     'rest_framework.authentication.SessionAuthentication', 
    ) 
} 

definiert, ein Verfahren zum post_save Signal hören und neue Token für die neu erstellten Benutzer erstellen. Dann habe ich Migration gemacht. Nach dem Erstellen eines neuen Benutzers kann ich das Token für diesen Benutzer sehen.

Auch wenn ich

http POST 0.0.0.0:80/api-token-auth/ username='user@gmail.com' password='secure123' 

bekomme ich eine dieser Antwort zurück

HTTP/1.0 200 OK 
Allow: POST, OPTIONS 
Content-Type: application/json 
Date: Sat, 30 Jul 2016 12:05:30 GMT 
Server: WSGIServer/0.1 Python/2.7.3 
Vary: Cookie 
X-Frame-Options: SAMEORIGIN 

{ 
    "token": "4aecfb249265064c55300d782e4c7e66b8b77063" 
} 

So nehme ich an seiner Arbeits. Aber wenn ich versuche, mit Ajax einzuloggen:

$.ajax({ 
    url: 'http://test.com/api-token-auth/ username=' + email + ' password='+ password, 
    dataType: 'json', 
    cache: false, 
    success: function(data) { 
     console.log(data); 
    }.bind(this), 
    error: function(xhr, status, err) { 
     console.log(err); 
    }.bind(this) 
}); 

ich diesen Fehler in der Browser-Konsole:

jquery-3.1.0.min.js:4 GET http://test.com/api-token-auth/%20username=user@gmail.com%20password=secure123?_=1469883569618 405 (Method Not Allowed)

bundle.js:27453 Method Not Allowed

Wie bekomme ich das Token für authentifizierte Benutzer, so dass ich es verwenden kann, um Posten authentifizierter Nutzer?

Update

auch mit CORS umgehen verwandtes Problem ich django-cors-headers verwende.

Update

%20username=user@gmail.com%20password=secure123?_=1469885103431 405 xhr jquery-3.1.0.min.js:4 278 B 29 ms 

Update: Antwort-Header hinzugefügt

Answer 1

standardmäßig die type oder method Wert zu 'GET' auf jQuery.ajax gesetzt ist() Methode . Es sieht wie die Antwort aus, die Sie erhalten, erlaubt nur 'POST' und 'OPTIONS'.

Sie versuchen, type oder method Wert auf "POST" auf Ihre jQuery.ajax() -Methode zu setzen.

Answer 2

Dies ist ein cors Problem, mit Chrom versuchen und es mit Chrom-Browser --disable-Web-Sicherheit, die es das Problem hier

Answer 3

zu testen gestartet werden, da statt sendet die Daten in den Anfrage-Payload ist, Sie Übergeben URL, wie eine GET-Anfrage.

Die Anfrage Sie mit httpie Werke erzeugen, weil es korrekt die Anforderung erzeugen, wie Sie sehen können:

Anfrage:

http POST 0.0.0.0:80/api-token-auth/ username='user@gmail.com' password='secure123' 

Request (ausführlicher Modus):

POST /api-token-auth/ HTTP/1.1 
Accept: application/json 
Accept-Encoding: gzip, deflate 
Connection: keep-alive 
Content-Length: 55 
Content-Type: application/json 
Host: 0.0.0.0:8000 
User-Agent: HTTPie/0.9.3 

{ 
    "password": "secure123", 
    "username": "user@gmail.com" 
} 

Was unterscheidet sich von:

Anfrage:

http POST "0.0.0.0:8000/api-token-auth/ username='user@gmail.com' password='secure123'" 

Request (ausführlicher Modus):

POST /api-token-auth/%20username='user@gmail.com'%20password='secure123' HTTP/1.1 
Accept: */* 
Accept-Encoding: gzip, deflate 
Connection: keep-alive 
Content-Length: 0 
Host: 0.0.0.0:8000 
User-Agent: HTTPie/0.9.3 

Sie können dieses Beispiel versuchen ich here gefundenen, wie die Daten in der richtigen Art und Weise senden jQuery verwenden. (I din't testen.)

$.ajax({ 
    type: "POST", 
    url: "/api/articles/", 
    data: JSON.stringify(data), 
    sucess: function() { console.log("Success!"); }, 
    contentType: "application/json; charset=utf-8", 
    dataType: "json", 
    crossDomain:false, 
    beforeSend: function(xhr, settings) { 
     xhr.setRequestHeader("X-CSRFToken", csrftoken); 
    } 
});