2013-07-25 6 views
8

Ich habe eine Anwendung, wo Frontend mit HTML, CSS und Javascript-Code gebaut wird. Backend wird mit Core Java, Restlet erstellt.Cross-Site-Anrufe ohne JSONP

Jetzt ist das wirkliche Problem Frontend und Backend werden beide auf Diff-Servern mit Diff-Ports zu sein. wie, Frontend ist auf: http://clientLookup (nur zum Beispiel) und Backend auf, http://lcgrke:8080

Jetzt, da ich den Server senden oder Anrufe vom Frontend über Ajax-Request ruht oder jQuery Ajax mir das Kreuz Side-Scripting-Problem bin immer dann (SOP - gleiche Herkunftsrichtlinie). Ich verstehe nicht, wie ich das umgehen soll.

JSONP kann eine der Optionen sein, aber es wird nur für GET-Aufrufe funktionieren, aber in meiner Anwendung werde ich GET/POST-Anfragen haben. Außerdem werden einige URLs des Servers nicht JSONP-fähig sein (fragt mich nicht warum, akzeptiert einfach, dass sie nicht editierbar sind), also scheint JSONP keine bessere Option zu sein.

Kann mir bitte jemand erklären, wie ich dieses Problem umgehen werde?

+0

google cors ajax – dandavis

+0

Haben Sie versucht [easyXDM] (https://github.com/oyvindkinsey/easyXDM)? – xmikex83

Antwort

0

Der moderne Weg, um Cross-Site-Anfragen zu behandeln, ist CORS anstelle von JSONP, obwohl Sie wissen müssen, welche Browser CORS unterstützen.

Sie können CORS mit fast modernen Browsern (IE10, FF, Chrome, Safari, Opera) verwenden, aber nicht mit IE9/8.

Mit IE9/8 können Sie eine andere Technik namens XDomainRequest verwenden, aber Sie müssen es über JSNI implementieren.

Das Ziel der Verwendung von CORS vs JSONP ist, dass Sie in Ihrer Server-Seite nur einen Filter hinzufügen und alles sollte out-of-the-box funktionieren (RPC, RF, etc).

Um CORS in gwt zu verwenden, können Sie diese page in der gwtquery Website lesen, wo Sie ein Filterbeispiel haben. Auf dieser Seite haben Sie auch nützliche Informationen über jsonp und wie man gwtquery ajax verwendet, was den gwt RequestBuilder-Weg vereinfacht.

+1

Danke für die nette Antwort. Ich habe die von Ihnen bereitgestellten Links durchsucht und konnte eine domainübergreifende Anfrage ausführen. Jetzt denke ich, was ist, wenn Server nicht die Zugriffskontrolle-Erlaubnis-Ursprung: * hat, und ich kann es nicht dann ändern, was in diesem Fall getan werden sollte? – vbjain

+1

In einfachen Worten, ist es zwingend erforderlich, dass der Server den Header Access-Control-Allow-Origin: * oder Access-Control-Allow-Origin: sendet, damit Cross-Site-Requests mit CORS funktionieren? Was passiert, wenn der Server nicht mit diesem Header-Typ reagiert? – vbjain

+0

In CORS stellt der Client 2 Anfragen an den Server (OPTION und POST/GET/PUT ...). Auf die 'doOption' Anfrage muss der Server antworten mit 'Access-Control-Allow-Origin' und' Access-Control-Allow-Methoden' und 'Access-Control-Allow-Header' (die letzte nur wenn Sie eine weitere hinzufügen Header zu Ihrem XHR). Zu dem 'doPost' muss nur der' Access-Control-Allow-Origin' hinzugefügt werden. Und ja, sie sind obligatorisch, ansonsten wird der Kunde das XHR ablehnen. –

0

Wenn Sie PHP verwenden und die Bibliothek php_culr zur Verfügung haben, können Sie den Ursprung des Kreuzes für den Server nutzen. Sie können hier ein Beispiel sehen: http://davidwalsh.name/curl-post oder Sie könnten file_get_contents Funktion verwenden und die geposteten Parameter serialisieren oder einfach die gewünschten Parameter übergeben (falls benötigt).

Hoffe, das hilft.

0

Ben Alman hat ein einfaches Proxy-Skript, das ich als temporäre Abhilfe für diese Art von Situation verwendet habe.

Grundsätzlich leitet es GET und POST-Anfragen mit curl.

http://benalman.com/projects/php-simple-proxy/

$url = $_GET['url']; 
$ch = curl_init($url); 
curl_setopt($ch, CURLOPT_VERBOSE, true); 
if (strtolower($_SERVER['REQUEST_METHOD']) == 'post') { 
    curl_setopt($ch, CURLOPT_POST, true); 
    //curl_setopt($ch, CURLOPT_POSTFIELDS, $_POST); 

    $vin = $_POST["vin"]; 
    $subscriberProgramXML = $_POST["subscriberProgramXML"]; 

    $data = array("vin" => $vin, "subscriberProgramXML" => $subscriberProgramXML); 
    $data_string = json_encode($data); 

    $httpHeader = array('Content-Type: application/json', 'Content-Length: ' .strlen($data_string)); 

    curl_setopt($ch, CURLOPT_POSTFIELDS, $data_string); 
    curl_setopt($ch, CURLOPT_HTTPHEADER, $httpHeader); 
} 

curl_setopt($ch, CURLOPT_FOLLOWLOCATION, true); 
curl_setopt($ch, CURLOPT_HEADER, true); 
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true); 

