Ajax - příklady. Ajax skripty

Internet poskytuje návštěvníka viditelnost každého zdroje, který je umístěn v síti a prohlížeč - přístup přes síťové protokoly, call mechanismů jednotlivých skriptů, odesílání / přijímání informací. Sada stránek, které tvoří místo, má společný kořen - jedinečný odkaz (název domény, jedinečná adresa uzlu).

Bez ohledu na zdroj reaguje na návštěvu staticky nebo dynamicky generuje odpověď. Iv případě, že forma a obsah stránek jsou závislé na jakýchkoli podmínek, nedělitelnou jednotku komunikačního serveru a klienta (prohlížeče), je hotový dokument HTML kódované obrazy, styly, a další soubory nutné obsah a životní prostředí. Pokud je něco špatně, prohlížeč zobrazí vše, co je „podařilo“ dostat analyzovat a provádět.

Mnoho slibných technologií se objevily po dlouhou dobu, ale byly neoprávněně zapomenuty nebo nebyly správně použity. První AJAX (příklady použití objektu XMLHttpRequest) se objevil před mnoha lety, ale úspěch a sláva přišla až mnohem později.

Vůbec, nebo jen to, co potřebujete

V klasické verzi webu - název, IP-adresu a spojení (všechna synonyma označující stejný bod v Internetu prostoru). Co se skrývá za touto hlavní stránce - myslel: ze své vlastní iniciativy moderní „designéra“, což se ani nezeptal, proč tomu tak je? Proč místo je hlavní stránka, ze které se můžete dostat do jakéhokoli jiného? Tato volba - zjevně není ideální, to je konkrétní obsah a skutečný funkčnost.

Jednoduše řečeno, pokud člověk potřebuje zubaře, to je ta správná adresa pro zvláštní účely, a nikoliv do kuchyně pro chirurgii a ne do knihovny pro konzultace terapeuta. V místě, kde tahle se ukázalo, že vidí, ale neobdrží zubní kliniku v plné výši. To nejlepší, co můžete očekávat, že návštěvník - registr a směr (přesná cesta) k lékaři. A na místě (na místě) se může měnit jako lékař, a určení.

Ale tady je to místo obvykle vždy načten v plné munice, při nakládání se nic nezmění, s přihlédnutím k času, který má někdo přišel ... Ale i v případě, kdy se jedná o skutečný život klinika, první návštěvě nového klienta dát dostatek informací strana , kontakty, a ... registru okno může být za předpokladu, že návštěva na místě byla provedena v době mimo hodin, jak je předepsáno lékařem není k dispozici, dočasné jmenování se provádí v jiném úřadě ...

Bod v internetovém prostoru

Klasický odezva zdroje internetového prostoru - v reakci na žádost o vydání stránku webu (obvykle domů) a pak na druhou, na žádost návštěvníka. Site Server také obsahuje obrázky, styly kód JavaScript skripty, PHP, atd Ne všechny PHP soubory dělat stránek, některé z nich mohou reagovat na požadavky AJAX :. přijímat, zpracovávat a odesílat informace.

Napsat skript hračkou. Ale dostat do bodu kontroly v internetovém prostoru, to je nemožné určit, kdo az jakého důvodu určeno, že je aktivován je jméno, IP adresa a spojení. Jakýkoliv pohyb v síti probíhá v softwaru, a to především prostřednictvím prohlížeče, ale také prostřednictvím robotů různého původu a místa určení prostřednictvím jiných místech působení.

Script, získat kontrolu, může přesně znát pouze: návštěva přes jaký prohlížeč přišel návštěvník, s odkazem, ze kterého IP adresy, a za přítomnosti sušenky. Pouze Ty mohou poskytnout informace o tom, tvoří hlavní stránku, ale jen v případě, že již zde návštěvník. Ve všech ostatních případech je možné vytvořit pouze obecnou odpověď ze serveru. AJAX příklady, které lze snadno najít na internetu, by měly být používány opatrně. Chyby v užívání () objektu XMLHttpRequest sledovat, není snadné.

Celková odpověď a soukromý dialog

Celková odpověď ze serveru - společná strana, označovaná jako principu, co se nazývá index, a to začíná místě, které je v rozporu s jeho odkazy na jiné stránky jsou k dispozici. Nicméně, v případě, že návštěvník zná jména dalších stran, které jsou v jeho chápání bude neméně důležité než jeden určený developera. Zde je klasický model najednou: celkový design a funkčnost, která se zaměřuje na všechny návštěvníky.

Soukromý rozhovor - navazuje na předchozí relaci návštěvníka. Na stránkách už ví, co udělal, že se zajímal o to, co se zobrazenou stránku a dal ho do jeho paměti, napsal něco sexem.

