Ajax auf externe Daten zugreiffen (dataType: 'json' vs 'jsonp')

[jeipack]

Hi
Ich brauche ein JSON von einer externen Seite. In diesem konkreten Fall von openweathermap:

http://api.openweathermap.org/data/2.5/weather?q=sargans,ch

Mache ich nun einen normalen ajax/post Request:

$.ajax({
		type: "POST",
		url: "<?=$weather?>",
		dataType: 'json'
	}).success(...);

Bekomme ich folgende Fehlermeldung:

XMLHttpRequest cannot load http://api.openweathermap.org/data/2.5/weather?q=sargans,ch. Origin http://originalseite.com is not allowed by Access-Control-Allow-Origin.

Greife ich aber auf jsonp zurück funktioniert es:

$.ajax({
		type: "POST",
		url: "<?=$weather?>",
		dataType: 'jsonp'
	}).success(...);

Unschön dabei ist aber, dass ich einen callback in die URL bekomme:

http://api.openweathermap.org/data/2.5/weather?q=sargans,ch&callback=jQuery17201634783197659999_1367487237691&_=1367487237763

&callback=jQuery17201634783197659999_1367487237691&_=1367487237763

Und dies würde ich gerne vermeiden, da dies ja auch in der Antwort eingebaut wird:
jQuery17201634783197659999_1367487237691(
{ JSON:Array }
)


Ideen? Wie kann ich das sauberer lösen?

 

[Parantatatam]

Dass liegt an der Same-Origin-Policy, die für clientseitige Skriptsprachen wie JavaScript gilt. Du kannst es aber beispielsweise so lösen, wie hier beschrieben.

Nachtrag: JSONP funktioniert deshalb, weil es kein AJAX im eigentlichen Sinne ist. jQuery legt kurzzeitig ein neues SCRIPT-Element an, welches die von dir angegebene URL als Quelle angibt, und dann dort die empfangenen Daten an eine Callback-Funktion übergibt. Letztere brauchst du bei "normalen" AJAX nicht, da dort die Daten bereits in einem eigenen Namensraum vorliegen und somit verwendet werden können. Das versucht jQuery zu simulieren, in dem es eine temporäre Funktion mit diesem numerischen Namen anlegt.

Nachtrag 2: Alternativ kannst du die Daten auch über ein serverseitiges Skript, dass unter der gleichen Domain zu finden ist, wie dein JavaScript-Skript, einlesen, und es dann von dort aus mit AJAX abfragen – das ist aber schon recht umständlich.

 

[jeipack]

Hi
Danke für den Link.
Langsam kapiere ich es.
"Das versucht jQuery zu simulieren"
Von daher ist diese Art ja schon sauber.

"Nachtrag 2: Alternativ kannst du die Daten auch über ein serverseitiges Skript, dass unter der gleichen Domain zu finden ist, wie dein JavaScript-Skript, einlesen, und es dann von dort aus mit AJAX abfragen – das ist aber schon recht umständlich."
Daran habe ich auch kurz gedacht, aber so um 1000 Ecken die Daten holen wird einfach undurchsichtiger.
Zuerst hatte ich es im PHP dass die Seite (mit dem Javascript) aufbaut drin, aber das führt dazu, dass der Seitenaufbau zu lange geht. Nun habe ich es es direkt in der Page und denke ich lasse es so.

greeez

 

[Parantatatam]

Du könntest die Daten noch cachen, aber es ist definitiv unsauber. Ansonsten kann ich dir nur sagen, dass JSONP eine sehr schöne Sache ist.