Node.js - Express Framework

Экспресс-обзор

Express - это минимальная и гибкая платформа веб-приложений Node.js, которая предоставляет надежный набор функций для разработки веб-приложений и мобильных приложений. Он способствует быстрой разработке веб-приложений на основе узлов. Ниже приведены некоторые из основных функций Express framework.

  • Позволяет настроить промежуточное ПО для ответа на HTTP-запросы.

  • Определяет таблицу маршрутизации, которая используется для выполнения различных действий на основе метода HTTP и URL-адреса.

  • Позволяет динамически отображать HTML-страницы на основе передачи аргументов шаблонам.

Установка Express

Во-первых, установите платформу Express глобально с помощью NPM, чтобы ее можно было использовать для создания веб-приложения с помощью узлового терминала.

$ npm install express --save

Приведенная выше команда сохраняет установку локально в node_modulesкаталог и создает каталог express внутри node_modules. Вы должны установить следующие важные модули вместе с экспресс -

  • body-parser - Это промежуточное ПО node.js для обработки данных формы в формате JSON, Raw, Text и URL.

  • cookie-parser - Разобрать заголовок Cookie и заполнить req.cookies объектом, привязанным к именам файлов cookie.

  • multer - Это промежуточное ПО node.js для обработки данных multipart / form.

$ npm install body-parser --save
$ npm install cookie-parser --save
$ npm install multer --save

Привет, мир, пример

Ниже приведено очень простое приложение Express, которое запускает сервер и прослушивает порт 8081 для подключения. Это приложение отвечаетHello World!для запросов на главную страницу. Для любого другого пути он ответит404 Not Found.

var express = require('express');
var app = express();

app.get('/', function (req, res) {
   res.send('Hello World');
})

var server = app.listen(8081, function () {
   var host = server.address().address
   var port = server.address().port
   
   console.log("Example app listening at http://%s:%s", host, port)
})

Сохраните приведенный выше код в файле с именем server.js и запустите его с помощью следующей команды.

$ node server.js

Вы увидите следующий вывод -

Example app listening at http://0.0.0.0:8081

Откройте http://127.0.0.1:8081/ в любом браузере, чтобы увидеть следующий результат.

Ответ на запрос

Приложение Express использует функцию обратного вызова, параметры которой request и response объекты.

app.get('/', function (req, res) {
   // --
})

  • Объект запроса - объект запроса представляет HTTP-запрос и имеет свойства для строки запроса запроса, параметров, тела, заголовков HTTP и т. Д.

  • Объект ответа - объект ответа представляет HTTP-ответ, который приложение Express отправляет при получении HTTP-запроса.

Вы можете распечатать req и res объекты, которые предоставляют много информации, связанной с HTTP-запросом и ответом, включая файлы cookie, сеансы, URL-адрес и т. д.

Базовая маршрутизация

Мы видели базовое приложение, которое обслуживает HTTP-запрос для домашней страницы. Маршрутизация относится к определению того, как приложение отвечает на запрос клиента к определенной конечной точке, которая является URI (или путем) и конкретным методом HTTP-запроса (GET, POST и т. Д.).

Мы расширим нашу программу Hello World для обработки большего количества типов HTTP-запросов.

var express = require('express');
var app = express();

// This responds with "Hello World" on the homepage
app.get('/', function (req, res) {
   console.log("Got a GET request for the homepage");
   res.send('Hello GET');
})

// This responds a POST request for the homepage
app.post('/', function (req, res) {
   console.log("Got a POST request for the homepage");
   res.send('Hello POST');
})

// This responds a DELETE request for the /del_user page.
app.delete('/del_user', function (req, res) {
   console.log("Got a DELETE request for /del_user");
   res.send('Hello DELETE');
})

// This responds a GET request for the /list_user page.
app.get('/list_user', function (req, res) {
   console.log("Got a GET request for /list_user");
   res.send('Page Listing');
})

// This responds a GET request for abcd, abxcd, ab123cd, and so on
app.get('/ab*cd', function(req, res) {   
   console.log("Got a GET request for /ab*cd");
   res.send('Page Pattern Match');
})

