likes
comments
collection
share

Node | Express框架入门Node框架-Express入门知识梳理:入门 demo,HTTP请求和响应,路由,

作者站长头像
站长
· 阅读数 51

什么是 Express

Node 开发框架。核心是对 Node.js 内置的http模块的再包装

原生Node

var http = require("http");

//createServe生成一个HTTP服务器实例。
//回调函数的参数分别为代表HTTP请求和HTTP回应的request对象和response对象

var app = http.createServer(function(request, response) {
  response.writeHead(200, {"Content-Type": "text/plain"});
  response.end("Hello world!");
});
app.listen(3000, "localhost");

Express

var express = require('express');
var app = express();//相当于http.createServer();
app.get('/', function (req, res) {
  res.send('Hello world!');
});
app.listen(3000);//相当于server.listen

0 入门小 demo

安装npm install express

// 2 加载express模块
var express = require('express');//express变量是一个构造函数
// 3 创建app(服务器应用程序)
var app = express();//生成express实例

//4.设置express实例的参数
// 设定port变量(访问端口)
app.set('port', process.env.PORT || 3000);
// 设定views变量(视图存放的目录)
app.set('views', path.join(__dirname, 'views'));
// 设定view engine变量,意为网页模板引擎
app.set('view engine', 'jade');

//5.挂载中间件
app.use(express.favicon());
app.use(express.logger('dev'));
app.use(express.bodyParser());
app.use(express.methodOverride());
app.use(app.router);

// 6.开放静态资源
// 设置后就可通过/public/xx的方式来访问public目录中的所有资源
app.use('/public/',express.static('/public/'));

// 7.当服务器收到get请求 / 的时候,执行回调处理函数
app.get('/',function(req,res){
    res.send('hello express');//向客户端发送响应
})

// 8.启动服务器
app.listen(app.get('port'),function(){
    console.log('app is runing at port 3000');
})

Express 项目目录

bin:启动配置文件,在 www 里修改运行端口号

node_modules:存放所有的项目依赖包

public:用于存放静态资源文件,图片,CSS,JS 文件等

routers:路由文件

views:存放页面(模板文件)的地方

package.json:项目依赖配置及开发者信息

app.js:应用核心配置文件,项目入口

1 Express 配置

app.set() 设置应用程序的配置参数。

// 使用 EJS 视图引擎来渲染模板文件
app.set('view engine', 'ejs');
// 在哪个文件夹中查找视图模板文件
app.set('views', path.join(__dirname, 'views'));
// 设置应用程序监听的端口号
app.set('port', process.env.PORT || 3000);
// 启用代理服务器信任,以便获取正确的客户端 IP 地址
app.set('trust proxy', true);
//....

2 HTTP 请求 | 响应

2.1 Request 对象

(1)req.query 获取 get 请求参数

// req.query只能拿到 get 请求的数据
 var comment = req.query;

(2)req.body 获取 post 请求体

无内置方法,需要第三方包 body-parse

① 安装:npm install --save body-parser

② 配置 ③ 使用 req.body

var express = require('express')
// 引包
var bodyParser = require('body-parser')

var app = express()

// 配置body-parser
// 配置完毕后,通过req.body来获取表单post请求数据
// parse application/x-www-form-urlencoded
app.use(bodyParser.urlencoded({ extended: false }))
// parse application/json
app.use(bodyParser.json())

// 使用
app.use(function (req, res) {
  res.setHeader('Content-Type', 'text/plain')
  res.write('you posted:\n')
  // 通过req.body来获取表单请求数据
  res.end(JSON.stringify(req.body, null, 2))
})

(3)其他

request.ip 用于获得HTTP请求的IP地址

request.path 获取 url 的路径部分

request.files 用于获取上传的文件

请求 - Express 中文文档 (nodejs.cn)

2.2 response对象

(1)response.redirect 网址的重定向

response.redirect("/hello/anime");
response.redirect("http://www.example.com");
response.redirect(301, "http://www.example.com"); 

(2)response.sendFile 发送文件

response.sendFile("/path/to/anime.mp4");

(3)response.render 用于渲染网页模板

app.get("/", function(request, response) {  
  response.render("index", { message: "Hello World" });
  //使用render方法,将message变量传入index模板,渲染成HTML网页
});
方法描述
res.redirect()重定向请求
res.sendFile()将文件作为八位字节流发送
res.render()渲染视图模板。
res.download()提示要下载的文件
res.end()结束响应过程
res.json()发送 JSON 响应
res.send()发送各种类型的响应

响应 - Express 中文文档 (nodejs.cn)

3 路由

3.1 传统路由

为不同的访问路径,指定不同的处理方法。

回调函数的参数: req 和 res 对象。

//当你以get方法请求/的时候,执行对应的处理函数
app.get('/',function(req,res){
    res.send('hello world');
})

//当你以post方法请求/的时候,执行对应的处理函数
app.post('/',function(req,res){
    res.send('hello world');
})

//指定HTTP请求头信息
app.get('/user', function(req, res){
  var body = {name:"张三",age:40};
  res.setHeader('Content-Type', 'text/plain');
  res.setHeader('Content-Length', body.length);
  res.end(body);
});

推荐写法

  1. 把路由对应的回调函数,封装成模块(放 routes 目录)。

  2. 在 app.js 中通过 require 引入。

// routes/api.js
exports.index = function (req, res){
  res.json(200, {name:"张三",age:40});
}
// app.js
var api = require('./routes/api');
app.get('/api', api.index);
3.2 Express.Router

Express 4.0开始,路由器功能成为一个单独的组件 Express.Router,如一个小型的 express 应用程序,有自己的 use/get/param/route 方法;

