Samouczek dotyczący Node.js Express Framework — naucz się w 10 minut

Przez: Jamesa Hartmana Jamesa Hartmana
Hours Zaktualizowano

W tym samouczku przyjrzymy się frameworkowi Express. Struktura ta jest zbudowana w taki sposób, że działa jak minimalna i elastyczna platforma aplikacji internetowych Node.js, zapewniając solidny zestaw funkcji do tworzenia jedno- i wielostronicowych oraz hybrydowych aplikacji internetowych.

Co to jest Express.js?

Express.js to środowisko serwera aplikacji internetowych Node js, zaprojektowane specjalnie do tworzenia jednostronicowych, wielostronicowych i hybrydowych aplikacji internetowych.

Stało się standardowym frameworkiem serwerowym dla node.js. Express jest częścią backendową czegoś znanego jako stos MEAN.

MEAN jest darmowym i otwartym oprogramowaniem JAVASCRIPT pakiet oprogramowania do tworzenia dynamicznych witryn internetowych i aplikacji internetowych, składający się z następujących komponentów:

1) MongoDB – Standardowa baza danych NoSQL

2) Express.js – Domyślny framework aplikacji internetowych

3) Angular.js - JavaSkrypt struktury MVC używany w aplikacjach internetowych

4) node.js – Framework używany do skalowalnych aplikacji serwerowych i sieciowych.

Framework Express.js bardzo ułatwia tworzenie aplikacji, których można używać do obsługi wielu typów żądań, takich jak żądania GET, PUT, POST i DELETE.

Instalowanie i korzystanie z Expressu

Express instaluje się za pośrednictwem Node Package Manager. Można to zrobić, wykonując następujący wiersz w wierszu poleceń

npm zainstaluj ekspresowo

Powyższe polecenie żąda od menedżera pakietów Node pobrania wymaganych modułów ekspresowych i odpowiedniego ich zainstalowania.

Wykorzystajmy nasz nowo zainstalowany framework Express i stwórzmy prostą aplikację „Hello World”.

Nasza aplikacja utworzy prosty moduł serwera, który będzie nasłuchiwał na porcie o numerze 3000. W naszym przykładzie, jeśli przez przeglądarkę zostanie wysłane żądanie na tym numerze portu, to aplikacja serwera wyśle ​​do klienta odpowiedź „Hello' World” .

Instalowanie i korzystanie z Expressu

var express=require('express');
var app=express();
app.get('/',function(req,res)
{
res.send('Hello World!');
});
var server=app.listen(3000,function() {});

Wyjaśnienie kodu:

  1. W pierwszym wierszu kodu używamy funkcji require w celu dołączenia „modułu ekspresowego”.
  2. Zanim zaczniemy korzystać z modułu express, musimy zrobić z niego obiekt.
  3. Tutaj tworzymy funkcję wywołania zwrotnego. Ta funkcja zostanie wywołana za każdym razem, gdy ktoś przejdzie do katalogu głównego naszej aplikacji internetowej, czyli http://localhost:3000 . Funkcja wywołania zwrotnego zostanie użyta do wysłania ciągu znaków „Hello World” na stronę internetową.
  4. W funkcji wywołania zwrotnego odsyłamy do klienta ciąg znaków „Hello World”. Parametr „res” służy do wysyłania treści z powrotem na stronę internetową. Ten parametr „res” jest udostępniany przez moduł „żądanie”, aby umożliwić wysłanie treści z powrotem na stronę internetową.
  5. Następnie używamy funkcji nasłuchiwania, aby nasza aplikacja serwerowa nasłuchiwała żądań klientów na porcie nr 3000. Tutaj możesz określić dowolny dostępny port.

Jeśli polecenie zostanie wykonane pomyślnie, po uruchomieniu kodu w przeglądarce zostanie wyświetlony następujący komunikat.

Wyjście:

Express.js.

Z wyjścia,

  • Można wyraźnie zobaczyć, że jeśli przejdziemy do adresu URL localhost na porcie 3000, na stronie zostanie wyświetlony napis „Hello World”.
  • Ponieważ w naszym kodzie wspomnieliśmy specjalnie o tym, aby serwer nasłuchiwał na porcie nr 3000, możemy wyświetlić dane wyjściowe podczas przeglądania tego adresu URL.