var server = app.listen(8081, function () {
   var host = server.address().address
   var port = server.address().port
   
   console.log("Example app listening at http://%s:%s", host, port)
})

Сохраните приведенный выше код в файле с именем server.js и запустите его с помощью следующей команды.

$ node server.js

Вы увидите следующий вывод -

Example app listening at http://0.0.0.0:8081

Теперь вы можете попробовать разные запросы на http://127.0.0.1:8081, чтобы увидеть результат, сгенерированный server.js. Ниже приведены несколько снимков экрана, на которых показаны разные ответы для разных URL-адресов.

Экран снова отображается http://127.0.0.1:8081/list_user

Экран снова показывает http://127.0.0.1:8081/abcd

Экран снова показывает http://127.0.0.1:8081/abcdefg

Обслуживание статических файлов

Express предоставляет встроенное промежуточное ПО express.static для обслуживания статических файлов, таких как изображения, CSS, JavaScript и т. д.

Вам просто нужно передать имя каталога, в котором вы храните свои статические ресурсы, в express.staticпромежуточное программное обеспечение, чтобы начать обслуживание файлов напрямую. Например, если вы храните свои изображения, файлы CSS и JavaScript в каталоге с именем public, вы можете сделать это:

app.use(express.static('public'));

Мы сохраним несколько изображений в public/images подкаталог следующим образом -

node_modules
server.js
public/
public/images
public/images/logo.png

Давайте модифицируем приложение "Hello Word", чтобы добавить функциональность для обработки статических файлов.

var express = require('express');
var app = express();

app.use(express.static('public'));

app.get('/', function (req, res) {
   res.send('Hello World');
})

var server = app.listen(8081, function () {
   var host = server.address().address
   var port = server.address().port

   console.log("Example app listening at http://%s:%s", host, port)
})

Сохраните приведенный выше код в файле с именем server.js и запустите его с помощью следующей команды.

$ node server.js

Теперь откройте http://127.0.0.1:8081/images/logo.png в любом браузере и посмотрите следующий результат.

GET метод

Вот простой пример, который передает два значения с помощью метода HTML FORM GET. Мы собираемся использоватьprocess_get маршрутизатор внутри server.js для обработки этого ввода.

<html>
   <body>
      
      <form action = "http://127.0.0.1:8081/process_get" method = "GET">
         First Name: <input type = "text" name = "first_name">  <br>
         Last Name: <input type = "text" name = "last_name">
         <input type = "submit" value = "Submit">
      </form>
      
   </body>
</html>

Давайте сохраним приведенный выше код в index.htm и изменим server.js для обработки запросов домашней страницы, а также ввода, отправляемого формой HTML.

var express = require('express');
var app = express();

app.use(express.static('public'));
app.get('/index.htm', function (req, res) {
   res.sendFile( __dirname + "/" + "index.htm" );
})

app.get('/process_get', function (req, res) {
   // Prepare output in JSON format
   response = {
      first_name:req.query.first_name,
      last_name:req.query.last_name
   };
   console.log(response);
   res.end(JSON.stringify(response));
})

var server = app.listen(8081, function () {
   var host = server.address().address
   var port = server.address().port
   
   console.log("Example app listening at http://%s:%s", host, port)
})

Доступ к HTML-документу с помощью http://127.0.0.1:8081/index.htm сгенерирует следующую форму -

Теперь вы можете ввести имя и фамилию, а затем нажать кнопку отправки, чтобы увидеть результат, и он должен вернуть следующий результат -

{"first_name":"John","last_name":"Paul"}

Метод POST

Вот простой пример, который передает два значения с помощью метода HTML FORM POST. Мы собираемся использоватьprocess_get маршрутизатор внутри server.js для обработки этого ввода.

<html>
   <body>
      
      <form action = "http://127.0.0.1:8081/process_post" method = "POST">
         First Name: <input type = "text" name = "first_name"> <br>
         Last Name: <input type = "text" name = "last_name">
         <input type = "submit" value = "Submit">
      </form>
      
   </body>
</html>

