Заметки об изучении экспресс-фреймворка

Node.js

Экспресс-фреймворк

Введение

  1. Express — это минималистичный веб-фреймворк, основанный на широко используемом Node.js.

  2. Express — это веб-фреймворк для маршрутизации и промежуточного программного обеспечения с минимальной функциональностью: приложение Express представляет собой набор вызовов функций промежуточного программного обеспечения.

  3. установка нпм:npm install express --save

  4. Случай экспресс-въезда:

        const APP = require('express')();
    
    APP.get('/', function (req, res) {
        res.send('hello');
    });
    
    APP.listen(3000,function () {
        console.log('running...');
    });

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

  1. Для обслуживания статических файлов, таких как изображения, файлы css и файлы JavaScript, используйте встроенную промежуточную функцию express.static в Express.
  2. Передайте имя каталога, содержащего статические ресурсы (то есть корневой путь к статическим ресурсам), в функцию промежуточного программного обеспечения express.static, чтобы начать обслуживание этих файлов напрямую. Например, используйте следующий код в файле с именемpublicПредоставляет изображения, файлы css и файлы JavaScript в каталоге.
  3. использоватьapp.use(express.static('rootpath'))загружать статические ресурсы
  4. Первый параметр метода use() может указывать виртуальный путь.
  5. Вы можете указать несколько каталогов как каталоги статических ресурсов, просто вызовите use() несколько раз.
  6. Обратитесь к приведенному ниже коду:
        //========== express 静态资源托管 ============
    const EXPRESS = require('express');
    const APP = EXPRESS();
    
    APP.use('/static',EXPRESS.static('public'));
    APP.use(EXPRESS.static('doc'));
    
    APP.listen(3000,function () {
     console.log('Express server running...');
    });

Экспресс-маршрутизация

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

  1. Маршрутизация: обработка распределения маршрутов в соответствии с путем запроса и методом запроса.
  2. Обычно используемые методы HTTP-запроса:
    • Добавить почтовую операцию
    • получить операцию запроса
    • поставить операцию обновления
    • удалить операцию удаления
    • получить параметры передачи для адресной строки URL-адреса, в то время как отправлять, помещать и удалять параметры передачи через тело запроса.
  3. restful api : URL-адрес в определенном формате
  4. Экспресс базовая маршрутизация, см. следующий код:
     const EXPRESS = require('express');
 const APP = EXPRESS();
 
 //express基础路由
 APP.get('/',function (req,res) {
 	res.send('get data');
 });
 
 APP.post('/',function (req,res) {
 	res.send('post data');
 });
 
 APP.put('/',function (req,res) {
 	res.send('put data');
 });
 
 APP.delete('/',function (req,res) {
 	res.send('delete data');
 });
 
 //直接使用use 可以拦截所有的请求
 APP.use(function (req,res) {
 	res.send('ok');
 });
 
 APP.listen(3000,function () {
 	console.log('APP running...');
 });
  5. app.route(): создает подключаемый обработчик маршрута для пути маршрута. Поскольку путь указан в одном месте, можно уменьшить избыточность и количество ошибок при вводе. Обратитесь к приведенному ниже коду:
        app.route('/login')
        .get(function (req,res) {
            res.send('get ');
        })
        .post(function (req,res) {
            res.send('post');
        })
        .put(function (req,res) {
            res.send('put');
        });
  6. express.Router: используйте класс express.Router для создания устанавливаемых модульных обработчиков маршрутов. Экземпляр маршрутизатора представляет собой полноценное промежуточное программное обеспечение и систему маршрутизации, поэтому его часто называют «микроприложением». Обратитесь к приведенному ниже коду:
       //============= 路由器处理模块 ==================
   
   const express = require('express');
   const router = express.Router();
   
   //------------ 处理路由 -------------
   router.get('/',function (req,res) {
   	res.send('ok');
   });
   
   //------------- 导出路由模块 -----------
   module.exports = router;