Express.Router 是一个构造函数,调用后返回一个路由器实例 router;

使用该实例的 HTTP 动词方法,为不同的访问路径,指定回调函数;

最后,把整个 router 实例挂载到 express 实例上。

这种路由器可以自由挂载的做法,为程序带来了更大的灵活性:既可以定义多个路由器实例,也可以将同一个路由器实例挂载到多个路径。

var router = express.Router();
router.get('/', function(req, res) {
  res.send('首页');
});
router.get('/about', function(req, res) {
  res.send('关于');
});
app.use('/app', router);
//相当于为/app和/app/about这两个路径,指定了回调函数。
3.3 route 方法

router.route

const express = require('express');
const router = express.Router();

router.route('/users')
  .get((req, res) => {
    res.send('获取用户列表');
  })
  .post((req, res) => {
    res.send('创建新用户');
  })
  .put((req, res) => {
    res.send('更新用户信息');
  });

module.exports = router;

app.route

app.routeexpress.Router() 的缩写,适合于对单个路径定义多个路由处理程序,可写成链式形式。

app.route('/users')
  .get((req, res) => {
    res.send('获取用户列表');
  })
  .post((req, res) => {
    res.send('创建新用户');
  })
  .put((req, res) => {
    res.send('更新用户信息');
  });
3.4 router 中间件

use 方法为 router 对象指定中间件,即在数据正式发给用户之前,对数据进行处理。所以中间件必须放置在 HTTP 动词方法之前。

router.use(function(req, res, next) {
	console.log(req.method, req.url);
	next();	
});

router.get('/hello'...);
3.5 对路径参数的处理

router 对象的 param 方法用于路径参数的处理。

注意,param方法必须放在HTTP动词方法之前。

router.param('name', function(req, res, next, name) {
	// 对name进行验证或其他处理……
	console.log(name);
	req.name = name;
	next();	
});
router.get('/hello/:name', function(req, res) {
	res.send('hello ' + req.name + '!');
});

4 中间件(较长待补充)

5 模板引擎

5.1 模板引擎

一种用于生成 HTML 的工具;

允许开发者在 HTML 视图文件中嵌入动态内容(变量、表达式等);

数据与视图分离,保持代码的模块化和可维护性。

模板文件带有占位符的 HTML 文件,这些占位符会被res.render中指定的动态数据替换。

数据渲染res.render 渲染模板---将模板文件与动态数据结合,生成最终 HTML并发送给客户端。

5.2 art-template

aui.github.io/art-templat…

安装npm i --save art-template express-art-template

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

// 配置
// 1. 注册模板引擎,一参是模板文件的扩展名,二参是模板引擎
// 告知Express: 遇到.html文件时,应使用express-art-template这个模板引擎渲染
app.engine('html', require('express-art-template'));

// 2. 设置默认模板引擎
//告知 express,用res.render渲染视图时,如果没有指定模板文件的扩展名,默认使用扩展名为.html的模板文件
app.set('view engine', 'art');

// 3. 设置存放模板文件的目录
app.set('views', './views');  // 根目录下的 ./views 目录中

// 使用
app.get('/',function(req,res){
    // 去views目录找index.html
    // 将动态数据填充到模板中
    // 将index.html返回给客户端
    res.render('index.html',{ 
      title: '123', message: '456',list:[7,8,9]
    }    
  });
})

// 修改默认的views视图渲染存储目录
app.set('views',目录路径);
<!-- 模板文件 -->
<h1>{{title}}</h1>
<h2>{{message}}</h2>
<ul>
  {{each list as item}}
  <li>{{item}}</li>
  {{/each}}
</ul>

6 MySQL

文档:www.npmjs.com/package/mys…

Express 连接 MySQL数据库。

安装npm install --save mysql

// 引入mysql包
var mysql = require('mysql');

// 创建连接
var connection = mysql.createConnection({
  host: 'localhost',	//本机
  user: 'root',		//账号root
  password:'123456',	//密码
  database:'my_db'	//数据库名
});
 
// 连接数据库	
connection.connect();
 
//执行sql操作
connection.query('SELECT * FROM `users` ', function (error, results, fields) {
  if (error) throw error;//抛出异常阻止代码往下执行
  // 没有异常则发送响应
  console.log('The solution is: ',results);
  res.send({
    msg:success,
    data:results
  })
});

//关闭连接
connection.end();

Sequelize 是一个广泛使用的 ORM 库,支持 MySQL、SQLite 等数据库。允许开发者使用 JS 对象定义数据库模型,并提供了许多用于查询、更新、删除等操作的高级方法。

const Sequelize = require('sequelize');

const sequelize = new Sequelize('xxkAdmin', 'root', '12345678', {
    host: 'localhost',
    dialect: 'mysql'  ,
    pool: {
        max: 20,
        min: 0,
        acquire: 30000,
        idle: 10000
    }
});

exports.start_user = async function (req, res, next) {
    res.setHeader("Access-Control-Allow-Origin", "*"); //允许跨域
    var userInfos = [];
    let page = Number(req.query.page);
    var sql = 'SELECT user_id,user_name FROM user_info WHERE 1=1';
    sql = sql + " LIMIT  " + (page-1)*5 + ",5"; //根据页码计算条数
  
    sequelize.query(sql, {type: sequelize.QueryTypes.SELECT })
        .then(results => {
            var string = JSON.stringify(results);//转为字符串
            var result = JSON.parse(string);//转为json对象
            for (var i = 0; i < result.length; i++) {
                userInfos.push(result[i]);
            }
            res.send(userInfos)
        })
      .catch(err => res.send(false));
}

转载自:https://juejin.cn/post/7402204174064549915
评论
请登录