[MUSIC]
In questo esercizio, esploreremo alcuni dei moduli nodo codice.
In particolare, vedremo il modulo HTTP che è integrato nel nodo e
utilizzare il modulo HTTP per configurare e avviare un semplice server web.
Vedremo anche come possiamo servire i file statici dal nostro server HTTP nodo.
Vedremo anche a quel modulo di file system e il modulo di percorso e
come possono aiutarci a servire i file statici nel nostro server HTTP basato su nodo.
Quindi cerchiamo di esplorare alcuni dei moduli nodo codice in questo esercizio.
Per iniziare a utilizzare questo esercizio, andare in una posizione comoda sul computer.
Quindi andremo alla cartella NodeJS che abbiamo già creato in uno
degli esercizi precedenti.
E nella cartella NodeJS, creerò una nuova cartella denominata node-http.
E poi, lo imposteremo come un'applicazione nodo.
Inoltre, spostandosi nella cartella node-http,
creiamo una sottocartella lì chiamato pubblico che continuerà
alcuni dei file html che ci server dalla nostra applicazione HTTP nodo.
Ora spostandosi su un terminale, passare al nodo,
cartella -http.
E inizializziamo questa cartella per essere nella nostra applicazione.
Quindi inizieremo con npm init e
inizializzeremo quel pacchetto nel nostro file JSON qui.
E poi daremo il nome del pacchetto come node-http e
accettare la versione standard, e
la descrizione è Node HTTP Module Esempio.
E il punto di partenza è index.js, nessun comando di test,
nessun repository git per il momento, e autore,
digita il tuo nome e accetta il resto così com'è.
E questo dovrebbe creare il pacchetto per un file manifest JSON.
Ora apriamo questo progetto nel nostro editor preferito.
Quindi fammi avviare il mio codice di Visual Studio in questa cartella.
E nel codice di Visual Studio, andiamo al pacchetto nel nostro file JSON.
E poi aggiungeremo in un altro script al pacchetto,
al nostro file JSON chiamato start e
che eseguirebbe indice nodo.
E ricordati di mettere una virgola dopo l'attacco di prova.
E salva le modifiche al file package.json.
Ora in cui Project,
creare un nuovo file chiamato index.js.
Stiamo andando a configurare questo index.js per utilizzare il modulo HTTP nodo.
Quindi, in questo file, scriviamo const
http = require («http»).
Così si può vedere che stiamo usando il modulo di codice HTTP, e
stiamo richiedendo semplicemente specificando il nome del modulo di codice HTTP lì.
Inoltre, dichiariamo,
Un paio di costanti qui e poi,
Chiameremo hostname e
il numero di porta come 3000 per impostazione predefinita.
Ora impostiamo il server.
Per impostare il server, diremo const server = http.
Il modulo HTTP supporta un metodo chiamato CreateServer,
quindi utilizzeranno il metodo CreateServer su questo.
Questo metodo CreateServer prenderà una funzione come parametro e
questa funzione prende due
valori come parametri, richiesta e risposta.
E come puoi vedere, sto scrivendo una funzione freccia qui.
Quindi la richiesta e la risposta sono i due parametri alla funzione che forniamo
come parametro al metodo CreateServer qui.
E all'interno di questo, diremo
console.log (req.headers).
Quindi qui, il req e res sono la richiesta HTTP in arrivo al server.
E loro tipo di oggetto di risposta che sta
per essere costruito da questo server e restituito al client
che si connette a questo server HTTP che stiamo creando qui.
Quindi la richiesta è la richiesta in arrivo da qualsiasi browser o
da qualsiasi luogo che sta cercando di accedere a questo server che stiamo per avviare
utilizzando questa applicazione nodo HTTP che stiamo sviluppando qui.
Quindi dalla richiesta,
l'oggetto richiesta ci dà accesso alle intestazioni nella richiesta HTTP in arrivo.
Quindi ho intenzione di registrare le
intestazioni in arrivo della richiesta HTTP in arrivo utilizzando questo console.log.
Solo per mia informazione, solo per sapere da dove viene questa richiesta.
Successivamente, possiamo costruire la risposta utilizzando la res e
questo ci fornirà un metodo chiamato StatusCode.
Lo StatusCode ci permetterà di impostare lo StatusCode per il messaggio di risposta.
Quindi, in questo caso, imposterò lo StatusCode come 200.
Se ricordi dalla discussione precedente sugli elementi essenziali di rete,
saprai che StatusCode di 200 significa che tutto va bene.
E così, abbiamo impostato il codice di stato qui per il messaggio di risposta e
poi ci sarà anche impostare l'intestazione per il messaggio di risposta.
E uno dei timori di intestazione che stiamo
per impostare è chiamato Content-Type.
E il Content-Type,
specificeremo questo per essere 'testo/html'.
Quindi il corpo della risposta conterrà i dati sotto forma di html qui.
Quindi l'intestazione è impostata per informare il client che stai inviando
la risposta e il corpo è formattato in formato html.
E poi, infine, diremo res.end (').
Quindi questo termina la risposta qui, e quando questo è fatto,
questa informazione verrà inviata al client.
Quindi qui, lasciami costruire una pagina html in linea qui,
quindi dirò <Ciao,
World! .
E chiudi il tag h1, il tag body
e il tag html, proprio lì.
E questa è una risposta HTML valida che può
essere rimandata dal nostro server qui.
Quindi questo server, come ci si aspetta di andare semplicemente inviare un ciao mondo al client.
Quindi, ora che abbiamo impostato il server, abbiamo bisogno di avviare questo server.
Per avviare questo server in nota,
abbiamo bisogno di dire server.listen.
E questo avvierà la porta di ascolto su cui il server ascolterà
le richieste in arrivo.
E questo sarebbe iniziato al numero di porta dato il mio porto,
che abbiamo già impostato qui nella porta const.
E il secondo parametro è il nome host che abbiamo già impostato in precedenza.
E il terzo parametro è una funzione che verrà
eseguita all'avvio del server.
In questa funzione basta andare a stampare le informazioni sul server.
Quindi qui ho intenzione di dire console.log.
E nel console.log,
ho intenzione di stampare le informazioni, quindi userò una citazione indietro.
Quindi nota l'uso della citazione posteriore non la citazione normale.
Il motivo per cui stiamo usando questo è perché useremo
alcune variabili all'interno della stringa che stiamo per costruire qui.
Quindi diremo server in esecuzione a http://.
E poi diremo $ e
poi nome host.
Ricordiamo che questo nome host, hai già dichiarato in precedenza.
E poi la seconda parte,
diremo: $ e porto.
Quindi questi due valori saranno sostituiti con i valori corrispondenti.
E dal momento che stiamo allegando questo tra virgolette posteriori.
E se includi qualcosa all'interno dei rilanci del dollaro,
che sarà sostituito dal suo valore in questa stringa qui.
Questo è tutto.
Abbiamo un semplice server HTTP installato e funzionante.
Quindi salviamo le modifiche a questo.
E andremo ad avviare la nostra applicazione e vedere cosa serve.
Andando al terminale, digitiamo npm start, e
questo dovrebbe avviare la nostra applicazione.
E notiamo che stampa il nostro dicendo che il server in esecuzione
a http://localhost:3000.
Ora puoi accedere a questo URL digitandolo nella barra degli indirizzi di qualsiasi browser.
Quindi fammi avviare una finestra del browser Chrome e quindi digitare questo e
vedere cosa restituirà il server.
Avvio di una nuova finestra.
Permettetemi di digitare http://
localhost: 3000.
E questo dovrebbe restituire un Hello World come ci aspettiamo.
Ora, quando andiamo alla console si vede che sulla console ci sono
i dettagli dell'intestazione delle richieste in arrivo sono stampati qui.
Alcune cose sono molto facili da individuare qui.
Quindi questo è host, localhost: 3000, e vedi anche che «user-agent»
è impostato su «Chrome» qui, la versione di Chrome che sto usando qui.
Quindi questa è un'illustrazione interessante del messaggio di richiesta HTTP.
E ciò che è contenuto nell'intestazione del messaggio di richiesta che è arrivato qui.
Così interessante osservare ciò che il vostro server sta
stampando sullo schermo qui.
Con questo, completiamo la prima metà di questo esercizio.
Ora possiamo inizializzare questa applicazione in un repository Git,
e quindi salvare le modifiche al repository Git.
Quindi andiamo avanti e facciamolo dopo.
Al tipo di prompt, ottenere init, e che inizializzato il repository.
E poi diremo git status e vedrete che questi due file sono nuovi.
Quindi diremo git add.
E fai git commit
-m «Node HTTP Esempio 1".
E poi controlla questo nel nostro repository Git.
Ora ancora un altro strumento che è molto utile
quando stiamo guardando applicazioni lato server è chiamato Postman.
Ora Postman si presenta sotto forma di un'estensione del browser Chrome o
uno strumento autonomo che è possibile scaricare e installare sul computer.
Quindi, per farlo, nel nostro browser digitiamo http.
getpostman.com.
E poi questo è dove puoi ottenere lo
strumento Postman per il tuo sistema operativo specifico e installarlo.
Lo strumento Postman consente di creare richieste HTTP e quindi inviarle.
E ti dà anche la flessibilità di impostare le intestazioni per
la tua richiesta HTTP prima di inviarla.
E poi quando la risposta ritorna, sei in grado di esaminare la risposta
incluse le intestazioni della risposta che ritorna dal lato server.
Quindi trovo che Postman sia molto utile.
Ci sono alcuni altri strumenti come questo,
ma Postman sembra essere il migliore sul mercato al momento.
Quindi ho intenzione di fare uso di Postman per il resto di questo corso.
Se non si desidera installarlo, è
anche possibile installare l'estensione del browser Chrome di Postman e quindi utilizzarlo.
Sto per scaricare la versione macOS di Postman e
poi installarla sulla mia macchina e poi farne uso.
Una volta che hai il Postman, sia la versione standalone o
l'estensione del browser Chrome installato, è possibile avviarlo.
E vedrete che l'interfaccia utente è più o meno la stessa
sia per la versione standard e anche l'estensione del browser Chrome.
E una volta che il Postman è attivo e funzionante
, digita nella casella URL richiesta,
localhost: 3000.
E invia la richiesta a te stesso.
Assicurarsi che il server HTTP Node sia attivo e funzionante.
Quindi, quando invii la richiesta,
otterrai immediatamente una risposta dal server con il codice HTML qui.
Ora il vantaggio, come vedi,
con l'uso di Postman è che puoi vedere il corpo reale del messaggio.
Puoi anche guardare le intestazioni per vedere cosa è stato inviato dal server.
Puoi anche impostare molti dettagli in Postman quando invii.
Richiesta dal server.
Ora molti di questi potrebbero non essere molto facili da fare utilizzando una finestra standard del browser.
Quindi questo è il motivo per cui preferisco usare [INAUDIBLE] per
generare le richieste HTTP sul mio server.
E poi osservando la risposta che ritorna dal lato server.
Si noti inoltre che mostra il codice di stato qui e alcune altre informazioni sulla
richiesta e il tempo di risposta dal lato server.
Ora che abbiamo creato il suo server HTTP basato su semplice nodo,
cerchiamo di estendere ulteriormente, creiamo un paio di file HTML nella cartella pubblica.
Lo chiameremo questo come index.html.
E poi anche aboutus.html,
e quindi solo includere alcune informazioni sulle ossa nude qui.
Quindi diremo html, e
titolo come questo è index.html.
E poi scriveremo nel corpo della pagina html.
Dire h1 Index.html e
il corpo e quindi questo è
il contenuto di questo file.
Alcuni codice html di base qui, fammi copiare questo e
quindi incollare anche nella pagina aboutus.html.
E il contenuto del file aboutus.html, è tutto.
Abbiamo appena creato due pagine HTML, e
queste sono pagine HTML statiche che abbiamo creato nella cartella pubblica.
Ora, possiamo impostare il nostro server HTTP nodo per essere in grado di servire pagine statiche?
Quindi questo è ciò che stiamo andando a configurare nella seconda parte di questo esercizio.
Quindi tornando al file index.js,
oltre al modulo di codice HTTP,
importerò anche il modulo di codice del file system.
E quel modulo di codice percorso.
Il percorso consente di specificare la parte di un file nel file system locale.
Il modulo file system consente di leggere e
scrivere file dal file system locale.
Quindi con questo, diranno server costante, http.CreateServer.
Per il registro della console, invece di digitare intere intestazioni delle richieste,
digiterò semplicemente informazioni sufficienti, quindi
dirò, Richiesta per,
Solo l'URL di quella richiesta.
Per metodo.
Quindi il metodo sarebbe ottenere il post della porta o eliminare i metodi.
Quindi questo registrerà queste informazioni.
Ora, quello che faremo è invece di inviare
questa risposta, la risposta standard hello world.
Qui, ci accingiamo ad esaminare il metodo e
poi diremo se req.method è uguale a GET.
Quindi serviremo solo richieste GET in questo esempio.
Altrimenti, diremo che c'è un if.
Quindi, se c'è una richiesta GET che entra,
allora esamineremo,
L'URL che entra,
quindi diremo se req.url è/,
diremo FileURL uguale a html.
Quindi, se non si ottiene un nome di file specifico, ma
si invia semplicemente la richiesta al codice host locale 3000.
Sarà predefinito il index.html,
altrimenti dirà che FileURL è uguale a req.url.
Quindi in questo modo, hai costruito quale file al server.
Ora, diremo Troveremo il percorso del file,
diremo percorso, Resolve,
quindi il modulo percorso supporta questo metodo di risoluzione, quindi
questo tradurrà questo nel file completo delle cartelle percorso,
il file che abbiamo appena costruito,
il FileUrl che abbiamo appena costruito.
Quindi questo ci darà il percorso completo per il file, e
poi diremo costante FileExtension.
Quindi, se vuoi assicurarti che
l'estensione del nome del file sia HTML.
Quindi, dal FilePath,
esamineremo l'estensione del nome del file e
poi diremo se FileExt ==.
Quindi, se si tratta di un file HTML, allora sappiamo come servirlo da questa particolare
relazione del server HTTP nodo.
Quindi diremo se l'estensione del file è HTML, allora sappiamo che
il file è un file HTML e abbiamo i due file, indice e aboutus.html.
Quindi controlleremo per vedere se questo file esiste, quindi
diremo se il file esiste, FilePath.
Quindi il metodo exists controllerà se il file esiste,
quindi diremo fs.exists (FilePath),
e questo prenderà
come secondo parametro, una funzione di richiamo.
Quindi notare l'uso della prima funzione di richiamo nel nostro esempio.
Quindi questa funzione di callback verrà chiamata con questo parametro esiste lì dentro.
Quindi all'interno di questo parametro di callback, questo esiste sarà vero o falso.
Quindi questo è il parametro return per questa funzione di callback.
Quindi qui, controlleremo, e
diremo se (! esiste), quindi
il che significa che il file non esiste,
allora diremo res.statusCode = 404.
Ricordiamo che se il file non esiste, invierai un codice di stato di 404 dicendo che
non puoi trovare il file.
E poi diremo res.setHeader,
e imposteremo l'intestazione su 'Content-Type',
'text/html'.
E poi abbiamo bisogno di inviare il, file HTML qui, o il codice HTML.
Quindi farò il codice HTML di base, il corpo html h1.
Errore 404,
diremo, + FileURL +
'non trovato'.
E chiudere, La pagina HTML.
Quindi qui, come noti, stai usando la funzione esiste del
modulo del file system per verificare se il file esiste.
Quindi dai il percorso del file come primo parametro e
il secondo è la funzione di callback.
All' interno di questa funzione di callback, se dice che esiste è falso, allora
invierai un messaggio di errore standard 404, dicendo che non è possibile trovare il file.
E dopo averlo fatto, ci sarà semplicemente,
tornare, altrimenti,
Diciamo res.statusCode
= 200, res.setHeader,
('Content-Type', 'text/html').
Ora, dobbiamo leggere il file e poi inviare il file.
Quindi questo è dove, dal modulo del file system,
useremo il CreateReadStream,
che prenderà il FilePath come parametro.
Quindi questo metodo CreateReadStream leggerà nel file da questo FilePath.
E poi convertirlo in flusso di byte,
e poi lo reindirizzeranno alla risposta.
Così che sarà incluso nella risposta, nel corpo della risposta.
Quindi in questo modo abbiamo appena preso il file e
poi costruito nella risposta qui.
E questo è tutto, il file è pronto per essere inviato, ok?
Quindi questo è se l'estensione del file è html,
stiamo controllando per assicurarci che tu gestisca correttamente questo.
Quindi questo è dove leggerai il file e poi lo invierai.
Se l'estensione del file non è html, ovviamente, abbiamo bisogno di inviare un messaggio di errore.
Quindi proprio lì vedremo, copieremo questo
particolare, Codice da qui.
E poi incollalo li' dentro.
Diciamo, altrimenti statusCode = 404, testo contesto/html,
e il messaggio di errore dice, Errore 404, FileURL.
Non è stato trovato,
ma non è un file HTML.
Quindi questo è l'errore che invieremo in questo caso.
E infine, per l'ultimo caso,
quindi qui stiamo dicendo il metodo.
Quindi questo altro corrisponde al metodo di richiesta.
Quindi, se il metodo di richiesta non è GET, ma qualche altro metodo di richiesta,
allora non gestiremo che in questa versione la nostra applicazione Node.
Quindi invieremo indietro StatusCode 404,
Content html, e diremo Errore 404.
E diremo, metodo req,
Non, supportato,
non supportato da questo server HTML nodo qui, il gioco è fatto.
Con queste modifiche, ora siamo pronti a riavviare il nostro browser.
E poi lascia che serva i file HTML qui.
Quindi cerchiamo di salvare le modifiche, E poi andare a riavviare il nostro server, e
poi esaminare ciò che invia quando inviamo varie richieste al server.
Andando al terminale, se il server è in esecuzione,
interromperlo digitando Ctrl+C, quindi riavviare il server.
E quando il server è attivo e funzionante, inviamo alcune richieste ad esso.
In primo luogo, da un browser, e successivamente da Postman.
Vai nella finestra del browser, digitiamo localhost: 3000 e
vediamo che questo restituisce il file index.html come ci aspettiamo.
E poi diremo localhost: 3000/index.html,
e questo restituirà anche il file index.html.
Ora, se inviamo aboutus.html, dice Aboutus.html, e lo restituisce correttamente.
Vediamo ora inviare una richiesta per aboutus.txt, e vedere cosa fa.
Quindi dice che /aboutus.txt non è un file HTML.
Quindi inviamo una richiesta a test.html.
E sappiamo che test.html non esiste, quindi dice /test.html non trovato.
Quindi vediamo che utilizzando il browser, siamo in grado di recuperare
quei file che esistono, e il server è in grado di inviare i file al browser.
Andiamo ora a Postman e proviamo a generare le stesse richieste,
e vedere la risposta dal server.
Quindi, andando a Postman, inviamo una richiesta GET a localhost: 3000/.
E vedi che questo restituisce il file index.html.
Inviamo una richiesta a aboutus.html.
E poi vedi che restituisce il file aboutus.html.
E poi invieremo una richiesta al file di testo,
e poi dice errore 404, non un file HTML.
E vedrete che lo stato qui dice, 404 non trovato.
E poi noi, invece di inviare una richiesta GET,
vedere questo è il vantaggio di utilizzare Postman, invierò una richiesta PUT.
E noterai che questo dice, Errore: PUT non supportato, e
così con lo stato 404 qui, e così via.
Quindi questo è il modo in cui è possibile configurare un server HTTP nodo
per essere in grado di servire file, file HTTP in questo caso particolare.
Ora puoi facilmente immaginare di estendere
questo server HTTP per gestire molti tipi diversi di file e così via.
Ma naturalmente, di conseguenza,
il codice diventerà anche più complicato di quello che abbiamo in questo momento.
Con questo, completiamo questo esercizio.
In questo esercizio, abbiamo visto come possiamo impostare un semplice
server HTTP basato su nodo che serve i file dal nostro sito server.
[ MUSIC]