Историята на развитието на уеб-приложения
Като се има предвид това, че или нова технология, първо е необходимо да се разбере какво тази технология е най-необходима и това, което тя позволява (или по-лесно), за да направи това, не позволяват на други технологии. За да се разбере по-ясно какви условия са до появата на AJAX, можете да видите процеса на еволюционното развитие на уеб-сайтове.
В зората на интернет сайта, е набор от прости статични страници - потребителят заяви ресурс от сървъра и сървърът връща статичната страница. Тази страница е прост HTML текст, и се съхранява като текстов файл на сървъра. Тази страница се доставя като е до потребителя и, освен това, не са имали от страна на клиента скриптове.
Първият опит да се направи страници по-динамичен е Common Gateway Interface (CGI). CGI позволява на разработчиците да създават изпълними програми, които са генерирали страница, която позволява на потребителя да направи настройки. Като се има предвид тези параметри, е възможно да се генерира уникален страница. Като цяло, на подхода, използван днес в една и съща ASP.NET, PHP и т.н.
Генериране на страниците на сървъра страна е хубаво, но е принуден всеки път, дори и най-незначителен действие на потребителя, който отправя искането към сървъра пренатоварване на цялата страница. За да не се претовари на цялата страница, когато частта за сървър е абсолютно не е необходимо, клиентски скриптове започнаха да се използва.
Аплети и флаш
Ако все още се изисква искане до сървъра, както и някои от страна на клиента скриптове не могат да направят - разработчиците в уеб-страници започват да използват така наречените аплети и флаш.
1. На сървърът не отидете всички елементи на страницата (или по-скоро не им стойности), и само в минимални данни, необходими за извършване на конкретна молба и отговорът се получи, не е цялата страница, а само необходимите данни за намаляване на трафика в десетки ( а понякога и стотици) пъти.
2. Не претоварвайте случва на страницата в браузъра и потребителят остава с впечатлението, че всичко, което се случва на компютъра си.
За тази технология и ние ще отидем по-нататък.
Браузърът на обектен модел.
Ако ме питате какво е основа на принципа на технологията AJAX, а след това вероятно ще отговори. "Благодарение на модела на браузъра обект." Що за такъв модел на браузъра обект (DOM)?
Документ обектния модел (DOM) - спецификация стандартизиран W3C комитет, който е по-платформа и описва предизвикателствата и описанието на работата на самия документ, нейната структура, HTML, XML и стилове. Както подсказва името, на базата на спецификацията на DOM са обекти.
Този обект се появява за първи път в Internet Explorer 5.0 и е изпълнена като ActiveX компонент. Важно е да се отбележи, че този обект не е W3C стандарт, въпреки че голяма част от функционалността му е описан в спецификацията «The DOM Level 3 зареждат и съхраняват Спецификация». Поради тази причина, неговото поведение може да бъде малко по-различно в различните браузъри. Но във всички браузъри, тя изпълнява същите функции - тя е в състояние да ги изпраща към сървър и да получите отговор от него. Както бе споменато по-горе, този обект не е стандартизирана, и създаването на своя инстанция може да бъде различен в различни версии, така че "сигурно" създаването му по-добро използване на код, който комбинира инстанция създаване на няколко браузъри като кода по-долу:
XMLHttpRequest има редица "стандартни" (стандартен, защото, както е посочено по-горе цитира, този обект не е стандартизиран за всички браузъри) свойства и методи, които позволяват на този обект, за да изпратите заявка за проверка на статуса на искането и получаването резултат заявка от отдалечения сървър. Тези свойства и методи ще бъдат обсъдени в следващите две таблици.
Таблица 1 показва "стандартни" свойства XMLHttpRequest
Той се прекратява текущата заявка
Връща всички заглавни реагиране под формата на ключ / стойност
Извежда стойността на посочения заглавката
отворена (метод, URL asynch, потребителско име, парола)
Задава статуса на заявката до сървъра. Първият параметър определя метода на заявката - казано, GET, POST, второ - URL адрес на заявката, третата (по желание) - тип поискване (синхронна или асинхронна), четвърти и пети (също по желание) - за защитени страници
Изпраща заявка към сървъра
Тя определя стойността на конкретно заглавие. Преди да се обадите на този метод, трябва да се обадите на отворения метод
XMLHttpRequest също съдържа редица свойства, които са изброени по-долу:
манипулатор събитие, което се случва при всяка промяна на състоянието поискване
Състояние на заявката. Следните стойности са налични: 0 - поиска неподготвен за 1 - натоварване, 2 - товарене свърши, 3 - интерактивен, 4 - пълен
В отговор от сървъра като низ
В отговор от сървъра като XML. Тази задача може да бъде обработен и проверена като DOM
HTML код на състоянието (Например 200 - OK).
Име HTML код за състоянието на
Т.е. при заявяване на страницата, която се връща hanlder текст / обикновена хартия с един ред "Hello World". Ние сме доволни от този манипулатор не може да бъде по-добре.
Сега се създаде нормален HTML - страница, която ще бъде изпълнена заявката използване XMLHttpRequest.
Този код е доста проста. Когато кликнете върху "Старт Asynchronous Заявка" се нарича клиент функция startRequest, което от своя страна първоначално причинява вече прегледана функцията createXMLHttpRequest да създаде XMLHttpRequest обект и след това докосва (функцията клиент handleStateChange) на манипулатор на ReadyStateChange събитие за този обект, се отваря и изпраща заявка , Ако заявената страница е на разположение и е получена информацията, статус се променя състоянието си при 200. функция Затова handleStateChange ние проверяваме стойността на този имот. Когато желаната стойност чрез сигнал се извлече получава стойност. Опитайте как става това:
Този прост код по същество положи всички функции Аякс - извличане на данни от сървъра, без да презаредите страницата. разбирането на този механизъм е достатъчно да се разбере същността на AJAX и успешно я използват в своите приложения. Освен това, само технически въпрос и след това се вгледаме в изпълнението на всичко това, но с помощта на ASP.NET J
Използване на AJAX в ASP.NET
Обратните страница призовава.
Обратни повиквания - специален вид форми за връщане, т.е. Page минава един цикъл от събития, но тези форми са върнати на клиента преди началото на формите на процеса рендиране, т.е. , за да прехвърлите. Както при всяко поискване AJAX започва изпълнение от страна на клиента в резултат на настъпване на някое събитие, клиентът управлява вградена функция, наречена WebForm_DoCallback. Тази функция има следния прототип:
pageID - ID на страницата, което го прави един разговор,
аргумент - аргумент низ премина към сървъра,
returnCallback - клиент функция или скрипт клиент, който трябва да бъде изпълнена след контрол от страна на сървъра се връща
контекст - данни, които се предават returnCallback.
errorCallback - клиент функция или скрипт клиент, който се изпълнява при възникване на грешка
useAsync - установява дали искането за синхронна или асинхронна.
На следващия етап - сървъра страница трябва да е наясно, че тя трябва да подкрепя обратни повиквания (т.е. най-вече за да се върнете на данни преди да се изобрази на страницата). За да направите това, тази страница трябва да осъзнае интерфейс System.Web.UI.IcallbackEventHandler.
Този интерфейс съдържа два метода:
За да се обади, за да сървъра страна се състои от 2 етапа: подготовка и връщане на резултата. метод RaiseCallbackEvent се нарича първи и има за цел да се подготви за отдалечено изпълнение на код. метод GetCallbackResult се изпълнява по-късно, когато резултатът е готов да бъде изпратен. Това разделяне се въвежда само във версията на освобождаване на NET 2.0, в предишни версии на тези два метода се смесват в един (това е направено с оглед на асинхронни операцията). метод GetCallbackResult връща низ, така че върнатите данни трябва да бъдат сериализирани, по някакъв начин да се низ, клиентът противоречи десериализиране.
Когато заявите страница от клиент сценария на първия изтече първоначален, след което стандартната събитие линия за зареждане на страницата преди Заредете събитие, в Load имот IsCallback настроен да е истина, завършването на Load изпълни методи ICallbackEventHandler интерфейс, а след това, както е споменато по-горе изпълнение се прекъсва, без да навлиза в етапа изобразяване. На първо място, тя казва, че не е етап от запазване ViewState, така че се опитват всичко, за да спаси ViewState стандартен метод е безполезна (това е разбираемо, тъй като ViewState на страницата не се актуализира). Той се справя комуникации между страницата и така наречения сървър обратни извиквания мениджър. обратни извиквания мениджър е клиент-скрипт библиотека. Това клиент скрипт форма и да изпрати искане, получава и разбор на отговор от сървъра и т.н. Търся Преглед на изходния код всяка страница, можете да видите линии като
След като изтеглите файла, който връща манипулатор WebResource.axd с тези параметри, можете да се рови в изучаването на страната на клиента, скриптове, които са отговорни за по-горе стъпки J
Писане метод WebForm_DoCallback клиент не е нищо сложно, но е свързано с някои трудности в случай на динамично генериране или предавателни параметри. За този клас Page.ClientScript (System.Web.UI.ClientScriptManager) въведе специален метод - GetCallbackEventReference, която получава редица параметри, и други подобни, например, метод GetPostBackEventReference, генерира съответния клиентски код. Не бих казал, че този метод е много елегантен, особено когато трябва да премине параметри, за да klienskij на скрипта (особено наличието на единични и двойни кавички в kontateniruyuscheysya линия разваля цялата картина), но по-комфортно, отколкото в областта на челото, за да напишете WebForm_DoCallback.
Този метод има следния прототип:
насочите - страница или WebControl, че ще се справят с телефонния секретар. В съответствие с това на страницата или контрол следва да прилагат ICallbackEventHandler интерфейс, в противен случай тя ще бъде изключение е хвърлен:
System.InvalidOperationException: Целевата "__Page" за телефонния секретар, не може да бъде намерен или не изпълни ICallbackEventHandler.
Генерира първи параметър функция WebForm_DoCallback
аргумент - аргумента, прехвърлена към функцията на клиент или скрипт. Съответства на втората функция параметър WebForm_DoCallback.
returnCallback - клиент функция или скрипт клиент, който трябва да бъде изпълнена след сървъра странични връща контрола (трети параметър WebForm_DoCallback)
контекст - данни, които се предават на клиента returnCallback (4 параметър WebForm_DoCallback).
errorCallback - клиент функция или скрипт клиент, който се изпълнява при възникване на грешка (на 5-ти параметър WebForm_DoCallback)
useAsync - определя дали искането е синхронна или асинхронна (6 WebForm_DoCallback параметър).
Нека се опитаме да го решим с помощта на AJAX.
За да направите това, създайте редовен ASPX страница:
Тогава осъзнаваш ICallbackEventHandler интерфейс за страница клас:
Ние се нуждаем, за да получите в метод eventArgument RaiseCallbackEvent, направи необходимото действие, а след това преминава към GetCallbackResult да върне на клиента. За да направите това, ще се въведе една променлива evArg.
На следващо място, ние трябва да прикрепите клиент манипулатор за първи изберете. Т.е. когато промените стойността, която се нарича WebForm_DoCallback функция. И написването J
Сега напишете 2 методи, първият от които е необходимо само веднъж - за обвързващ списък на производителите, а вторият - за списък с модели. За да не страдат от DB да направи по-лесно по следния начин:
И затова, за да се пренесат в списъка на производителите, е необходимо да се добавят в Page_Load:
Сега ние трябва да направите 2 неща - да се напише функция клиент, за да бъде изпълнена след завръщането и напишете кода за функциите и RaiseCallbackEvent GetCallbackResult.
Първо напишете кода за тези 2 функции:
Параметърът eventArgument RaiseCallbackEvent буксуване функция на вътрешния променлива evArg (тази стойност е избран производител), и по GetCallbackResult perebindiv списък с модели в една и съща променлива влиза всички стойности модели за даден производител, като ги раздели като ";" (един вид метод сериализация).
На следващо място, пише клиентската функция CallbackFunction на. Тази функция трябва да се почиства при някои модели и получаване на поредица от GetCallbackResult, десериализиране стойността и завърши SELECT новите стойности.
Това е в общи линии всичко. Този пример, разбира се, не е съвършен (например, не включва обработка на грешки), но работи добре. Можете да проверите това, като отворите тази страница:
За да добавите към вашите компоненти ATLAS проекта трябва първо да се уверите, че ATLAS е инсталиран на вашия компютър, в противен случай го инсталирате. След това ще можете или да създадете проект като "АТЛАС" Уеб сайт, или да добавите линк към библиотеката. Във втория случай, трябва да конфигурирате web.config да се използва ръчна ATLAS.
По време на това писание, ATLAS включени 21 контрол, някои от които се използват доста често, други аз лично, освен никъде, използвани в приложения за изпитване. Контрол CascadingDropDown е ATLAS реализация на това, което сме написали по-горе J най-широко се използва и гъвкав, по мое мнение, е контрола на UpdatePanel - този панел (на клиента, той се превръща в един DIV елемент), който може да бъде претоварен, без претоварване на страницата, и тя може да съдържа други контроли , UpdatePanel се състои от 2 части - ContentTemplate и тригери. ContentTemplate е ContentTemplate съдържание площ (т.е., както казах, може да е от другите контроли ASP.NET, HTML тагове и обикновен текст). Задействащи списък на критериите за задействане на дадена UpdatePanel. Trigger - е като че събитието манипулатор, за които това UpdatePanel да се актуализира. Тригери са 2 вида - ControlEventTrigger и ControlValueTrigger. Първият от тях отговаря на контрола на събитието (например, контрол е Бътън и прихващат събития събитие клик), а вторият - от свойствата на промяната (като например промяна на стойностите на текста за контролния текст полето). Например, следния код:
1. (и най-голям), когато потребител, и в този момент, че е време да претовари - потребителят губи фокуса и следователно част от посланието, което той вече се е разписвал
2. претоварване силите на потребителя да се изчака, докато страницата се зарежда и затова той трябваше да размишлявам върху индикатор бяла страница в долната част на мишката
3. претоварване не може да се направи, защото твърде често в допълнение към текста себе си също беше изтеглите всички страници атрибути - снимки, лога, банери, HTML маркиране
Създаването на такъв разговор с всички възможности на AJAX мога да предложа на читателя, но с помощта на ATLAS компонент - UpdatePanel - ние създаваме днес.
1. На формата добавите друг бутон и да го направи невидим.
3. UpdatePanel добавите спусъка на този ключ:
Също така е необходимо да се регистрирате в <%@ Page %> - EnableEventValidation = "невярно"
4. Също така в тялото маркер: при зареждане = "setInterval (" UpdatingPanel () ", 3000);"
Как работи - клиентската функция UpdatingPanel грубо симулира натискане на бутона btnUpdate. защото в UpdatePanel има спусък за този бутон - извикването на тази функция ще доведе klienskij актуализация UpdatePanel. Ние можем да наричаме тази функция само на клиенти на редовни интервали, което е това, което правим в организма.
В резултат на това, ние получихме следния код:
За да изпробвате тази проста версия на чата с помощта на ATLAS в практиката - отворите няколко браузъра с тази страница и във всяка от тях пишете на публикацията. В този случай, можете да видите, че след написването на втория съобщението в браузъра, тя ще се появи след първите 3 секунди.
В тази статия, аз описано основите на AJAX в ASP.NET и аз се надявам, че това ще помогне на програмистите да започнат да използват тази технология в своите ASP.NET приложения.
Свързани статии