新建一个js文件,在Node.js连接MongoDB | 菜鸟教程官网中找到教程。先安装mongoDB,然后创建一个 MongoClient 对象,配置好数据库指定的URL和端口号。
var MongoClient = require('mongodb').MongoClient;
var url = "mongodb://localhost:27017/【数据库名称】";
再引入解析post的解析器
const bodyParser = require("body-parser")
var urlencodedParser = bodyParser.urlencoded({ extended: false})
导入express
const express=require("express")
const app=express()
访问静态文件
//访问注册页面
app.use('/register',express.static("www/shop/register.html"))
//访问登陆页面,已进入网页就是登录页面
app.use('/',express.static("www/shop/"))
//访问商品列表页面
app.use('/shopmsg',express.static("www/shop/shopmsg.html"))
//访问用户信息列表页面
app.use('/usermsg',express.static("www/shop/usermsg.html"))
用户注册,也就是增加用户信息
在html文件里编写好页面布局
<section>
<h1>注册</h1>
<!-- form用来实现表单提交,点击submit自动触发 method提交方式 get post -->
<form action="http://localhost:8989/register/submit" method="get">
<input type="text" name="user" placeholder="请输入帐号" /><br><br>
<input type="password" name="password" placeholder="请输入密码" /><br><br>
<input type="submit" value="注册" onclick="aa()" />
</form>
</section>
js文件内容
app.get('/register/submit',(req,resp)=>{
// 连接数据库
MongoClient.connect(url, { useNewUrlParser: true }, function(err, db) {
if (err) throw err;
// 选择数据库
var dbo = db.db("shop");
var myobj = { user: req.query.user, password: req.query.password };
// 插入数据
dbo.collection("user").insertOne(myobj, function(err, res) {
// 数据插入成功
if (err) throw err;
console.log("注册成功");
db.close();
//重定向
resp.redirect('http://localhost:8989/');
// resp.send(req.query.user+",恭喜你!注册成功")
});
});
})
用户登录,先查询数据库中是否有该用户,有的话就重定向到指定页面,就实现了登录
html页面布局
<section>
<h1>登录</h1>
<!-- form用来实现表单提交,点击submit自动触发 method提交方式 get post -->
<form action="http://localhost:8989/usermsg" method="post">
<input type="text" name="user" placeholder="请输入帐号" /><br><br>
<input type="password" name="password" placeholder="请输入密码" /><br><br>
<input type="submit" value="登录" onclick="aa()" /><br><br>
</form>
<a href="/register">注册</a>
</section>
js文件
app.post('/usermsg',urlencodedParser,(req,resp)=>{
// 连接数据文件
MongoClient.connect(url, { useNewUrlParser: true }, function(err, db) {
if (err) throw err;
var dbo = db.db("shop");
var whereStr = { user: req.body.user, password: req.body.password }; // 查询条件
dbo.collection("user").find(whereStr).toArray(function(err, result) {
if (err) throw err;
console.log(result)
console.log(result.length)
if(result.length==1){
console.log("登录成功");
db.close();
//重定向
resp.redirect('http://localhost:8989/usermsg');
// resp.send(req.body.user+",欢迎回来!")
}else{
console.log("登录失败");
db.close();
resp.send("用户不存在或密码错误")
}
});
});
})
登录后重定向的页面显示所有的用户信息
html页面布局
<section>
<h1>用户信息</h1>
<table>
<thead class="head">
<td>姓名</td>
<td>密码</td>
</thead>
</table>
<br><br>
<a href="/shopmsg">商品列表</a>
</section>
js文件
app.get('/userList',urlencodedParser,(req,resp)=>{
MongoClient.connect(url, { useNewUrlParser: true }, function(err, db) {
if (err) throw err;
var dbo = db.db("shop");
dbo.collection("user").find({}).toArray(function(err, result) { // 返回集合中所有数据
if (err) throw err;
console.log(result);
db.close();
// resp.json(result);
resp.send(result)
});
});
})
html文件要获取数据库查询的结果
<script>
$.ajax({
url:'http://localhost:8989/userList',
type:'GET',
dataType:'json',
success:function(resp){
console.log(resp)
resp.forEach((item)=>{
let tag=$('<tr></tr>')
tag.html(`<td>${item.user}</td>
<td>${item.password}</td>`)
$('table').append(tag)
})
}
})
</script>
以上就是用express+mongodb实现登录注册的方法
首先要把该定义的、该导入的模块都先搞定
然后更加思路一一将登录注册功能实现
- 在网址中输入http://localhost:8989/就会跳转到登录页面
- 有帐号的话,就登录。登录成功后跳转到重定向页面
- 没有帐号的话,就点击注册
注册成功就会跳转到登录页面
连接数据库的,进行增加、查询功能的代码在官网都有
Node.js连接MongoDB | 菜鸟教程