Σε αυτό το σεμινάριο, θα μελετήσουμε το πλαίσιο Express. Αυτό το πλαίσιο είναι κατασκευασμένο με τέτοιο τρόπο ώστε να λειτουργεί ως ένα ελάχιστο και ευέλικτο πλαίσιο εφαρμογών ιστού Node.js, παρέχοντας ένα ισχυρό σύνολο δυνατοτήτων για τη δημιουργία μονής και πολλαπλής σελίδας και υβριδικής εφαρμογής ιστού.
Σε αυτό το σεμινάριο, θα μάθετε-
- Τι είναι το Express.js;
- Εγκατάσταση και χρήση του Express
- Τι είναι οι διαδρομές;
- Δείγμα διακομιστή Web χρησιμοποιώντας το express.js
Τι είναι το Express.js;
Το Express.js είναι ένα πλαίσιο διακομιστή εφαρμογών ιστού Node js, το οποίο έχει σχεδιαστεί ειδικά για τη δημιουργία εφαρμογών ιστού μιας σελίδας, πολλών σελίδων και υβριδικών.
Έχει γίνει το τυπικό πλαίσιο διακομιστή για το node.js. Το Express είναι το backend μέρος ενός γνωστού ως στοίβα MEAN.
Το MEAN είναι μια δωρεάν στοίβα λογισμικού JavaScript ανοιχτού κώδικα για τη δημιουργία δυναμικών ιστότοπων και εφαρμογών ιστού που έχει τα ακόλουθα στοιχεία.
1) MongoDB - Η τυπική βάση δεδομένων NoSQL
2) Express.js - Το προεπιλεγμένο πλαίσιο εφαρμογών ιστού
3) Angular.js - Το πλαίσιο JavaScript MVC που χρησιμοποιείται για εφαρμογές Ιστού
4) Node.js - Πλαίσιο που χρησιμοποιείται για επεκτάσιμες εφαρμογές διακομιστή και δικτύωσης.
Το πλαίσιο Express.js διευκολύνει την ανάπτυξη μιας εφαρμογής που μπορεί να χρησιμοποιηθεί για τον χειρισμό πολλαπλών τύπων αιτημάτων, όπως τα αιτήματα GET, PUT και POST και DELETE.
Εγκατάσταση και χρήση του Express
Το Express εγκαθίσταται μέσω του Node Package Manager. Αυτό μπορεί να γίνει εκτελώντας την ακόλουθη γραμμή στη γραμμή εντολών
npm εγκατάσταση express
Η παραπάνω εντολή ζητά από τον διαχειριστή πακέτων Node να κατεβάσει τις απαιτούμενες μονάδες express και να τις εγκαταστήσει ανάλογα.
Ας χρησιμοποιήσουμε το πρόσφατα εγκατεστημένο πλαίσιο Express και δημιουργήστε μια απλή εφαρμογή "Hello World".
Η εφαρμογή μας πρόκειται να δημιουργήσει μια απλή ενότητα διακομιστή η οποία θα ακούσει τον αριθμό θύρας 3000. Στο παράδειγμά μας, εάν υποβληθεί αίτημα μέσω του προγράμματος περιήγησης σε αυτόν τον αριθμό θύρας, τότε η εφαρμογή διακομιστή θα στείλει μια απάντηση «Γεια» στον κόσμο .
var express=require('express');var app=express();app.get('/',function(req,res){res.send('Hello World!');});var server=app.listen(3000,function() {});
Επεξήγηση κώδικα:
- Στην πρώτη γραμμή κώδικα, χρησιμοποιούμε τη συνάρτηση απαιτείται για να συμπεριλάβουμε το "express module."
- Πριν μπορέσουμε να αρχίσουμε να χρησιμοποιούμε το express module, πρέπει να κάνουμε ένα αντικείμενο.
- Εδώ δημιουργούμε μια συνάρτηση επανάκλησης. Αυτή η συνάρτηση θα καλείται κάθε φορά που κάποιος περιηγηθεί στη ρίζα της εφαρμογής ιστού μας που είναι http: // localhost: 3000 . Η λειτουργία επανάκλησης θα χρησιμοποιηθεί για την αποστολή της συμβολοσειράς «Hello World» στην ιστοσελίδα.
- Στη λειτουργία επανάκλησης, στέλνουμε τη συμβολοσειρά "Hello World" πίσω στον πελάτη. Η παράμετρος «res» χρησιμοποιείται για την αποστολή περιεχομένου πίσω στην ιστοσελίδα. Αυτή η παράμετρος «res» είναι κάτι που παρέχεται από την ενότητα «αίτημα» για να μπορέσει κάποιος να στείλει περιεχόμενο πίσω στην ιστοσελίδα.
- Στη συνέχεια, χρησιμοποιούμε τη λειτουργία ακρόασης για να κάνουμε την εφαρμογή διακομιστή μας να ακούει αιτήματα πελατών στη θύρα αριθ. 3000. Μπορείτε να καθορίσετε οποιαδήποτε διαθέσιμη θύρα εδώ.
Εάν η εντολή εκτελεστεί με επιτυχία, η ακόλουθη έξοδος θα εμφανιστεί όταν εκτελείτε τον κωδικό σας στο πρόγραμμα περιήγησης.
Παραγωγή:
Από την έξοδο,
- Μπορείτε να δείτε ξεκάθαρα ότι εάν περιηγηθούμε στη διεύθυνση URL του localhost στη θύρα 3000, θα δείτε τη συμβολοσειρά «Hello World» στη σελίδα.
- Επειδή στον κώδικά μας έχουμε αναφέρει ειδικά για τον διακομιστή για ακρόαση στη θύρα αριθ. 3000, είμαστε σε θέση να δούμε την έξοδο κατά την περιήγηση σε αυτήν τη διεύθυνση URL.
Τι είναι οι διαδρομές;
Η δρομολόγηση καθορίζει τον τρόπο με τον οποίο μια εφαρμογή ανταποκρίνεται σε ένα αίτημα πελάτη σε ένα συγκεκριμένο τελικό σημείο.
Για παράδειγμα, ένας πελάτης μπορεί να υποβάλει αίτημα GET, POST, PUT ή DELETE http για διάφορες διευθύνσεις URL, όπως αυτές που εμφανίζονται παρακάτω.
http://localhost:3000/Bookshttp://localhost:3000/Students
Στο παραπάνω παράδειγμα,
- Εάν υποβληθεί ένα αίτημα GET για το πρώτο URL, τότε η απάντηση θα πρέπει ιδανικά να είναι μια λίστα βιβλίων.
- Εάν το αίτημα GET υποβληθεί για τη δεύτερη διεύθυνση URL, τότε η απόκριση θα πρέπει ιδανικά να είναι μια λίστα μαθητών.
- Έτσι, με βάση τη διεύθυνση URL στην οποία θα προσπελαστεί, θα ζητηθεί μια διαφορετική λειτουργικότητα στον διακομιστή ιστού και, κατά συνέπεια, η απάντηση θα σταλεί στον πελάτη. Αυτή είναι η έννοια της δρομολόγησης.
Κάθε διαδρομή μπορεί να έχει μία ή περισσότερες λειτουργίες χειριστή, οι οποίες εκτελούνται όταν ταιριάζει η διαδρομή.
Η γενική σύνταξη για μια διαδρομή φαίνεται παρακάτω
app.METHOD(PATH, HANDLER)
Εν,
1) Η εφαρμογή είναι μια παρουσία του express module
2) Η μέθοδος METHOD είναι μια μέθοδο αιτήματος HTTP (GET, POST, PUT ή DELETE)
3) Το PATH είναι μια διαδρομή στο διακομιστή.
4) HANDLER είναι η συνάρτηση που εκτελείται όταν ταιριάζει η διαδρομή.
Ας δούμε ένα παράδειγμα για το πώς μπορούμε να εφαρμόσουμε διαδρομές στο express. Το παράδειγμά μας θα δημιουργήσει 3 διαδρομές ως
- Διαδρομή A / Node που θα εμφανίζει τη συμβολοσειρά "Tutorial on Node" εάν έχει πρόσβαση σε αυτήν τη διαδρομή
- A / Γωνιακή διαδρομή που θα εμφανίζει τη συμβολοσειρά "Tutorial on Angular" εάν έχει πρόσβαση σε αυτήν τη διαδρομή
- Μια προεπιλεγμένη διαδρομή / η οποία θα εμφανίζει τη συμβολοσειρά "Καλώς ήρθατε στα Tutorials Guru99".
Ο βασικός μας κώδικας θα παραμείνει ο ίδιος με τα προηγούμενα παραδείγματα. Το παρακάτω απόσπασμα είναι ένα πρόσθετο για να δείξει τον τρόπο υλοποίησης της δρομολόγησης.
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');}));
Επεξήγηση κώδικα:
- Εδώ ορίζουμε μια διαδρομή εάν έχει επιλεγεί η διεύθυνση URL http: // localhost: 3000 / Node στο πρόγραμμα περιήγησης. Στη διαδρομή, επισυνάπτουμε μια συνάρτηση επανάκλησης που θα κληθεί όταν περιηγηθούμε στο Node URL.
Η συνάρτηση έχει 2 παραμέτρους.
- Η κύρια παράμετρος που θα χρησιμοποιήσουμε είναι η παράμετρος «res», η οποία μπορεί να χρησιμοποιηθεί για την αποστολή πληροφοριών πίσω στον πελάτη.
- Η παράμετρος «req» περιέχει πληροφορίες σχετικά με το αίτημα που υποβάλλεται. Μερικές φορές θα μπορούσαν να αποσταλούν πρόσθετες παράμετροι ως μέρος του αιτήματος που υποβάλλεται, και ως εκ τούτου η παράμετρος «req» μπορεί να χρησιμοποιηθεί για την εύρεση των επιπλέον παραμέτρων που αποστέλλονται.
- Χρησιμοποιούμε τη λειτουργία αποστολής για να στείλουμε τη συμβολοσειρά "Tutorial on Node" στον πελάτη εάν έχει επιλεγεί η διαδρομή Node.
- Εδώ καθορίζουμε μια διαδρομή εάν έχει επιλεγεί η διεύθυνση URL http: // localhost: 3000 / Angular στο πρόγραμμα περιήγησης. Στη διαδρομή, επισυνάπτουμε μια συνάρτηση επανάκλησης που θα κληθεί όταν περιηγηθούμε στη γωνιακή διεύθυνση URL.
- Χρησιμοποιούμε τη λειτουργία αποστολής για να στείλουμε τη συμβολοσειρά "Tutorial on Angular" στον πελάτη εάν έχει επιλεγεί η διαδρομή Γωνιακή.
- Αυτή είναι η προεπιλεγμένη διαδρομή που επιλέγεται κατά την περιήγηση στη διαδρομή της εφαρμογής - http: // localhost: 3000 . Όταν επιλεγεί η προεπιλεγμένη διαδρομή, το μήνυμα "Καλώς ήλθατε στα Guru99 Tutorials" θα σταλεί στον πελάτη.
Εάν η εντολή εκτελεστεί με επιτυχία, η ακόλουθη έξοδος θα εμφανιστεί όταν εκτελείτε τον κωδικό σας στο πρόγραμμα περιήγησης.
Παραγωγή:
Από την έξοδο,
- Μπορείτε να δείτε ξεκάθαρα ότι εάν περιηγηθούμε στη διεύθυνση URL του localhost στη θύρα 3000, θα δείτε τη συμβολοσειρά «Καλώς ήλθατε στα Guru99 Tutorials» να εμφανίζεται στη σελίδα.
- Επειδή στον κώδικα μας, αναφέραμε ότι το προεπιλεγμένο URL θα εμφανίζει αυτό το μήνυμα.
Από την έξοδο,
- Μπορείτε να δείτε ότι εάν η διεύθυνση URL έχει αλλάξει σε / Κόμβος, θα επιλεγεί η αντίστοιχη διαδρομή κόμβου και θα εμφανίζεται η συμβολοσειρά "Tutorial On Node"
Από την έξοδο,
- Μπορείτε να δείτε ότι εάν η διεύθυνση URL έχει αλλάξει σε / Γωνιακή, θα επιλεγεί η αντίστοιχη διαδρομή κόμβου και θα εμφανίζεται η συμβολοσειρά "Tutorial On Angular".
Δείγμα διακομιστή Web χρησιμοποιώντας το express.js
Από το παραπάνω παράδειγμά μας, έχουμε δει πώς μπορούμε να αποφασίσουμε ποια έξοδος θα εμφανίζεται με βάση τη δρομολόγηση. Αυτό το είδος δρομολόγησης είναι αυτό που χρησιμοποιείται στις περισσότερες σύγχρονες διαδικτυακές εφαρμογές. Το άλλο μέρος ενός διακομιστή ιστού αφορά τη χρήση προτύπων στο Node js.
Κατά τη δημιουργία γρήγορων εφαρμογών Node on-the-fly, ένας εύκολος και γρήγορος τρόπος είναι να χρησιμοποιήσετε πρότυπα για την εφαρμογή. Υπάρχουν πολλά διαθέσιμα πλαίσια στην αγορά για την κατασκευή προτύπων. Στην περίπτωσή μας, θα πάρουμε το παράδειγμα του πλαισίου jade για templating.
Το Jade εγκαθίσταται μέσω του διαχειριστή πακέτων Node. Αυτό μπορεί να γίνει εκτελώντας την ακόλουθη γραμμή στη γραμμή εντολών
npm εγκατάσταση jade
Η παραπάνω εντολή ζητά από τον διαχειριστή πακέτων Node να πραγματοποιήσει λήψη των απαιτούμενων ενοτήτων jade και να τις εγκαταστήσει ανάλογα.
ΣΗΜΕΙΩΣΗ: Στην τελευταία έκδοση του Node jade έχει καταργηθεί. Αντ 'αυτού, χρησιμοποιήστε πατημασιά.
Ας χρησιμοποιήσουμε το πρόσφατα εγκατεστημένο πλαίσιο jade και δημιουργήστε μερικά βασικά πρότυπα.
Βήμα 1) Το πρώτο βήμα είναι να δημιουργήσετε ένα πρότυπο jade. Δημιουργήστε ένα αρχείο που ονομάζεται index.jade και εισαγάγετε τον παρακάτω κώδικα. Βεβαιωθείτε ότι έχετε δημιουργήσει το αρχείο στο φάκελο "προβολές"
- Εδώ καθορίζουμε ότι ο τίτλος της σελίδας θα αλλάξει σε οποιαδήποτε τιμή μεταβιβάζεται όταν γίνεται επίκληση αυτού του προτύπου.
- Προσδιορίζουμε επίσης ότι το κείμενο στην ετικέτα κεφαλίδας θα αντικατασταθεί από ό, τι περνάει στο πρότυπο jade.
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() {});
Επεξήγηση κώδικα:
- Το πρώτο πράγμα που πρέπει να προσδιορίσετε στην εφαρμογή είναι η "μηχανή προβολής" που θα χρησιμοποιηθεί για την απόδοση των προτύπων. Δεδομένου ότι πρόκειται να χρησιμοποιήσουμε το jade για την απόδοση των προτύπων μας, το προσδιορίζουμε αναλόγως.
- Η λειτουργία απόδοσης χρησιμοποιείται για την απόδοση μιας ιστοσελίδας. Στο παράδειγμά μας, αποδίδουμε το πρότυπο (index.jade) που δημιουργήθηκε νωρίτερα.
- Μεταβιβάζουμε τις τιμές "Guru99" και "Welcome" στις παραμέτρους "title" και "message" αντίστοιχα. Αυτές οι τιμές θα αντικατασταθούν από τις παραμέτρους «τίτλος» και «μήνυμα» που δηλώνονται στο πρότυπο index.jade.
Εάν η εντολή εκτελεστεί με επιτυχία, η ακόλουθη έξοδος θα εμφανιστεί όταν εκτελείτε τον κωδικό σας στο πρόγραμμα περιήγησης.
Παραγωγή:
Από την έξοδο,
- Μπορούμε να δούμε ότι ο τίτλος της σελίδας ορίζεται σε "Guru99" και η κεφαλίδα της σελίδας ορίζεται σε "Καλώς ήλθατε".
- Αυτό οφείλεται στο πρότυπο jade που γίνεται επίκληση στην εφαρμογή κόμβου js.
Περίληψη
- Το express πλαίσιο είναι το πιο κοινό πλαίσιο που χρησιμοποιείται για την ανάπτυξη εφαρμογών Node js. Το express πλαίσιο είναι χτισμένο πάνω από το πλαίσιο node.js και βοηθά στην ταχεία ανάπτυξη εφαρμογών που βασίζονται σε διακομιστές.
- Οι διαδρομές χρησιμοποιούνται για την εκτροπή των χρηστών σε διαφορετικά μέρη των εφαρμογών Ιστού με βάση το αίτημα που υποβλήθηκε. Η απόκριση για κάθε διαδρομή μπορεί να ποικίλλει ανάλογα με το τι πρέπει να εμφανίζεται στον χρήστη.
- Τα πρότυπα μπορούν να χρησιμοποιηθούν για την έγχυση περιεχομένου με αποτελεσματικό τρόπο. Το Jade είναι ένας από τους πιο δημοφιλείς κινητήρες templating που χρησιμοποιούνται σε εφαρμογές Node.js.