一、Express简介
Express 是一个简洁而灵活的 node.js Web应用框架, 提供了一系列强大特性帮助你创建各种 Web 应用，和丰富的 HTTP 工具。使用 Express 可以快速地搭建一个完整功能的网站。express保留了原生的功能，添加了一些方法(比如：send)，增强原有的功能。
1.express安装
npm install express执行以上命令会将 express 框架安装在当前目录的 node_modules 目录中， node_modules 目录下存放了不同的模块。
2.express使用
var server=express();-----创建服务
server.listen(8080);----监听
server.use('地址', function (req, res){});----处理请求
示例如下：
const express = require('express');
var server = express();
server.use('/1.html', function (req, res) { //请求路径为 http://localhost:8080/1.html
//res.write('aaa'); //向前台写入aaa
//res.send('aaa'); //向前台写入aaa
res.send({ a: 12, b: 5 }); //向前台写入json数据
res.end();
})
server.listen(8080);
打开浏览器，访问http://localhost:8080/1.html，显示 {"a":12,"b":5}
3.express的处理get和post请求
分别有以下3种方法
(1)server.get('/', function (req, res){});----处理get请求
(2)server.post('/', function (req, res){});----处理post请求
(3)server.use('/', function (req, res){});-----处理get/post请求
处理get请求----req.query
const express=require('express');
var server=express();
server.listen(8080);
//GET、POST
server.use('/', function (req, res){
console.log(req.query); //GET
});
处理post请求---需要"body-parser"
const express=require('express');
const bodyParser=require('body-parser');
var server=express();
server.listen(8080);
server.use(bodyParser.urlencoded({
extended: false, //扩展模式
limit: 2*1024*1024 //限制-2M
}));
server.use('/', function (req, res){
console.log(req.body); //POST
});4.express中间件
express可以设置中间件来响应 HTTP 请求。
express 提供了内置的中间件 express-static 来设置静态文件如：图片， CSS, JavaScript 等。
npm install express-static------ 下载express-static模块，
示例如下：
const express = require('express');
const expressStatic = require('express-static');
var server = express();
server.listen(8080);
server.use(expressStatic('./www')); //读取静态文件5.链式操作
next
const express = require('express');
var server = express();
server.listen(8080);
//链式操作
server.use('/', function (req, res, next) {
console.log('aaa');
next(); //下一个步骤
});
server.use('/', function (req, res) {
console.log('bbb');
});二、用户登录功能实现
login.html完整代码：
<!DOCTYPE html>
<html lang="en">
<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>登录</title>
<script src="ajax.js"></script>
<script>
window.onload = function () {
var oUser = document.getElementById('user');
var oPass = document.getElementById('pass');
var oBtn = document.getElementById('btn');
oBtn.onclick = function () {
ajax({
url: '/login',
data: { user: oUser.value, pass: oPass.value },
type: 'get',
success: function (str) {
var json = eval('(' + str + ')');
//alert(json.ok + json.msg);
if (json.ok) {
alert("登录成功");
} else {
alert("登录失败:" + json.msg);
}
},
error: function () {
alert("通信失败");
}
})
}
}
</script>
</head>
<body>
用户:<input type="text" id="user"><br>
密码:<input type="password" id="pass"><br>
<input type="button" value="登录" id="btn">
</body>
</html>server.js完整代码：
const express = require('express');
const expressStatic = require('express-static');
var server = express();
server.listen(8080);
//用户数据
var users = {
'leimiao': '123456',
'yintong': '654321',
'buding': '333333'
};
server.get('/login', function (req, res) {
var username = req.query['user'];
var password = req.query['pass'];
//console.log(req.query);
if (users[username] == null) {
res.send({ ok: false, msg: '此用户不存在' });
} else {
if (users[username] != password) {
res.send({ ok: false, msg: '密码错误' });
} else {
res.send({ ok: true, msg: '登录成功' });
}
}
});
server.use(expressStatic('./www')); //读取静态文件