聊聊nodejs中的get/post请求和中间件

本篇文章带大家了解一下node.js中的热重启、get请求、post请求和中间件,希望对大家有所帮助!

一、node热重启

1.安装

npm i nodemon

2.运行启动

nodemon .bin/www

二、关于get请求

一般在网站开发中,get都用作数据获取和查询,类似于数据库中的查询操作,当服务器解析前台资源后即传输相应内容;而查询字符串是在URL上进行的,形如:

http://localhost:8080/login?goods1=0001&goods2=0002

获取前台get请求

通过req.query可以获得用户发送的get请求,之后通过node操作将相应数据返回给用户。

如果发送的是:

http://localhost:8080/login?goods1=0001&goods2=0002

响应的话则通过:

req.query

他会获取到全部数据,或

req.query.goods1
req.query.goods2

来单独或去每一个数据。总之不同的需求对应不同的业务,大家按自己的需要来获取;

实例

下面通过一个实例来对获取get参数进行一个总结:

HTML:

<!DOCTYPE html>
<html>
    <head>
        <meta charset=utf-8>
        <title></title>
    </head>
    <body>
        <form action=http://localhost:8080/login method=get>
            用户:
            <input type=text name=user id=user placeholder=用户名/>
            <br>
            密码:
            <input type=password name=password id=password placeholder=密码/>
            <br>
            <input type=submit value=提交/>
        </form>
    </body>
</html>

node:

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

app.get(/,function(req,res){
    res.send(主页);
});

app.get(/login,function(req,res){
    console.log(req.query);
    res.send(登录路由,user为:+req.query.user+==>   password为:+req.query.password);
});

app.listen(8080);

三、关于POST请求

post方法作为http请求很重要的一部分,几乎所有的网站都有用到它,与get不同,post请求更像是在服务器上做修改操作,它一般用于数据资源的更新。 相比于get请求,post所请求的数据会更加安全。上一章中我们发现get请求会在地址栏显示输入的用户名和密码(有中文时会转化为BASE64加密),而post请求则会将数据放入http包的包体中,这使得别人无法直接看到用户名和密码!

Express如何设置POST请求

1.首先我们得知道在form表单进行post请求,enctype属性一般设置为“application/x-www-form-urlencoded”,如果设置成multipart/form-data,则多用于文件上传,如下:

<form action=# method=post enctype=application/x-www-form-urlencoded>
</form>

2.设置解析body中间件

app.use(express.urlencoded())

3.获取body数据

req.body.username

登陆案例:

HTML:

<!DOCTYPE html>
<html>
<head>
    <meta charset=UTF-8>
    <meta name=viewport content=width=device-width, initial-scale=1.0>
    <meta http-equiv=X-UA-Compatible content=ie=edge>
    <title>Document</title>
</head>
<body>
    <h1>登陆</h1>
    <form action=/login method=POST>
        <div>
            用户名:<input type=text name=username>
        </div>
        <div>
            密码:<input type=password name=password>
        </div>
        <button>登陆</button>
    </form>
      
</body>
</html>

APP.JS

var express = require('express');
var path = require('path')
var app = express();
var sqlQuery = require('./lcMysql')

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
app.use(express.static(path.join(__dirname, 'public')));
//解析post提交的数据
app.use(express.urlencoded())

//搜索首页
app.get('/',(req,res)=>{
  res.render('index.ejs')
})

//登陆页
app.get('/login',(req,res)=>{
  res.render('login')
})
//处理登陆请求
app.post('/login',async (req,res)=>{
  //获取用户名和密码
  let username = req.body.username 
  let password = req.body.password
  //查询数据库是否由此用户名和密码
  let sqlStr = 'select * from user where username = ? and password = ?';
  let arr = [username,password];
  let result = await sqlQuery(sqlStr,arr)
  if(result.length == 0 ){
    res.send(登陆失败)
  }else{
    res.send(登陆成功)
  }

})


module.exports = app;

四、中间件

从字面意思,我们可以了解到它大概就是做中间代理操作,事实也是如此;大多数情况下,中间件就是在做接收到请求和发送响应中间的一系列操作。事实上,express是一个路由和中间件的web框架,Express 应用程序基本上是一系列中间件函数的调用。

1.浏览器发送请求

2.express接受请求

中间处理的过程

3.路由函数处理渲染(req,res)

4.res.render渲染

中间件函数可以执行以下任务:

  • 执行任何代码。
  • 对请求和响应对象进行更改。
  • 结束请求/响应循环。
  • 调用堆栈中的下一个中间件函数。