POWIĄZANE ARTYKUŁY

Co to są trasy?

Routing określa sposób, w jaki aplikacja odpowiada na żądanie klienta kierowane do określonego punktu końcowego.

Na przykład klient może wysłać żądanie http GET, POST, PUT lub DELETE dla różnych adresów URL, takich jak te pokazane poniżej;

http://localhost:3000/Books
http://localhost:3000/Students

W powyższym przykładzie

  • Jeśli dla pierwszego adresu URL zostanie wysłane żądanie GET, odpowiedzią powinna być w idealnym przypadku lista książek.
  • Jeśli żądanie GET zostanie wysłane dla drugiego adresu URL, wówczas odpowiedzią powinna być w idealnym przypadku lista Studentów.
  • Zatem w zależności od adresu URL, do którego uzyskano dostęp, zostanie wywołana inna funkcja na serwerze WWW i odpowiednio odpowiedź zostanie wysłana do klienta. Taka jest koncepcja routingu.

Każda trasa może mieć jedną lub więcej funkcji obsługi, które są wykonywane po dopasowaniu trasy.

Ogólna składnia trasy jest pokazana poniżej

app.METHOD(PATH, HANDLER)

W którym,

1) aplikacja jest instancją modułu ekspresowego

2) METODA to metoda żądania HTTP (GET, POST, PUT lub DELETE)

3) PATH to ścieżka na serwerze.

4) HANDLER to funkcja wykonywana po dopasowaniu trasy.

Spójrzmy na przykład, jak możemy zaimplementować trasy w ekspresie. Nasz przykład utworzy 3 trasy jako

  1. Trasa /Node, która wyświetli ciąg „Samouczek na węźle”, jeśli zostanie uzyskany dostęp do tej trasy
  2. Trasa /Angular, która wyświetli ciąg „Tutorial on Angular”, jeśli zostanie uzyskany dostęp do tej trasy
  3. Domyślna trasa /, która wyświetli ciąg „Witamy w samouczkach Guru99”.

Nasz podstawowy kod pozostanie taki sam, jak w poprzednich przykładach. Poniższy fragment jest dodatkiem prezentującym sposób implementacji routingu.

Trasy w Node.js

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');
}));

Wyjaśnienie kodu:

  1. Tutaj definiujemy trasę, jeśli adres URL http://localhost:3000/Node jest zaznaczone w przeglądarce. Do trasy dołączamy funkcję zwrotną, która zostanie wywołana po przejściu do adresu URL węzła. Funkcja posiada 2 parametry.
  • Głównym parametrem, którego będziemy używać, jest parametr „res”, którego można użyć do przesłania informacji z powrotem do klienta.
  • Parametr „req” zawiera informację o złożonym żądaniu. Czasami w ramach wysyłanego żądania mogą zostać przesłane dodatkowe parametry, dlatego też parametr „req” może zostać użyty do znalezienia wysyłanych dodatkowych parametrów.
  1. Używamy funkcji send, aby wysłać ciąg „Tutorial on Node” z powrotem do klienta, jeśli wybrano trasę Node.
  2. Tutaj definiujemy trasę, jeśli adres URL http://localhost:3000/Angular jest zaznaczone w przeglądarce. Do trasy dołączamy funkcję zwrotną, która zostanie wywołana, gdy przejdziemy do adresu URL Angulara.
  3. Używamy funkcji send, aby wysłać ciąg „Tutorial on Angular” z powrotem do klienta, jeśli wybrano trasę Angular.
  4. Jest to domyślna trasa wybierana podczas przeglądania trasy aplikacji – http://localhost:3000. Po wybraniu trasy domyślnej do klienta zostanie wysłana wiadomość „Witamy w samouczkach Guru99”.

Jeśli polecenie zostanie wykonane pomyślnie, po uruchomieniu kodu w przeglądarce zostanie wyświetlony następujący komunikat.

Wyjście:

Trasy w Node.js

Z wyjścia,

  • Można wyraźnie zobaczyć, że jeśli przejdziemy do adresu URL localhost na porcie 3000, na stronie pojawi się napis „Witamy w samouczkach Guru99”.
  • Ponieważ w naszym kodzie wspomnieliśmy, że nasz domyślny adres URL będzie wyświetlał ten komunikat.

