jQuery, Ajax, Cross-site-scripting

Ich weiß, diese Frage wurde gebeten (mehrmals) vor, aber ich kann immer noch nicht scheinen, um es richtig zu machen.

Ich möchte einen AJAX-request in jQuery und bekommen "beliebige" Inhalte - z.B. kann es werden html -, text -, json -, img -

Wenn ich sowas wie das folgende, bekomme ich die berühmt-berüchtigten
Keine "Access-Control-Allow-Origin' - header vorhanden ist, auf die angeforderte Ressource. Herkunft 'http://mydomain.com' ist daher nicht der Zugriff erlaubt. 

$.ajax({
            url: "http://www.pureexample.com/jquery/cross-domain-ajax.html",
            //dataType: "jsonp",
            crossDomain: true,   
            success: function (data) {
                        console.log('success');
                         console.log(data);

           },
            error: function(request, status, error) {
                    console.log('Error on request. ' + request.responseText);
                    alert('Error on request. ' + request.responseText);
                }
        });

Ich bin nicht im Dienste der Daten, so kann ich nicht tun, alles auf der server-Seite zu ermöglichen cross-domain-Anfrage. Ich glaube, die Angabe JSONP (auskommentiert) wird davon ausgegangen, dass JSON zurückgegeben wird? Mit oder ohne Sie, es funktioniert nicht.

Also, unterm Strich - ist es eine "einfache" Weg, um einen cross-domain-Anfrage, so dass ich das Ergebnis bekommen und legen Sie Sie in einen tag (z.B. von html in einem DIV)

Jede Hilfe oder weitere Erklärung ist sehr geschätzt.

Dank.
Rob

  • Wenn kein JSONP-Antwort ist ausdrücklich durch den remote-server, dann ist die einzige Sache, die Sie tun können, ist ein proxy die Anfragen über eigene server, so dass die SOP nicht gelten.
InformationsquelleAutor Rob | 2014-05-30
  1. 3

    Ich hatte dieses problem vor einer Weile, bei Verwendung eines externen webservice zum abrufen von brasilianischen zip-code-Daten (Adresse und so).
    Und ich benutzte die gleiche Methode, die Sie haben.

    Gibt es ein paar Punkte, die müssen betont werden, heraus:

    1) Ajax nicht erlauben security protocol Unterschiede. Das bedeutet, dass, wenn Ihre Seite ist gesichert hinter einem sicheren Protokoll (HTTPS), die Ihr browser nicht erlauben einem externen server zurück über eine ungesicherte (HTTP). (Fand ich so spät in meiner Entwicklung, und das Ergebnis war zu verwenden .NET webrequest )

    2) Einstellung Datentyp "JSONP" nicht verwandeln eine Antwort auf JSON. Es ermöglicht es empfangen zu werden, als solche.

    3) JSONP ist die nur Datentyp acceptd für cross-domain-requests. Die Fehlermeldung, die du beschrieben hast, ist wahrscheinlich aus diesem Grund.

    Also, um es zusammenzufassen:

    Wenn die Rede von cross-domain-requests mit ajax,"Beliebige" Inhalte sind beschränkt auf JSON(P). UND die Daten, die empfangen werden MÜSSEN, JSON.

    Auch, bis jQuery 1.5, wenn die Antwort nicht korrekt eingegeben als JSON kein Fehler ausgelöst werden .

    Ich wünschte, ich hätte bekannt, diese Probleme, bevor ich begann meine Entwicklung... Hochladen einer Komponente, um die Produktion von Servern unbemerkt von der Tatsache, dass die anfragenden gespeicherten Daten innerhalb von HTTP über SSL-Layered-Server ist schon eine Peinlichkeit. ... (Wenn auch noch Recht vorhersehbar, eigentlich)

    Weitere Infos : http://api.jquery.com/jquery.ajax/

    • Wichtiger Hinweis: die Antwort auf eine JSONP-Anfrage ist nicht als JSON. Vielmehr ist es ein Funktions-Aufruf.
    InformationsquelleAutor Eric Wu
  2. 2

    Müssen Sie die Verwendung von Ajax-cross-origin-ein jQuery-plugin.

    Dieses plugin erlaubt Ihnen die Verwendung von jQuery.ajax() cross domain.

    Verwenden Sie es wie diese:

    $.ajax({
    crossOrigin: true,
    url: url,
    success: function(data) {
        console.log(data);
    }
});

    Lesen Sie hier mehr: http://www.ajax-cross-origin.com/

    InformationsquelleAutor Ninioe
  3. 1

    Danke für die Antworten. Sehr hilfreich ist. Ich beschlossen zu gehen mit einem proxy-Ansatz, für die habe ich eine einfache Lösung hier: http://www.paulund.co.uk/make-cross-domain-ajax-calls-with-jquery-and-php

    Für Ausschneiden und einfügen Einfachheit, die ich Hinzugefügt habe meinen code hier.

    Ich habe eine Datei namens crossdomain.html. Inklusive jquery-Bibliothek. Erstellt die folgende Javascript-Funktion:

    function requestDataByProxy()
    {
        var url = "http://UrlYouWantToAcccess.html";
        var data = "url=" + url + "&parameters=1&para=2";    

        $.ajax({
            url: "our_domain_url.php",
            data: data,
            type: "POST",
            success: function(data, textStatus, jqXHR){
                console.log('Success ' + data);
                $('#jsonData').html(data);
            },
            error: function (jqXHR, textStatus, errorThrown){
                console.log('Error ' + jqXHR);
            }
        });
    }

    Habe ich auch noch einen einfachen Knopf und pre-tag in HTML zu laden Ergebnisse:

    <button onclick="requestDataByProxy()">Request Data By Proxy</button>

<h3>Requsted Data</h3>
<pre id="jsonData"></pre>

    Und dann die PHP-Datei our_domain_url.php, welche cURL verwendet (stellen Sie sicher, dass diese aktiviert!)

    <?php

//set POST variables
$url = $_POST['url'];
unset($_POST['url']);

$fields_string = "";
//url-ify the data for the POST
foreach($_POST as $key=>$value) { 
    $fields_string .= $key.'='.$value.'&'; 
}
$fields_string = rtrim($fields_string,'&');

//open connection
$ch = curl_init();

//set the url, number of POST vars, POST data
curl_setopt($ch,CURLOPT_URL,$url);
curl_setopt($ch,CURLOPT_POST,count($_POST));
curl_setopt($ch,CURLOPT_POSTFIELDS,$fields_string);

//execute post
$result = curl_exec($ch);

//close connection
curl_close($ch);

?>

    Mir, das war ein ziemlich straight-forward Lösung.

    Hoffe, dies hilft jemand anderes!

    Rob

    InformationsquelleAutor Rob
Schreibe einen Kommentar