Давайте сохраним приведенный выше код в index.htm и изменим server.js для обработки запросов домашней страницы, а также ввода, отправляемого HTML-формой.

var express = require('express');
var app = express();
var bodyParser = require('body-parser');

// Create application/x-www-form-urlencoded parser
var urlencodedParser = bodyParser.urlencoded({ extended: false })

app.use(express.static('public'));
app.get('/index.htm', function (req, res) {
   res.sendFile( __dirname + "/" + "index.htm" );
})

app.post('/process_post', urlencodedParser, function (req, res) {
   // Prepare output in JSON format
   response = {
      first_name:req.body.first_name,
      last_name:req.body.last_name
   };
   console.log(response);
   res.end(JSON.stringify(response));
})

var server = app.listen(8081, function () {
   var host = server.address().address
   var port = server.address().port
   
   console.log("Example app listening at http://%s:%s", host, port)
})

Доступ к HTML-документу с помощью http://127.0.0.1:8081/index.htm сгенерирует следующую форму -

Теперь вы можете ввести имя и фамилию, а затем нажать кнопку отправки, чтобы увидеть следующий результат -

{"first_name":"John","last_name":"Paul"}

Файл загружен

Следующий HTML-код создает форму для загрузки файлов. Эта форма имеет атрибут метода, установленный наPOST и атрибут enctype установлен на multipart/form-data

<html>
   <head>
      <title>File Uploading Form</title>
   </head>

   <body>
      <h3>File Upload:</h3>
      Select a file to upload: <br />
      
      <form action = "http://127.0.0.1:8081/file_upload" method = "POST" 
         enctype = "multipart/form-data">
         <input type="file" name="file" size="50" />
         <br />
         <input type = "submit" value = "Upload File" />
      </form>
      
   </body>
</html>

Сохраним приведенный выше код в index.htm и изменим server.js для обработки запросов домашней страницы, а также загрузки файлов.

var express = require('express');
var app = express();
var fs = require("fs");

var bodyParser = require('body-parser');
var multer  = require('multer');

app.use(express.static('public'));
app.use(bodyParser.urlencoded({ extended: false }));
app.use(multer({ dest: '/tmp/'}));

app.get('/index.htm', function (req, res) {
   res.sendFile( __dirname + "/" + "index.htm" );
})

app.post('/file_upload', function (req, res) {
   console.log(req.files.file.name);
   console.log(req.files.file.path);
   console.log(req.files.file.type);
   var file = __dirname + "/" + req.files.file.name;
   
   fs.readFile( req.files.file.path, function (err, data) {
      fs.writeFile(file, data, function (err) {
         if( err ) {
            console.log( err );
            } else {
               response = {
                  message:'File uploaded successfully',
                  filename:req.files.file.name
               };
            }
         
         console.log( response );
         res.end( JSON.stringify( response ) );
      });
   });
})

var server = app.listen(8081, function () {
   var host = server.address().address
   var port = server.address().port
   
   console.log("Example app listening at http://%s:%s", host, port)
})

Доступ к HTML-документу с помощью http://127.0.0.1:8081/index.htm сгенерирует следующую форму -

File Upload:
Select a file to upload: 





NOTE: This is just dummy form and would not work, but it must work at your server.

Управление файлами cookie

Вы можете отправить файлы cookie на сервер Node.js, который может обрабатывать их, используя следующую опцию промежуточного программного обеспечения. Ниже приведен простой пример печати всех файлов cookie, отправленных клиентом.

var express      = require('express')
var cookieParser = require('cookie-parser')

var app = express()
app.use(cookieParser())

app.get('/', function(req, res) {
   console.log("Cookies: ", req.cookies)
})
app.listen(8081)
ja/tutorial
es/tutorial
de/tutorial
fr/tutorial
th/tutorial
pt/tutorial
ru/tutorial
vi/tutorial
it/tutorial
ko/tutorial
tr/tutorial
id/tutorial
pl/tutorial
hi/tutorial
japost
espost
depost
frpost
thpost
ptpost
rupost
vipost
itpost
kopost
trpost
idpost
plpost
hipost

© Copyright 2021 - 2024 | All Rights Reserved