Преглед садржаја
Један од најдиректнијих начина на који можемо доћи до корисничких података у веб апликацијама је путем образаца, иако постоји много механизама који омогућавају да ти подаци дођу до наше логике и контролора апликација, дубоко у себи морају слиједити иста правила као и обрасци ХТМЛ, користите неки метод ХТТП за слање информација.Ово чини способност обраде и манипулације облицима виталном ако желимо да направимо потпуне веб апликације, са функционалностима које се могу узети у обзир и које развијају наше идеје.
1- Да бисмо извршили овај водич, морамо испунити неке претходне услове, прво морамо имати инсталацију Ноде.јс функционална, онда морамо имати пројекат са изразитиНије важно што нема структуру фасцикли, али нам је оквир потребан да буде доступан на локацији.
2- Морамо имати основне појмове о нпм, и од ХТМЛ, јер иако су концепти објашњени на врло једноставан начин, постоје основе које нису објашњене, као што је шта је ознака или шта је ХТМЛ атрибут.
3- Коначно нам је потребан претраживач и уређивач текста да бисмо могли писати и потврђивати нашу апликацију.
Пре него што погледате рад на изразити Да бисмо обрадили обрасце, морамо мало дубље познавати њихове основне аспекте, јер су они витални део изградње наших апликација када желимо или морамо да прикупимо корисничке податке.
Погледајмо следећи код где смо створили једноставан облик поља које снима наше омиљено воће.
Ваше омиљено воће:ПошаљиУ првом случају, образац мора бити састављен од ознаке унутар овог, мора постојати најмање један атрибут метода то ће нашем прегледачу указивати на начин на који ће нам слати информације ПОШТА или ДОБИТИ, које су основне ХТТП методе, можемо поставити и атрибут тзв поступакАко ово не постоји, образац ће бити послат на исту руту која га служи, ако постоји, биће послат на руту која је наведена као у случају примера.
Опште карактеристикеУ оквиру нашег обрасца све ознаке функционишу ХТМЛ оно што желимо, међутим важнији су они за унос података као у случају типова јер су ове ознаке и њихова вредност оне које ће се послати у време прихвати што је друга врста уноса која нам је потребна, будући да је то дугме за радњу. Добићемо податке са именом које смо дали својствима иам сваког од поља које смо креирали, важно је такође поставити атрибут ид у свако поље и да је јединствен како би се могло манипулисати елементима у њему. СУНЦЕ на елегантан начин.
Како видимо форму ХТМЛ Иако је врло једноставан елемент, има неколико детаља које вреди истаћи, истакнути и објаснити како би се избегла забуна у будућности.
Након што добијемо образац, имамо много опција, без обзира на оквир који користимо изразити, Ларавел, Дјангоитд. Постоји процес који је добро пратити, јер је то онај који ће нашем кориснику рећи да ли су њихови подаци примљени, да ли су обрађени или је дошло до грешке. Овај процес се може поделити у две групе, одговор и преусмеравање.
ОдговорУ овој радној групи, када корисник пошаље образац и обавимо обраду, можемо послати одговор ХТМЛ у исто време, односно штампамо поруку или креирамо нови приказ, овде вам можемо рећи да ли су подаци тачни или је дошло до грешке. Овај одговор може бити тип АЈАКС, тако да се генерира без потпуног учитавања странице, или при поновном учитавању прикаже нови приказ или једноставно генерира анимирану поруку са ЈаваСцрипт.
РедирецтионУ овој другој групи, након што обрадимо информације, преусмеравамо и шаљемо корисника или у други приказ, или једноставно на екран на којем им се захваљујемо што користе нашу апликацију, то може изгледати исто као и одговор, међутим оно што ми радимо је пошаљите корисника на друго место у нашој апликацији.
За припрему наше апликације изразити Да бисмо обрадили обрасце, прво морамо инсталирати додатак тзв боди-парсер, ово ће нам помоћи да манипулишемо подацима које нам прегледач шаље. Да бисте то урадили у нашој конзоли Ноде.јс морамо користити упутства:
нпм инсталл --саве боди-парсерПогледајмо одговор генерисан извршавањем ове инструкције:
Онда већ унутар наше датотеке апп.јс или име које смо поставили, једноставно морамо укључити овај међупростор који ће нам помоћи у интеракцији:
апп.усе (рекуире ('боди-парсер') ());Овим смо спремни за обраду садржаја наших образаца, директно у нашој апликацији изразити, Можда се чини донекле сложеним јер други оквири не захтијевају ову врсту инсталације изразити да ли нам то даје слободу да обрађујемо информације како желимо, ово је само један од многих постојећих путева.
Направићемо образац који има функцију хватања корисниковог омиљеног воћа. Користићемо онај који смо креирали у претходном одељку водича за већу лакоћу, у нашој фасцикли у коју смо инсталирали изразити, креирајмо датотеку под називом сервер.јс, апп.јс или било које име које желимо да ставимо, међутим садржај је важна ствар. Унутра ћемо почети тако што ћемо захтевати употребу изразити, тада морамо генерирати апликацијски објект и то мора користити међуопреме боди-парсер.
Дефинишите рутеСљедећи чин морамо дефинирати руте, у нашем случају ћемо користити роот руту за приказ обрасца, па ћемо при директном приступу нашој апликацији имати резултат директно, тада ћемо створити руту која се назива процес која прима метода ПОШТА, ово што ће урадити је да прими податке обрасца да коначно одштампа а ХТМЛ указујући на примљене податке.
То ће нам омогућити да разумемо ток нашег програма, и на тај начин бити у могућности да обрађујемо сложеније облике у будућности. Погледајмо објашњени код испод:
вар екпресс = рекуире ('екпресс'); вар бодиПарсер = рекуире ('боди-парсер'); вар апп = екпресс (); апп.усе (бодиПарсер ()); апп.сет ('порт', процесс.енв.ПОРТ || 3001); апп.гет ('/', фунцтион (рек, рес) {вар хтмл = '' + '' + ''+' Ваше омиљено воће: '+' '+''+''+' Пошаљи '+''+' '; рес.сенд (хтмл); }); апп.пост ('/ процесс', фунцтион (рек, рес) {вар фруит = рек.боди.фруит; вар хтмл = 'Ваше омиљено воће је:' + фруит + '.Овим смо довршили израду наше апликације, сада ћемо прегледати како је приказати, за то једноставно морамо написати упутство:
'+' Покушај поново. '; рес.сенд (хтмл); }); апп.листен (апп.гет ('порт'), фунцтион () {цонсоле.лог ('Екпресс је покренут на хттп: // лоцалхост:' + апп.гет ('порт') + '; притисните Цтрл-Ц да бисте затворили сервер. ');});
чвор сервер.јсГде сервер.јс То је име које смо ставили у нашу апликацију, а у зависности од порта који смо поставили, тада можемо видети наш образац у прегледачу:
Наравно, ово може бити естетскије коришћењем Боотстрап, или стилова ЦССМеђутим, за сврхе и опсег овог водича савршено је за разумевање руковања обрасцима. Ако будемо у интеракцији са њим тако што ћемо написати нешто у поље и кликнути на пошаљи, видећемо како ћемо доћи до нашег Урл процес:
У овом случају оставили смо везу за повратак на почетак, ова обрада припада типу преусмеравања, пошто смо корисника послали на другу руту и тамо примили резултат његовог упита, наравно да постоје многе потврде које нам недостају у овом примеру, на пример, ако је празно поље послато, како проверавамо да ли је пошиљка направљена са другог порекла итд. Они су ваљане ствари, али избегавају циљ водича, ми их само спомињемо како бисте знали да следе други кораци у њиховом развоју као програмера у изразити.
Овим смо завршили овај водич, као што видимо изразити Много нам олакшава ствари када преносимо информације са предњег краја у нашу логику, поједностављено руковање рутама и употреба посредничког софтвера који нам помаже у декодирању информација чини их савршеним за уштеду времена за развој.Да ли вам се допао и помогао овај водич?Можете наградити аутора притиском на ово дугме да бисте му дали позитиван поен