Express 是一个简洁而灵活的 node.js Web应用框架, 提供了一系列强大特性帮助你创建各种 Web 应用,和丰富的 HTTP 工具。使用 Express 可以快速地搭建一个完整功能的网站。
首先想要使用expess框架,需要安装,方法如下
npm install express
安装完成后就会发现在你的文件夹中多了一个node_module文件夹
使用express搭建一个简单的服务器
const express=require('express'); //引入express
var server=express();//创建一个服务器
server.listen(8080);//创建一个监听
使用express搭建一个服务器只需要这三步
接下来我们使用express搭建的服务器做一些简单的操作
const express=require('express');
var server=express();
server.use('./a.html',function(req,res){
// res.send(); res.end() 都是express中的方法,这块也可以用res.write();但是res.write只能发送字符串,不能发送json对象
// res.send('aaaaaaaa');
// res.write({a:12,b:5});不能发送
res.send({a:12,b:5});//可以发送
res.end();
})
server.use('./b.html',function(req,res){
res.send('bbbbb');
res.end();
});
server.listen(8080);
在express中有三种方式可以接受到用户的请求
.get('/',function(req,res){};
.post('/',function(req,res){};
.use('/',function(req,res){};
post只能接受post发来的请求
get只能接受get发来的请求
use既可以几首get发来的请求,又可以接受post发来的请求
js代码
const express=require('express');
var server=express();
server.get('/',function(req,res){
console.log('这时get发来的请求');
})
server.post('/',function(req,res){
console.log('这是post发来的请求');
});
server.use('/',function(req,res){
console.log('这时use数据');
});
server.listen(8080);
html代码
get
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<form method='get' action='http://localhost:8080'>
用户名: <input type="text" name="uname">
<input type="submit" value='提交'>
</form>
</body>
</html>
post
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<form method='get' action='http://localhost:8080'>
用户名: <input type="text" name="uname">
<input type="submit" value='提交'>
</form>
</body>
</html>
使用express做一个简单的注册登录
首先我们访问惊天文件的时候会用到 express-static,所以我们需要下载express-static
npm install express-static
js代码
const express=require('express');
const expressStatic=require('express-static');
var server=express();
server.listen(8080);
//用户数据
var users={
'blue': '123456',
'zhangsan': '654321',
'lisi': '987987'
};
server.get('/login', function (req, res){
var user=req.query['user'];
var pass=req.query['pass'];
if(users[user]==null){
res.send({ok: false, msg: '此用户不存在'});
}else{
if(users[user]!=pass){
res.send({ok: false, msg: '密码错了'});
}else{
res.send({ok: true, msg: '成功'});
}
}
});
server.use(expressStatic('./www'));
html代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
用户名: <input type="text" id='user'> <br>
密码: <input type="password" id='pass'> <br>
<input type="button" value='登录' id='btn1'>
<script src='ajax.js'></script>
<script type="text/javascript">
var user=document.getElementById('user');
var pass=document.getElementById('pass');
var btn1=document.getElementById('btn1');
btn1.onclick=function(){
ajax({
url:'/login',
data:{user:user.value,pass:pass.value},
success:function(str){
console.log(str);
var json=eval('('+str+')');
if(json.ok){
alert('登陆成功');
}else{
alert('失败'+json.msg);
}
},
error:function(){
alert('通信失败');
}
})
}
</script>
</body>
</html>
这样一个简单的前后端交互的注册登录就做完了
网友评论