To používalo dva základní požadavek na server ke stažení na webu a práci s ním: POST a GET. výsledek dotazu je celá stránka. Na výsledné stránce, může návštěvník aktivaci těchto či jiných událostí, které jsou nakonfigurovány na působení některých prvků stránky.

Události prvky stránky

Stránka element může být klíčem k nalezení informací, význam - přijmout obsah textového pole a zjistí, že napsal návštěvníka. Tato akce se může objevit na položky menu, obrázek, textové pole. V každém případě bude JavaScriptu funkce spustit, který může vykonávat AJAX požadavek takto:

InitXML ( '../ Mphp / scSrvPhpWord.php? CTask = GoPage' + 'a cOwnerCode =' + cOwnerCode
+ 'A CSessionCode =' + cSessionCode + '& cActiveItem =' + cActiveItem);

Tak funkce InitXML () je definována následovně (proměnná var scXHR popsán mimo funkce):

Funkce InitXML (scURL) {

scXHR = null;

if (window.XMLHttpRequest)
{try
{ScXHR = new XMLHttpRequest ();
} Catch (e) {}
} else
if (window.ActiveXObject)
{try
{ScXHR = nový ActiveXObject ( 'Msxml2.XMLHTTP');
} Catch (e)
{try
{ScXHR = nový ActiveXObject ( 'Microsoft.XMLHTTP');
} Catch (e) {}
}
}
if (scXHR)
{
scXHR.open ( 'GET', scURL);
scXHR.onreadystatechange = WaitReplySC;
scXHR.send (null);
};
}

Tato funkce má adresu URL a iniciuje požadavek na to. Asynchronní odpověď přijde, jakmile splní skript zadaný v URL (v tomto případě - scSrvPhpWord.php, který se nachází v ../Mphp/ složka vzhledem ke kořenové místo), a začne WaitReplySC () funkce, která jde do vstupu na server XML-response, včetně názvu a obsahu.

odpověď serveru

Ve skutečnosti je server PHP skript - program, který začne s instalací základních podmínek, stáhne potřebné vybavení, předběžné úpravy, která je závislá na smyslu pro vývojáře:

namespace PhpOffice \ PhpWord;

ini_set ( 'display_errors', 1);
error_reporting (E_ALL ^ E_NOTICE);

ignore_user_abort (true);
set_time_limit (12);

použijte PhpOffice \ PhpWord \ MphpObj \ scDocuments;

require_once 'PhpOffice / PhpWord / Autoloader.php';
\ \ PhpOffice PhpWord \ AUTOLOADER :: registr ();

Představoval začátek značka označující všechny chyby, zakazuje zastavit skript, když se uživatel odhlásí a stanoví lhůtu k provedení případ smyčky - 12 sekund. Vedle knihovna PhpOffice \ PhpWord pro dokumenty * .docx.

Jak je uvedeno výše AJAX volání ( '... cTask = GoPage' + 'a cOwnerCode =' + cOwnerCode + 'a cSessionCode =' + cSessionCode + 'a cActiveItem =' + cActiveItem) - čtyři get-proměnné, které mohou nebo nemusí být, měli kontrolovat jejich skutečné dostupnosti:

$ CTask = (isset ($ _ GET [ 'cTask']))? $ _GET [ 'cTask']: '';
$ COwnerCode = (isset ($ _ GET [ 'cOwnerCode']))? $ _GET [ 'cOwnerCode']: '';
$ CSessionCode = (isset ($ _ GET [ 'cSessionCode']))? $ _GET [ 'cSessionCode']: '';
$ CActiveItem = (isset ($ _ GET [ 'cActiveItem']))? $ _GET [ 'cActiveItem']: '';

Po provedení přípravné akce skript rozhodne, že:

switch ($ cTask) {

Případ ‚GoPage‘: // (to je výzva během počátečního stažení nebo aktualizovat stránku)

$ COwnerCode = 'cOwner';
$ CSessionCode = 'cSession';
$ CContents = 'cContents';
$ CStatus = 'cStatus';
$ Chtml = iconv ( 'UTF-8', 'CP1251', ‚kódující prvek„);
$ CActiveItem = iconv ( 'UTF-8', 'CP1251', 'proměnné');

$ CReply = "scSrvRM | GoPage | set | {$ cOwnerCode}` {$ cSessionCode} | {$ cContents} `{$ cStatus} | $ {} cHTML | {$ cActiveItem}";

break;

}

a závěrečnou část skriptu:

header ( "Content-Type: text / xml; accept-charset = utf-8");
header ( "Cache-Control: no-cache");
echo '';
$ CReply = iconv ( 'CP1251', 'UTF-8', $ cReply); // převod z 'CP1251' v 'UTF-8'
echo $ cReply;

