时间：2021-07-01 10:21:17 帮助过：4人阅读
register.html代码：
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /> <title>登录</title> <style type="text/css"> *{ margin: 0px; padding: 0px; } body{ width: 100%; height: 100%; background-color: #f5f5f5; } .area-box{ display: flex; flex-direction: column; justify-content: center; align-items: center; margin-top: 100px; } .login-group{ /* width: 100%; */ height: 40px; background-color: white; padding: 10px 30px; } .login-group input{ height: 24px; outline: none; border-radius: 20px; padding-left: 10px; } .login-btn{ margin-top: 20px; } .login-btn button{ width: 200px; height: 30px; line-height: 30px; border-radius: 20px; outline: none; } </style> </head> <body> <div class="area-box"> <div class="login-group"> <label>用户:</label> <input type="text" name="" id="username" placeholder="请输入用户名" /> </div> <div class="login-group"> <label>密码:</label> <input type="password" name="" id="pwd" placeholder="请输入密码" /> </div> <div class="login-btn"> <button type="button" id="login">注册</button> </div> </div> <script src="js/jquery-3.3.1.js" type="text/javascript" charset="utf-8"></script> <script type="text/javascript"> let username=$("#username") let pwd=$("#pwd") $("#login").click(function(){ console.log("开始") if(username.val().length==0||pwd.val().length==0){ alert("用户或密码不能为空") return; } var getPhone=username.val() var getPwd=pwd.val() var data={ username:getPhone, password:getPwd } console.log(data) $.ajax({ type:"POST", url:"http://localhost:3000/register", data:data, success:res=>{ console.log(res) if(res.code==200){ alert(res.msg) document.location.href="index.html" }else if(res.code==201){ alert(res.msg) document.location.href="register1.html" }else{ alert(res.msg) document.location.href="register1.html" } }, error:err=>{ console.log(err) } }) }) </script> </body> </html>
model ——>index.js代码:
const MongoClient = require(‘mongodb‘).MongoClient; const url = ‘mongodb://localhost:27017‘; const dbName="blog"//数据库 // 数据库的连接方法 function conn(callback){ MongoClient.connect(url,function(err,client){ if(err){ console.log(err) return; }else{ const db=client.db(dbName); callback && callback(db) client.close(); } }) } module.exports={ conn }
app.js代码:
const express =require("express");
const app=express();
const bodyParser=require("body-parser")
app.use(bodyParser.json())
app.use(bodyParser.urlencoded({
extended:false
}))
const cors=require("cors")
app.use(cors())
const model=require("./model/users.js")
app.listen(3000,()=>{
console.log("app start")
})
app.get("/",(req,res)=>{
model.conn(function(db){
db.collection("bloguser").find().toArray((err,docs)=>{
if(err){
console.log(err)
return;
}
console.log(docs)
res.send(docs)
})
})
})
// 登录
app.post("/login",(req,res)=>{
let login_data={
username:req.body.username,
password:req.body.password
}
// 首先根据用户输入的内容去查询
model.conn(function(db){
db.collection("bloguser").findOne({username:login_data.username},(err,ret)=>{
if(err){
console.log(err)
res.send({
code:400,
msg:"用户登录失败"
})
}
let login_ret_re=ret || {}
if(login_ret_re.username){
res.send({
code:200,
msg:"登录成功"
})
}else{
res.send({
code:201,
msg:"用户或者密码错误"
})
}
})
})
})
// 注册
app.post("/register",(req,res)=>{
let data={
username:req.body.username,
password:req.body.password,
}
model.conn(function(db){
db.collection("bloguser").findOne({username:data.username},(err,ret)=>{
if(err){
console.log("查询失败")
res.send({
code:400,
msg:‘用户注册失败,请重试‘
})
}
let ret_re=ret || {}
if(ret_re.username){
console.log("该用户名已存在")
res.send({
code:201,
msg:"该用户名已存在"
})
return
}else{
model.conn(function(db){
db.collection("bloguser").insertOne(data,(err,ret_1)=>{
if(err){
console.log(err)
res.send({
code:400,
msg:‘用户注册失败,请重试‘
})
}
let ret_re_1=ret_1 ||{}
if(ret_re_1.insertedCount==1){
res.send({
code:200,
msg:"注册成功"
})
}else{
res.send({
code:400,
msg:"注册失败"
})
}
})
})
}
})
})
})
express+mongodb实现简单登录注册
标签：ash dev users doc 用户注册 doctype 简单 注册 splay