Odesílat požadavky na jiný server, než ze kterého byl vás JS kód stažen (tzv. cross-domain request), je z bezpečnostních důvodů zakázáno. A přesto je v dnešní doby celá řada serverů, na které můžete poslat AJAX request a získat data (např. Google Maps API).

Vytvoření takového requestu a API, které ho zpracuje, je celkem jednoduché, ale je potřeba vědět, kde začít.

AJAX Origin

První, co musíte udělat, je v Javascriptu vytvořit AJAX request a odeslat ho na příslušnou adresu.

$.post({
    url: 'http://api.server.com/',
    data: apiData,
    crossDomain: true
});

V jQuery musíte do parametrů přidat hodnotu crossDomain, která zajistí, že jQuery nebude kontrolovat URL requestu.

Důležité je, aby takový request obsahovat hlavičku s adresou stránky, odkud pochází – ve většině případů se o to postará prohlížeč.

Origin: http://www.myserver.com

Server následně může zkontrolovat tuto hodnotu a rozhodnout, zda chce na takový request reagovat. To je první stupeň ochrany, kdy může server umožnit pouze připojení z předem nastavených serverů.

Pokud request na server odesílá i data, musí obsahovat hlavičku s kódováním:

Content−Type: application/x−www−form−urlencoded; charset=UTF−8

Tím serveru sdělíte, jakým způsobem s ním chcete komunikovat. Pro běžné requesty je povoleno používat pouze url-encoded data. Pokud např. chcete komunikovat pomocí JSON nebo SOAP protokolů, budete muset nejprve odeslat OPTION request, kterým si od serveru vyžádáte povolení pro danou komunikaci. Samozřejmě pokud jde o váš server, můžete daný formát předpokládat a odeslat jiná data i když je typ obsahu nastaven na url-encoded.

Allow origin

Když pak server zpracuje request a odpoví, musí ještě poslat hlavičku, kterou zpětně sdělí prohlížeči, pro které servery je odpověď určena.

Access−Control−Allow−Origin: http://www.myserver.com

To je druhý stupeň ochrany, kdy samotný prohlížeč zajišťuje, že odpověď získá pouze script stažený z daného serveru. (Podobně kontroluje a omezuje i skripty a DOM elementy v iFramech.) Tímto může server zabránit CSRF útokům, kdy se škodlivý kód z jiného serveru nahraje do původní stránky a snaží se ukrást data.

Samozřejmě pokud jde o veřejné API jako např. od Googlu, stačí poslat obecnou hlavičku:

Access−Control−Allow−Origin: *

Důležité je ale si uvědomit, že pokud tuto hlavičku (alespoň v obecné podobě) server nepošle, není možné taková data získat ve skriptu (tělo odpovědi bude pro příslušný skript prázdné, i když třeba v debuggeru ho uvidíte). Tím je zajištěno, že servery, které nemají o cross-domain komunikaci zájem, ji nemusí nijak speciálně ošetřovat.

Zpracování odpovědi

Zpět na straně javascriptu již není potřeba nic jiného, než si přečíst tělo odpovědi tak, jak se to dělá u běžného requestu. (I když není na škodu – stejně jako u běžného requestu – zkontrolovat jestli jste nějakou odpověď dostali.)