Získání reakci zákazníků

Na stránce, který je načten do prohlížeče, bylo zjištěno, že jakmile bude server přípravu odpovědi, bude bráno v úvahu funkce WaitReplySC:

funkce WaitReplySC () {

try {

if (scXHR.readyState == 4) {
if (scXHR.status == 200) {// zpracování odezvy

var TestReply = scXHR.responseText;

if (( 'error Parse' TestReply.indexOf ()> 0) ||
(TestReply.indexOf (dále jen 'oznámení')> 0)) alert (scXHR.responseText);

var cdata = scXHR.responseText;
var ADATA = cData.split ( '|');

var cCmd = adata [1];
var CPO = adata [2];
var aOwnerSession = adata [3] metody split ( '`');
cOwnerCode = aOwnerSession [0];
var cSessionCode = aOwnerSession [1];
var aContentStatus = adata [4] metody split ( '`');
var cContent = aContentStatus [0];
var cStatus = aContentStatus [1];
var cHTML = adata [5]; // server HTML odezvy
var cVarValues = adata [6]; // proměnné pro formuláře

spínač (cCmd) {

Případ 'GoPage':

var dTestLine = document.getElementById ( 'scTestLine');
dTestLine.innerHTML = 'odpověď = [' + cOwnerCode + ''
+ CSessionCode + ''
+ CContent + ''
+ CStatus + ''
+ CHTML + ''
+ CVarValues + ']';

break;
}

} Else {
. Document.getElementById ( 'scAreaStatus') innerHTML = "Chyba !!!";
}
}
} Catch (e) {}

}

Tedy, s použitím AJAX příklady, načtení stránky v prohlížeči získá (v scTestLine prvku):

Odpověď = [cOwner, cSession, cContents, cStatus, prvky kódování s proměnnou hodnoty]

Na reprezentaci kódu, jQuery a WordPress

Stránky v prohlížeči a skript textu napsaného v UTF-8, pro funkci použití iconv () k převedení ruské znaky. Zbytek skeletu představovaného kód je velmi jednoduchý a může být snadno opakovat pro konkrétní účel.

Mohou být změněny pouze v odpovědi na zpracování serveru WaitReplySC () funkce a aktuální kód skript, který generuje odezvu. Volá funkce InitXML (pro konkrétní scURL a příslušných údajů k tomu) jsou umístěny v obslužné rutiny z prvků stránky a definovat význam těchto prvků.

Prezentované příklady AJAX-orientované na „ruční“ využívání technologií.

V různých redakčního systému (SMS), možnosti jsou popsány v různých způsobech, zpravidla ve stylu určitou specificitu. Například jQuery AJAX možností volání jsou realizovány jQuery.ajax () funguje buď na vyšší úrovni: jQuery.get () a jQuery.post (). Parametr se přenáší URL a nastavení (soubor klíčových párů + hodnota). jQuery.ajax () vrací XMLHttpRequest-objekt.

JQuery sledovat výsledky navrhovaných funkčních metod: XHR.done () - úspěšné dokončení požadavku. XHR.fail () - zpracování chyb.

jqXHR.done () metoda yavlyatsya alternativní manipulátor úspěšné dokončení AJAX-žádosti. Nahrazuje metodu zastaralé jqXHR.success ().

Stejně tak, použití na Wordpress AJAX technologie. Tady, všechno má implantován se v systému pro správu obsahu, je nutné použít navrhovanou strukturu pouze. Tyto dokumenty poskytuje podrobný popis.

AJAX aplikace závisí v podstatě na zvolených nástrojů, i když ruční provedení lze použít paralelně nebo navíc k vybrané redakčního systému, jedno nebo jinou verzi jQuery. Ta je užitečná pro práci na své vlastní, protože téměř všechny moderní SMS používat, ale každý svým vlastním způsobem.

Klasickým příkladem aplikace

Jednoduché a exponenciální využití AJAX - košík internetový obchod. ukládat stránky jsou vždy naplněn zbožím, ačkoli ve skutečnosti to nemusí být. Překládka obvykle trvá značnou dobu, ale když návštěvník vybere produkt, se může vždy jen vzdát na něm nebo změnit vyvolenou, že na místě je vždy žádoucí zobrazovat rychle.

Obvykle je realizován ve formě košů a značek z celého vybraných položek. Bez využití AJAX dynamických změnách těchto prvků je problematické.

Ajax skripty, které implementují mechanismy přidat / odebrat položky do nákupního košíku, se stal de facto v mnoha SMS.

Pro normální přenos dat prostřednictvím AJAX formy mohou být vytvořeny běžným způsobem (pro zadání jména a hesla):