экспресс интегрированный механизм шаблонов

  1. Установите в проект соответствующий пакет шаблонизатора npm:
  2. Установите следующие параметры приложения:
    • views: каталог, в котором находятся файлы шаблонов. Например:app.set('views', './views'). Обратите внимание, что первый параметр — это фиксированный способ записи «представлений», а второй параметр — это корневой путь, по которому находится файл шаблона.
    • view engine: Механизм шаблонов для использования. Например:app.set('view engine','pug'). Первый параметр — это фиксированный способ записи, а второй параметр — суффикс имени файла шаблона.
  3. Сделать экспресс совместимым с механизмом шаблонов. Например:app.engine('art',require('express-art-template'));
  4. пройти черезres.render('模板名称',data);для визуализации шаблона.
  5. В частности, обратитесь к следующему коду:
       //============ express 整合模板引擎 ================
   const express = require('express');
   const app = express();
   const path = require('path');
   
   //设置模板的路径
   app.set('views',path.join(__dirname,'views'));
   //设置模板引擎
   app.set('view engine', 'art');
   //使express兼容art-template模板引擎
   app.engine('art',require('express-art-template'));
   
   let data = { //水果---模板引擎渲染需要的数据
   	title: '水果',
   	list: ['apple', 'banana', 'chestnut']
   };
   
   app.get('/',function (req,res) {
   	res.render('list.art',data);
   });
   
   app.listen(3000, function () {
   	console.log('running...');
   });

экспресс промежуточное ПО

  1. Промежуточное ПО — это часть процесса обработки, и его суть — функция.
  2. Функции промежуточного программного обеспечения могут получить доступобъект запроса(требуется),объект ответа(res) и следующей промежуточной функцией в цикле запроса/ответа приложения. Следующая промежуточная функция обычно представляется переменной с именем next.
  3. Функции промежуточного ПО могут выполнять следующие задачи:
    • выполнить любой код
    • Внесение изменений в объекты запроса и ответа
    • Завершить цикл запроса/ответа
    • Вызвать следующую промежуточную функцию в стеке
  4. Если текущая функция промежуточного программного обеспечения не завершает цикл запроса/ответа, то она должна вызвать метод next(), чтобы передать управление следующей функции промежуточного программного обеспечения. В противном случае запрос останется на рассмотрении.
  5. Экспресс-приложения могут использовать следующие типы промежуточного программного обеспечения.
    • Промежуточное ПО прикладного уровня
    • промежуточное ПО уровня маршрутизации
    • промежуточное ПО для обработки ошибок
    • Встроенное промежуточное ПО
    • стороннее промежуточное ПО

Промежуточное ПО прикладного уровня

  1. Используйте функции app.use() и app.METHOD() для привязки ПО промежуточного слоя прикладного уровня к экземпляру объекта приложения, где МЕТОД — это нижний регистр метода запроса, обрабатываемого функцией ПО промежуточного слоя (например, get, post, так далее.)
  2. Простой пример промежуточного программного обеспечения прикладного уровня, обратитесь к следующему коду:
    • использовать app.use()
       //=========== express 中间件 ==============
   const EXPRESS = require('express');
   const APP = EXPRESS();
   let total = 0; //记录被访问的次数
   
   APP.use('/www', function (req, res, next) {
   	console.log(`有人访问了, 访问时间：${Date.now()}`);
   	next(); //将控制权传递给下一个中间件函数
   });
   
   APP.use('/www', function (req, res, next) {
   	//记录访问日志
   	console.log('访问了：/www');
   	next();
   });
   
   APP.use('/www', function (req, res) {
   	total += 1;
   	console.log(`被访问的次数：${total} \n`);
   	res.send('result');
   });
   
   APP.listen(3000,function () {
   	console.log('APP running...');
   });
    • Используйте app.METHOD() , обратите внимание, что next('route') передает управление следующему маршруту. Обратитесь к приведенному ниже коду:
       let cb0 = function (req, res, next) {
   	console.log('cb0');
   	next();
   };
   let cb1 = function (req, res, next) {
   	console.log('cb2');
   	next();
   };
   let cb2 = function (req, res) {
   	res.send('Hello word');
   };
   APP.get('/abc', [cb0, cb1, cb2]);
   
   APP.listen(3000, function () {
   	console.log('APP running...');
   });

