V tomto výučbe sa budeme venovať rámcu Express. Tento rámec je zostavený takým spôsobom, že funguje ako minimálny a flexibilný rámec webových aplikácií Node.js, ktorý poskytuje robustnú sadu funkcií na vytváranie jednostranných a viacstránkových a hybridných webových aplikácií.
V tomto návode sa naučíte
- Čo je Express.js?
- Inštalácia a používanie Express
- Čo sú trasy?
- Ukážkový webový server používajúci express.js
Čo je Express.js?
Express.js je platforma servera webových aplikácií Node js, ktorá je špeciálne navrhnutá na vytváranie jednostránkových, viacstránkových a hybridných webových aplikácií.
Stal sa štandardným serverovým rámcom pre node.js. Express je backendová časť niečoho známeho ako MEAN stack.
MEAN je bezplatný a otvorený zdrojový softvér JavaScriptu na vytváranie dynamických webových stránok a webových aplikácií, ktorý obsahuje nasledujúce komponenty;
1) MongoDB - štandardná databáza NoSQL
2) Express.js - predvolený rámec webových aplikácií
3) Angular.js - Rámec JavaScript MVC používaný pre webové aplikácie
4) Node.js - rámec používaný pre škálovateľné serverové a sieťové aplikácie.
Rámec Express.js umožňuje veľmi ľahko vyvinúť aplikáciu, ktorú je možné použiť na spracovanie viacerých typov požiadaviek, ako sú požiadavky GET, PUT a POST a DELETE.
Inštalácia a používanie Express
Express sa inštaluje pomocou Správcu balíkov uzlov. To je možné vykonať vykonaním nasledujúceho riadku v príkazovom riadku
npm install express
Vyššie uvedený príkaz žiada manažéra balíkov uzlov, aby stiahol požadované expresné moduly a podľa toho ich nainštaloval.
Využime náš novo nainštalovaný rámec Express a vytvorme si jednoduchú aplikáciu „Hello World“.
Naša aplikácia vytvorí jednoduchý serverový modul, ktorý bude načúvať na porte číslo 3000. V našom príklade, ak sa prostredníctvom prehliadača uskutoční požiadavka na tomto čísle portu, serverová aplikácia pošle klientovi odpoveď „Hello“ World. .
var express=require('express');var app=express();app.get('/',function(req,res){res.send('Hello World!');});var server=app.listen(3000,function() {});
Vysvetlenie kódu:
- V našom prvom riadku kódu používame funkciu require na zahrnutie „expresného modulu“.
- Predtým, ako začneme používať expresný modul, musíme si z neho vytvoriť objekt.
- Tu vytvárame funkciu spätného volania. Táto funkcia sa bude volať vždy, keď niekto prejde na koreň našej webovej aplikácie, ktorým je http: // localhost: 3000 . Funkcia spätného volania sa použije na odoslanie reťazca „Hello World“ na webovú stránku.
- Vo funkcii spätného volania zasielame klientovi reťazec „Hello World“. Parameter „res“ sa používa na odoslanie obsahu späť na webovú stránku. Tento parameter „res“ poskytuje modul „požiadavka“, ktorý umožňuje odosielať obsah späť na webovú stránku.
- Potom používame funkciu počúvania, aby naša serverová aplikácia naslúchala požiadavkám klientov na porte č. 3000. Tu môžete určiť akýkoľvek dostupný port.
Ak je príkaz vykonaný úspešne, pri spustení kódu v prehliadači sa zobrazí nasledujúci výstup.
Výkon:
Z výstupu
- Jasne vidíte, že ak prechádzame na adresu URL localhost na porte 3000, na stránke sa zobrazí reťazec „Hello World“.
- Pretože v našom kóde sme sa zmienili konkrétne o tom, že server má počúvať na porte č. 3000, sme schopní zobraziť výstup pri prechádzaní na túto adresu URL.
Čo sú trasy?
Smerovanie určuje spôsob, akým aplikácia reaguje na požiadavku klienta pre konkrétny koncový bod.
Napríklad môže klient vytvoriť požiadavku GET, POST, PUT alebo DELETE na rôzne adresy URL, ako sú napríklad adresy uvedené nižšie;
http://localhost:3000/Bookshttp://localhost:3000/Students
Vo vyššie uvedenom príklade
- Ak sa zadá žiadosť GET pre prvú adresu URL, potom by odpoveďou mal byť v ideálnom prípade zoznam kníh.
- Ak je zadaná požiadavka GET pre druhú adresu URL, potom by odpoveďou mal byť v ideálnom prípade zoznam študentov.
- Takže na základe adresy URL, ku ktorej sa pristupuje, sa na webovom serveri vyvolá iná funkcionalita a podľa toho sa odošle odpoveď klientovi. Toto je koncept smerovania.
Každá trasa môže mať jednu alebo viac funkcií obsluhy, ktoré sa vykonávajú, keď sa trasa zhoduje.
Všeobecná syntax pre trasu je uvedená nižšie
app.METHOD(PATH, HANDLER)
Z čoho
1) aplikácia je inštanciou expresného modulu
2) METHOD je metóda požiadavky HTTP (GET, POST, PUT alebo DELETE)
3) PATH je cesta na serveri.
4) HANDLER je funkcia vykonaná pri zhode trasy.
Pozrime sa na príklad toho, ako môžeme implementovať trasy v rýchliku. Náš príklad vytvorí 3 trasy ako
- Trasa A / Node, ktorá po zobrazení tejto trasy zobrazí reťazec „Výukový program na uzle“
- A / Uhlová trasa, ktorá v prípade prístupu na túto trasu zobrazí reťazec „Výukový program pre uhlové trate“
- Predvolená trasa /, ktorá zobrazí reťazec „Vitajte na kurzoch Guru99.“
Náš základný kód zostane rovnaký ako v predchádzajúcich príkladoch. Fragment uvedený nižšie predstavuje doplnok na predstavenie implementácie smerovania.
var express = require('express');var app = express();app.route('/Node').get(function(req,res){res.send("Tutorial on Node");});app.route('/Angular').get(function(req,res){res.send("Tutorial on Angular");});app.get('/',function(req,res){res.send('Welcome to Guru99 Tutorials');}));
Vysvetlenie kódu:
- Tu definujeme trasu, ak je v prehliadači vybraná URL http: // localhost: 3000 / Node . K trase pripájame funkciu spätného volania, ktorá sa zavolá, keď prejdeme na adresu URL uzla.
Funkcia má 2 parametre.
- Hlavným parametrom, ktorý použijeme, je parameter „res“, pomocou ktorého je možné odosielať informácie späť klientovi.
- Parameter „req“ obsahuje informácie o uskutočňovanej požiadavke. Niekedy je možné zaslať ďalšie parametre ako súčasť predkladanej požiadavky, a preto je možné na vyhľadanie odosielaných ďalších parametrov použiť parameter „req“.
- Funkciu send používame na odoslanie reťazca „Výukový program na uzle“ späť klientovi, ak je zvolená trasa Uzol.
- Tu definujeme trasu, ak je v prehliadači vybraná adresa URL http: // localhost: 3000 / Angular . K trase pripájame funkciu spätného volania, ktorá sa zavolá, keď prejdeme na hranatú adresu URL.
- Pomocou funkcie send zasielame reťazec „Tutorial on Angular“ späť klientovi, ak je zvolená Angular route.
- Toto je predvolená trasa, ktorá sa vyberie pri prechádzaní na trasu aplikácie - http: // localhost: 3000 . Keď je zvolená predvolená trasa, klientovi sa odošle správa „Vitajte na kurzoch Guru99“.
Ak je príkaz vykonaný úspešne, pri spustení kódu v prehliadači sa zobrazí nasledujúci výstup.
Výkon:
Z výstupu
- Jasne vidíte, že ak prechádzame na adresu URL localhost na porte 3000, na stránke sa zobrazí reťazec „Vitajte v kurzoch Guru99“.
- Pretože v našom kóde sme uviedli, že táto správa by sa zobrazila na našej predvolenej adrese URL.
Z výstupu
- Vidíte, že ak bola adresa URL zmenená na / Node, zvolí sa príslušná trasa Uzla a zobrazí sa reťazec „Výukový program na uzle“.
Z výstupu
- Vidíte, že ak bola adresa URL zmenená na / Angular, zvolí sa príslušná cesta uzla a zobrazí sa reťazec „Tutorial On Angular“.
Ukážkový webový server používajúci express.js
Z nášho vyššie uvedeného príkladu sme videli, ako môžeme na základe smerovania rozhodnúť o tom, aký výstup sa má zobraziť. Tento druh smerovania sa používa vo väčšine moderných webových aplikácií. Druhá časť webového servera je o používaní šablón v Node js.
Pri vytváraní rýchlych aplikácií Node za chodu je jednoduchým a rýchlym spôsobom použitie šablón pre aplikáciu. Na trhu existuje veľa rámcov na tvorbu šablón. V našom prípade si vezmeme príklad nefritového rámca pre šablóny.
Aplikácia Jade sa inštaluje prostredníctvom správcu balíkov uzlov. To je možné vykonať vykonaním nasledujúceho riadku v príkazovom riadku
NPM nainštalovať nefrit
Vyššie uvedený príkaz žiada manažéra balíkov uzlov, aby stiahol požadované nefritové moduly a podľa toho ich nainštaloval.
POZNÁMKA: V najnovšej verzii uzla bol nefrit zastaraný. Namiesto toho použite mops.
Využime náš novo nainštalovaný rámec nefritu a vytvorme niekoľko základných šablón.
Krok 1) Prvým krokom je vytvorenie šablóny nefritu. Vytvorte súbor s názvom index.jade a vložte nasledujúci kód. Nezabudnite vytvoriť súbor v priečinku „zobrazenia“
- Tu určujeme, že pri vyvolaní tejto šablóny sa zmení názov stránky na akúkoľvek hodnotu, ktorá sa odovzdá.
- Tiež špecifikujeme, že text v značke hlavičky bude nahradený všetkým, čo sa dostane v šablóne nefritu.
var express=require('express');var app=express();app.set('view engine','jade');app.get('/',function(req,res){res.render('index',{title:'Guru99',message:'Welcome'})});var server=app.listen(3000,function() {});
Vysvetlenie kódu:
- Prvá vec, ktorú v aplikácii zadáte, je „view engine“, ktorý sa použije na vykreslenie šablón. Pretože na vykreslenie svojich šablón použijeme nefrit, špecifikujeme to zodpovedajúcim spôsobom.
- Funkcia renderovania sa používa na vykreslenie webovej stránky. V našom príklade vykresľujeme šablónu (index.jade), ktorá bola vytvorená skôr.
- Hodnoty „Guru99“ a „Vitajte“ odovzdávame parametrom „názov“ a „správa“. Tieto hodnoty budú nahradené parametrami „title“ a „message“ deklarovanými v šablóne index.jade.
Ak je príkaz vykonaný úspešne, pri spustení kódu v prehliadači sa zobrazí nasledujúci výstup.
Výkon:
Z výstupu
- Vidíme, že názov stránky je nastavený na „Guru99“ a hlavička stránky je nastavená na „Vitajte“.
- Je to tak kvôli nefritovej šablóne, ktorá sa vyvolá v našej aplikácii node n.
Zhrnutie
- Expresný rámec je najbežnejším rámcom používaným na vývoj aplikácií Node js. Expresný rámec je postavený na vrchole frameworku node.js a pomáha pri rýchlom sledovaní vývoja serverových aplikácií.
- Trasy sa používajú na presmerovanie používateľov do rôznych častí webových aplikácií na základe zadanej žiadosti. Odozva pre každú trasu sa môže líšiť v závislosti od toho, čo je potrebné používateľovi zobraziť.
- Šablóny sa dajú použiť na účinné vloženie obsahu. Jade je jedným z najobľúbenejších šablónových nástrojov používaných v aplikáciách Node.js.