curl_setopt($ch, CURLOPT_USERAGENT, $_GET['user_agent'] ? $_GET['user_agent'] : $_SERVER['HTTP_USER_AGENT']); 


list($header, $contents) = preg_split('/([\r\n][\r\n])\\1/', curl_exec($ch), 2); 

$status = curl_getinfo($ch); 

curl_close($ch); 

// Set the JSON data object contents, decoding it from JSON if possible. 
$decoded_json = json_decode($contents); 
$data['contents'] = $decoded_json ? $decoded_json : $contents; 

// Generate appropriate content-type header. 
$is_xhr = strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest'; 
header('Content-type: application/' . ($is_xhr ? 'json' : 'x-javascript')); 

// Get JSONP callback. 
$jsonp_callback = $enable_jsonp && isset($_GET['callback']) ? $_GET['callback'] : null; 

// Generate JSON/JSONP string 
$json = json_encode($data); 

print $jsonp_callback ? "$jsonp_callback($json)" : $json; 

dass Code aus dem ursprünglichen PHP copypasted ist, aber es ist nur der Codeteil. Es veranschaulicht die Lösung.

0

Als @Manolo sagte der Weg zu gehen ist mit CORS (Sie können mehr Details hier sehen: http://blogs.mulesoft.org/cross-domain-rest-calls-using-cors/ - DISCLAIMER: Ich schrieb diesen Artikel, aber um diese Antwort eine Eigenwerbung zu machen, können Sie nach CORS suchen und Sie ' lch finde ähnliche Artikel).

Die einzige Sache, die ich zur Manolo Antwort hinzufügen könnte, ist, dass wenn Sie jQuery verwenden, Sie sich nicht um IEs XDomainRequest sorgen müssen, weil jQuery diese Browserkompatibilitätsdetails berücksichtigt.

Auch da Sie Restlet verwenden, wird dieser Artikel hilfreich sein: http://kodemaniak.de/2010/07/cross-domain-ajax-with-restlet-and-jquery/

ich nie mit Restlet gearbeitet, aber da Java-basiert, andere einfache Option CORS hinzuzufügen, ist ein Filter zu erstellen oder zu verwenden, ist hier eine Apache-Lizenz Filterimplementierung: https://bitbucket.org/thetransactioncompany/cors-filter/src

1

Ich hatte das gleiche Problem vor nicht allzu langer Zeit. Sie können PHP auf Ihrem Frontend-Server installieren und den AJAX-Aufruf an ein PHP-Skript auf diesem Server senden. Es gibt mehrere HTTP-Bibliotheken für PHP (cURL ist die beliebteste), die Sie dann verwenden können, um eine HTTP-Anfrage an Ihren Backend-Server zu stellen. Grundsätzlich können Sie ein PHP-Skript auf Ihrem Frontend-Server schreiben, um als Mittelsmann zu agieren.