промежуточное ПО уровня маршрутизатора

  1. Промежуточное ПО уровня маршрутизатора работает в основном так же, как промежуточное ПО уровня приложения, разница в том, что оно привязано к экземпляру express.Router().
  2. Как использовать:const router = express.Router();, используйте функции router.use() и router.METHOD() для загрузки промежуточного ПО уровня маршрутизатора.
  3. Обратитесь к приведенному ниже коду:
       //=========== 路由器层中间件 ============
   const EXPRESS = require('express');
   const APP = EXPRESS();
   const ROUTER = EXPRESS.Router();
   
   ROUTER.get('/login',function (req,res,next) {
    console.log(req.url);
    next();
   });
   
   ROUTER.get('/login', function (req, res,next) {
    res.send('router');
   });
   
   APP.listen(3000, function () {
    console.log('server running...');
   });

промежуточное ПО для обработки ошибок

  1. Метод определения функции промежуточного ПО для обработки ошибок в основном такой же, как и для других функций промежуточного ПО. Разница в том, что функция обработки ошибок имеет четыре переменные (err, req, res, next); четыре переменные должны быть предоставлены, даже если next object не требуется, его нужно указывать, иначе следующий объект будет разбираться как обычный middleware и не сможет обрабатывать ошибки.
  2. Пожалуйста, определите промежуточное ПО для обработки ошибок последним, после других вызовов app.use() и route.
  3. Обратитесь к приведенному ниже коду:
        const EXPRESS = require('express');
    const APP = EXPRESS();
    
    APP.use('/', function (req, res) {
        throw new Error('fail');
    });
    
    APP.use(function (err, req, res, next) {
        console.log(err);
        res.status(500).send('Something broke');
    });
    
    APP.listen(3000, function () {
        console.log('running...');
    });

Встроенные промежуточные модули

  1. Начиная с v.x, Express больше не зависит от Connect. За исключением express.static, все промежуточные функции, поставляемые с Express, предоставляются в виде отдельных модулей.

стороннее промежуточное ПО

  1. Для добавления функциональности в программу Express с помощью стороннего ПО промежуточного слоя необходимо сначала установить ПО промежуточного слоя.
  2. Способ установки следующий:npm install cookie-parser --save
  3. Использование заключается в следующем:
       const EXPRESS = require('express');
   const APP = EXPRESS();
   const COOKIE = require('cookie');
   
   APP.use(COOKIE());

Экспресс-обработка параметров

  1. использоватьbody-parserСтороннее промежуточное ПО, способ установки:npm install body-parser

  2. получить запрос на использованиеreq.queryполучить представленные данные

  3. использование почтового запросаreq.bodyполучить представленные данные

  4. Обратитесь к приведенному ниже коду:

       //========= express 参数处理 =============
   const EXPRESS = require('express');
   const APP = EXPRESS();
   const bodyParser = require('body-parser');
   
   //加载静态资源
   APP.use('/static', EXPRESS.static('public'));
   
   //使用参数解析中间件
   //解析 application/x-www-form-urlencoded
   APP.use(bodyParser.urlencoded({extended: false}));
   //解析 application/json
   APP.use(bodyParser.json());
   
   // 获取get参数
   APP.get('/login', function (req, res) {
   	console.log(req.query);
   	res.send('get params');
   });
   
   // 获取post 参数
   APP.post('/login', function (req, res) {
   	console.log(req.body);
   	res.send('post params')
   });
   
   APP.listen(3000, function () {
   	console.log('server running...');
   });

  5. Express обрабатывает параметры URL-адреса формы restful API:

    • Используйте свойство req.params для получения объекта параметра, а затем извлекайте нужные данные по мере необходимости.
    • Обратитесь к приведенному ниже коду:
       //========== express 处理restful api ==========
 const express = require('express');
 const app = express();
 const database = require('./database');
 
 // 请求的url： http://localhost:3000/books/book/15
 app.get('/books/book/:id', function (req,res) {
 	let id = req.params.id;
 	database.getById('book', id, function (result) {
 		res.json(result);
 	});
 });
 
 app.listen('3001', function (err) {
 	console.log('running...');
 });

