Ich versuche, eine Cross Origin-Post-Anfrage zu stellen, und ich habe sie so einfach zum JavaScript
Laufen gebracht:
var request = new XMLHttpRequest();
var params = "action=something";
request.open('POST', url, true);
request.onreadystatechange = function() {if (request.readyState==4) alert("It worked!");};
request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
request.setRequestHeader("Content-length", params.length);
request.setRequestHeader("Connection", "close");
request.send(params);
Aber ich würde es gerne benutzen jQuery
, aber ich kann es nicht zum Laufen bringen. Das versuche ich:
$.ajax(url, {
type:"POST",
dataType:"json",
data:{action:"something"},
success:function(data, textStatus, jqXHR) {alert("success");},
error: function(jqXHR, textStatus, errorThrown) {alert("failure");}
});
Dies führt zu einem Fehler. Wenn jemand weiß, warum jQuery
es nicht funktioniert, lassen Sie es uns bitte alle wissen. Vielen Dank.
(Ich verwende jQuery
1.5.1 und Firefox 4.0 und mein Server antwortet mit einem richtigen Access-Control-Allow-Origin
Header.)
javascript
jquery
xmlhttprequest
cors
Magmatisch
quelle
quelle
Antworten:
UPDATE: Wie TimK betonte, wird dies mit jquery 1.5.2 nicht mehr benötigt. Wenn Sie jedoch benutzerdefinierte Header hinzufügen oder die Verwendung von Anmeldeinformationen (Benutzername, Kennwort oder Cookies usw.) zulassen möchten, lesen Sie weiter.
Ich glaube ich habe die Antwort gefunden! (4 Stunden und viel Fluchen später)
Sie müssen alle Header, die Sie akzeptieren, manuell angeben (zumindest war dies bei FF 4.0 und Chrome 10.0.648.204 der Fall).
Die $ .ajax-Methode von jQuery sendet den Header "x-request-with" für alle domänenübergreifenden Anforderungen (ich denke, es ist die einzige domänenübergreifende Methode).
Der fehlende Header, der zur Beantwortung der OPTIONS-Anforderung benötigt wird, lautet also:
Wenn Sie nicht "einfache" Header übergeben, müssen Sie diese in Ihre Liste aufnehmen (ich sende noch eine):
Um alles zusammenzufassen, hier ist mein PHP:
quelle
Eine andere Möglichkeit besteht darin,
dataType: json
dass JQuery durch die Einstellung denContent-Type: application/json
Header sendet . Dies wird von CORS als nicht standardmäßiger Header betrachtet und erfordert eine CORS-Preflight-Anforderung. Also ein paar Dinge zum Ausprobieren:1) Versuchen Sie, Ihren Server so zu konfigurieren, dass die richtigen Preflight-Antworten gesendet werden. Dies erfolgt in Form von zusätzlichen Headern wie
Access-Control-Allow-Methods
undAccess-Control-Allow-Headers
.2) Löschen Sie die
dataType: json
Einstellung. JQuery sollte verlangenContent-Type: application/x-www-form-urlencoded
standardmäßig, aber nur um sicher zu sein, können Sie ersetzendataType: json
mitcontentType: 'application/x-www-form-urlencoded'
quelle
application/x-www-form-urlencoded
und sogartext/plain
. Und ich habe versucht, einen Antwortheader vonAccess-Control-Allow-Methods "POST, GET, OPTIONS"
Nothing funktioniert hinzuzufügen .dataType
beeinflusst denAccept
Anforderungsheader, nicht jedoch denContent-Type
Anforderungsheader.Sie senden "params" in js:
request.send(params);
aber "Daten" in jquery ". Sind Daten definiert?:
data:data,
Außerdem haben Sie einen Fehler in der URL:
Sie mischen die Syntax mit der für $ .post
Update : Ich habe basierend auf der Monsur-Antwort gegoogelt und festgestellt, dass Sie etwas hinzufügen müssen
Access-Control-Allow-Headers: Content-Type
(unten ist der vollständige Absatz).http://metajack.im/2010/01/19/crossdomain-ajax-for-xmpp-http-binding-made-easy/
quelle
var data = {action:"something"}
jQuery.ajaxSetup({'beforeSend': function(xhr) {xhr.setRequestHeader(string, string)}})
um die verschiedenen gesendeten Header festzulegen und damit zu spielen (ein Beispiel für Rails hier: railscasts.com/episodes/136-jquery )Cors ändern die Anforderungsmethode, bevor sie abgeschlossen ist, von POST zu OPTIONS, sodass Ihre Post-Daten nicht gesendet werden. Die Art und Weise, wie dieses Cors-Problem behandelt wurde, besteht darin, die Anforderung mit Ajax auszuführen, das die OPTIONS-Methode nicht unterstützt. Beispielcode:
mit diesen Headern auf c # Server:
quelle
Ändern Sie Ihre JQuery wie folgt:
quelle
contentType: 'application/json', data: JSONObject,
- Der Server erwartet kein JSON, daher ist das Senden von JSON nicht sinnvoll. Auch gibt es nicht so etwas wie ein JSON - Objekt .headers: { 'Access-Control-Allow-Origin': '*' }, //add this line
- Mach das niemals .Access-Control-Allow-Origin
ist eine Antwort - Header, kein Request - Header. Bestenfalls wird dies nichts tun. Im schlimmsten Fall wird die Anforderung von einer einfachen Anforderung in eine vorab geflogene Anforderung konvertiert, was die Bearbeitung auf dem Server immer schwieriger macht.