中间件也分为应用层中间件、路由中间件、内置中间件、错误处理中间件和第三方中间件。下面分别对以下进行说明:

1.应用层中间件

应用级中间键绑定到app对象使用app.use和app.METHOD()-需要处理http请求的方法,例如GET、PUT、POST,将之前的get或者post替换为use就行。 例如下面实例:

const express=require(express);

var app=express();

//匹配路由之前的操作
app.use(function(req,res,next()){
    console.log(访问之前);
});

app.get(/,function(req,res){
    res.send(主页);
});

app.listen(8080);

这时我们会发现http://localhost:8080/地址一直在加载,但命令行里显示了“访问之前”,说明程序并不会同步执行,如果使用next来是路由继续向下匹配,那么就能又得到主页数据了:

const express=require(express);

var app=express();

//匹配路由之前的操作
app.use(function(req,res,next){
    console.log(访问之前);
    next();
});

app.get(/,function(req,res){
    res.send(主页);
});

app.listen(8080);

当然也可以简化写法:

const express=require(express);

var app=express();

app.use(function(req,res,next){
    console.log(访问之前);
    next();
},function(req,res){
    res.send(主页);
});

app.listen(8080);

因此,在进行路由匹配之前或再录又要继续向下执行时想做个操作,那么应用层中间件无疑是好的选择。

2.路由中间件

路由级中间件和应用级中间件类似,只不过他需要绑定express.Router();

var router = express.Router()

在匹配路由时,我们使用 router.use() 或 router.VERB() ,路由中间件结合多次callback可用于用户登录及用户状态检测。

const express = require(express);
var app = express();
var router=express.Router();

router.use(/,function(req,res,next){
    console.log(匹配前);
    next();
});

router.use(/user,function(req,res,next){
    console.log(匹配地址:,req.originalUrl);
    next();
},function(req,res){
    res.send(用户登录);
});

app.use(/,router);

app.listen(8080);

总之在检测用户登录和引导用户应该访问哪个页面是,路由中间件绝对好用。

3.错误处理中间件

顾名思义,它是指当我们匹配不到路由时所执行的操作。错误处理中间件和其他中间件基本一样,只不过其需要开发者提供4个自变量参数。

app.use((err, req, res, next) => {
        res.sendStatus(err.httpStatusCode).json(err);
});

一般情况下,我们把错误处理放在最下面,这样我们即可对错误进行集中处理。

const express=require(express);

var app=express();

app.get(/,function(req,res,next){
    const err=new Error('Not Found');
    res.send(主页);
    next(err);
});

app.use(/user,function(err,req,res,next){
    console.log(用户登录);
    next(err);
},function(req,res,next){
    res.send(用户登录);
    next();
});

app.use(function(req,res){
    res.status(404).send(未找到指定页面);
});

app.listen(8080);

4.内置中间件

从版本4.x开始,Express不再依赖Content,也就是说Express以前的内置中间件作为单独模块,express.static是Express的唯一内置中间件。

express.static(root, [options]);

通过express.static我们可以指定要加载的静态资源。

5.第三方中间件

形如之前我们的body-parser,采用引入外部模块的方式来获得更多的应用操作。如后期的cookie和session。

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

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


kindeditor4.x代码高亮功能默认使用的是prettify插件,prettify是Google提供的一款源代码语法高亮着色器,它提供一种简单的形式来着色HTML页面上的程序代码,实现方式如下: 首先在编辑器里面插入javascript代码: 确定后会在编辑器插入这样的代码: <pre
这一篇我将介绍如何让kindeditor4.x整合SyntaxHighlighter代码高亮,因为SyntaxHighlighter的应用非常广泛,所以将kindeditor默认的prettify替换为SyntaxHighlighter代码高亮插件 上一篇“让kindeditor显示高亮代码”中已经
js如何实现弹出form提交表单?(图文+视频)
js怎么获取复选框选中的值
js如何实现倒计时跳转页面
如何用js控制图片放大缩小
JS怎么获取当前时间戳
JS如何判断对象是否为数组
JS怎么获取图片当前宽高
JS对象如何转为json格式字符串
JS怎么获取图片原始宽高
怎么在click事件中调用多个js函数
js如何往数组中添加新元素
js如何拆分字符串
JS怎么对数组内元素进行求和
JS如何判断屏幕大小
js怎么解析json数据
js如何实时获取浏览器窗口大小
原生JS实现别踩白块小游戏(五)
原生JS实现别踩白块小游戏(一)