Trasy w Node.js

Z wyjścia,

  • Można zauważyć, że jeśli zmieniono adres URL na /Node, wybrana zostanie odpowiednia trasa węzła i wyświetlony zostanie ciąg „Tutorial On Node”.

Trasy w Node.js

Z wyjścia,

  • Można zobaczyć, że jeśli zmieniono adres URL na /Angular, wybrana zostanie odpowiednia trasa węzła i wyświetlony zostanie ciąg „Tutorial On Angular”.

Przykładowy serwer WWW korzystający z express.js

Z naszego powyższego przykładu widzieliśmy, jak możemy zdecydować, jakie dane wyjściowe mają być wyświetlane w oparciu o routing. Ten rodzaj routingu jest używany w większości współczesnych aplikacji internetowych. Druga część serwera WWW polega na używaniu szablonów w Node js.

Podczas tworzenia szybkich, „w locie” aplikacji Node, łatwym i szybkim sposobem jest użycie szablonów aplikacji. Na rynku dostępnych jest wiele frameworków do tworzenia szablonów. W naszym przypadku weźmiemy przykład jadeitowego szkieletu do tworzenia szablonów.

Jade instaluje się za pomocą menedżera pakietów Node. Można to zrobić, wykonując następujący wiersz w wierszu poleceń

npm zainstaluj jade

Powyższe polecenie żąda od menedżera pakietów Node pobrania wymaganych modułów Jade i odpowiedniego ich zainstalowania.

UWAGA: W najnowszej wersji Node jade jest przestarzały. Zamiast tego użyj mopsa.

Skorzystajmy z naszego nowo zainstalowanego frameworku Jade i utwórzmy kilka podstawowych szablonów.

Krok 1) Pierwszym krokiem jest utworzenie szablonu jadeitu. Utwórz plik o nazwie Index.jade i wstaw poniższy kod. Pamiętaj, aby utworzyć plik w folderze „views”.

Przykładowy serwer WWW korzystający z Express.js

  1. Tutaj określamy, że tytuł strony zostanie zmieniony na dowolną wartość przekazaną po wywołaniu tego szablonu.
  2. Określamy również, że tekst w znaczniku nagłówka zostanie zastąpiony tym, co zostanie przekazane w szablonie jade.

Przykładowy serwer WWW korzystający z Express.js

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() {});

Wyjaśnienie kodu:

  1. Pierwszą rzeczą, którą należy określić w aplikacji, jest „silnik widoku”, który będzie używany do renderowania szablonów. Ponieważ do renderowania naszych szablonów będziemy używać jadeitu, określimy to odpowiednio.
  2. Funkcja render służy do renderowania strony internetowej. W naszym przykładzie renderujemy szablon (index.jade), który został utworzony wcześniej.
  3. Wartości „Guru99” i „Witamy” przekazujemy odpowiednio do parametrów „tytuł” ​​i „wiadomość”. Wartości te zostaną zastąpione parametrami „title” i „message” zadeklarowanymi w szablonie Index.jade.

Jeśli polecenie zostanie wykonane pomyślnie, po uruchomieniu kodu w przeglądarce zostanie wyświetlony następujący komunikat.

Wyjście:

Przykładowy serwer WWW korzystający z Express.js

Z wyjścia,

  • Widzimy, że tytuł strony zostaje ustawiony na „Guru99”, a nagłówek strony na „Witamy”.
  • Dzieje się tak z powodu szablonu jadeitu, który jest wywoływany w naszej aplikacji węzła js.

Podsumowanie

  • Framework ekspresowy jest najpowszechniejszym frameworkiem używanym do tworzenia aplikacji Node js. Framework ekspresowy jest zbudowany na bazie frameworka node.js i pomaga w szybkim opracowywaniu aplikacji serwerowych.
  • Trasy służą do przekierowywania użytkowników do różnych części aplikacji internetowych na podstawie złożonego żądania. Reakcja dla każdej trasy może się różnić w zależności od tego, co należy pokazać użytkownikowi.
  • Szablony mogą służyć do efektywnego wstrzykiwania treści. Jade to jeden z najpopularniejszych silników szablonów używanych w aplikacjach Node.js.