2016-06-29 14 views
2

Ich portiere eine Anwendung von Django zu reinem HTML5/CSS mit AngularJS und habe Probleme mit JSON POST-Anfragen an den TheTVDB-REST-API-Server (https://api.thetvdb.com/).AngularJS Ich versuche, eine JSON POST-Anfrage an einen REST-API-Server zu senden, den ich nicht besitze und den ich nicht kontrolliere, aber CORS-Fehler

return { 
    login: function(){ 
     return $http({ 
      method: 'POST', 
      dataType: 'json', 
      headers: {'Content-Type': 'application/json'}, 
      data: {'apikey':apiKey, 'username': username, 'userkey': identifier}, 
      url: tvdbAuthURL 
     }) 
    } 
} 

Und dann bekomme ich diesen Fehler:

Der API-Aufruf in einem Dienst auf AngularJS wird getan

XMLHttpRequest cannot load https://api.thetvdb.com/login/. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8000' is therefore not allowed access. The response had HTTP status code 401. 

Ich habe die Anfrage Preflighten aber kein Glück versucht zu vermeiden und da ich dieses Problem nicht mit python requests lib zum Beispiel hatte (ich trigge die Anfrage an die tvDB mit dieser Python-Lib von demselben Rechner, auf dem die angular JS-App läuft, überhaupt keine Probleme) Ich frage mich, ob es einen Weg gibt oder eine andere Anweisung in AngularJS, um zu verhindern, dass CORS-Header gesetzt werden.

TheTVDB fügt CORS nicht zu ihrem Server hinzu, da die meisten ihrer Benutzer Laravel (PHP), Java und Django (Python) -Anwendungen ausführen und ihre Dienste ohne solche CORS-Probleme verwenden.

Ihre Hilfe wird sehr geschätzt.

Danke, Mit freundlichen Grüßen TS

+1

Erstellen Sie einen Proxy in Python – charlietfl

+0

Ich wollte das aus architektonischen Gründen vermeiden. Aber bedeutet das, dass ich von AngularJS eingeschränkt bin, wenn Server keine CORS-Unterstützung bieten? –

+0

Nein, das bedeutet, dass Sie durch die Browsersicherheit eingeschränkt sind. Sie haben keine andere Wahl, als einen Drittanbieter-Proxy zu verwenden – charlietfl

Antwort

0

eine Anfrage JSONP verwenden. Auf diese Weise können Sie dem CORS ausweichen.

EDIT: Entschuldigung, Sie verwenden POST, dies würde nur für get Anfragen funktionieren.

Sie können einen Proxy erstellen, der die Anforderung empfängt und anschließend einen CURL POST ausführt. Es gibt keine Server-Seite "CORS", so dass Sie in Ordnung sein werden.

+0

Kann nicht einfach jsonp sagen, als wäre es ein magischer Fix für alle CORS. API muss es unterstützen – charlietfl

+0

Eigentlich kann ich JSONP nicht verwenden, da ich tatsächlich eine POST-Anfrage ausstelle und ich verstehe JSONP ist nur für GET, nicht wahr? –

+0

@ T.S. ja das ist richtig – charlietfl

0

Ihre Python-Anfrage funktioniert, weil sie von Ihrem Server oder lokalen Computer kommt und die same origin policy nur innerhalb eines Browsers gilt.

Ihre beste Antwort ist die Verwendung eines serverseitigen Skripts. Lassen Sie Ihre clientseitige POST-Anfrage zu einem Controller oder Endpunkt auf Ihrem Server gehen, der dann das Server-Skript auslöst. Angenommen, es gibt einige Rückgabedaten von der API, fügen Sie diese der Antwort Ihres Servers hinzu und senden sie dann an den Client.

Ich hatte ein ähnliches Problem mit einer API letztes Jahr, die nicht-CORS-konform war. Der serverseitige Code war der einzige Weg, den ich herausfinden konnte, um es zu lösen.

+0

Meine Python-Anfrage wird von localhost, meinem Rechner, auf https://api.thetvdb.com/ ausgelöst, also nicht vom Server. Ich habe keinen Zugriff auf den Server, also müsste ich eine Python-Schicht haben, die auf der gleichen Seite wie meine angularJs sitzt, nur um diese Anfragen zu intermediieren, wie in den anderen Kommentaren und Vorschlägen zu diesem Thread, die ich gerne vermeiden möchte wie möglich. –

+0

Entschuldigung, ich denke meine Antwort war ein wenig durcheinander. In diesem Fall, wenn ich "der Server" sage, meine ich Ihre lokale Maschine oder irgendwo, wo Sie Ihren Backend-Code hosten. Die API wäre der Server, auf den Sie keine Kontrolle haben. Das geht davon aus, dass Sie irgendwo Backend-Code hosten. Wenn dieses Programm Client-only ist und die API nicht CORS-konform ist, sind Sie für eine POST-Aktion gesperrt. –

0

Sie können einen Blick hier haben: https://forums.thetvdb.com/viewtopic.php?t=9125

Die tvdb bietet keine cors Header, der bedeutet, dass Sie nicht die API direkt über Javascript zugreifen können. Wie jedoch @Matt West sagte, funktioniert die Cors-Richtlinie nur in Browsern. Die schnelle Lösung: Erstellen Sie ein Python-Programm als Proxy, die alle Ihre AJAX-Anfrage an TVdb umleiten.