Экспресс фоновая разработка интерфейса

разработка json-интерфейса

  1. Фреймворк Express очень прост для разработки интерфейса json, используя метод ответа:res.json();Просто передайте данные клиенту.
  2. Обратитесь к приведенному ниже коду:
     //========== Express 框架开发后台接口 ==============
 const express = require('express');
 const app = express();
 const database = require('./database');
 
 //指定api路径 （json接口）
 app.get('/all-book',function (req,res) {
 	database.getAllData('book', function (result) {
 		res.json(result);
 	});
 });
 
 app.listen(3002, function (err) {
 	console.log('server running');
 });

разработка интерфейса jsonp

  1. Интерфейс jsonp среды Express очень похож на разработку интерфейса json, используяres.jsonp();метод.
  2. По умолчанию имя функции обратного вызова Express jsonp:callback, в состоянии пройтиapp.set('jsonp callback name',name);чтобы изменить имя функции обратного вызова jsonp.
  3. Обратитесь к приведенному ниже коду:
     //========== Express 框架开发后台接口 ==============
 const express = require('express');
 const app = express();
 const database = require('./database');

 // 指定api路径 （jsonp接口)
 app.set('jsonp callback name', 'jsonp');
 app.get('/all-book', function (req, res) {
 	database.getAllData('book', function (result) {
 		res.jsonp(result);
 	});
 });
 
 app.listen(3002, function (err) {
 	console.log('server running');
 });

Express framework решает междоменные проблемы

  1. Когда мы видим в консоли браузера информацию, подобную следующей:
    Access to XMLHttpRequest at 'http://localhost:3001/books' from origin 'http://localhost:63342'
has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
    Это указывает на наличие междоменной проблемы. Решение состоит в том, чтобы добавить заголовок «Access-Control-Allow-Origin» к маршруту, который перехватывает каждый запрос.
  2. Ниже приведен код для решения междоменной проблемы фреймворка Node Express.Обратите внимание, что код для решения междоменной проблемы должен быть размещен перед генерацией маршрутизации обработки, иначе он не будет работать:
    //===== 项目入口文件 =====
const express = require('express');
const app = express();
const bodyParser = require('body-parser');
const router = require('./router');

//----- 配置跨域 -----
// express框架解决跨域问题的代码，注意该代码要放在 app.use(router); 之前
app.all('*', (req, res, next) => {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "X-Requested-With");
    res.header("Access-Control-Allow-Methods", "PUT,POST,GET,DELETE,OPTIONS");
    res.header("X-Powered-By", 'Express');
    res.header("Content-Type", "application/json;charset=utf-8");
    next();
});

//----- 配置路由 -----
app.use(router);

//----- 配置参数解析-----
app.use(bodyParser.urlencoded({extended:true}));
app.use(bodyParser.json());

//----- 监听端口 -----
const port = process.env.port || 3001;
app.listen(port,(error) => {
    console.log(`server running on ${port}`);
});

Полезные свойства или методы в Express

запрос (просьба)

  1. req.headers: получить заголовки запроса

отклик

  1. res.redirect(url): перенаправить на указанную страницу URL. url: путь перенаправленной страницы.
  2. res.status (код): код состояния в ответ клиенту. Такие какres.status(400).json({flag:0});
Категории