文件目录
话不多说,上代码。
启动文件app.js代码块
const express = require("express");
const app = express();
const path = require("node:path");
const Umodel = require("./model/userModel.js");
app.use("/", express.static(path.join(__dirname, "public")));
//登录
app.use("/loginon",async (req,res)=>{
let login = await Umodel.login(req.query);
res.send(login);
});
//注册
app.use("/regiest",async (req,res)=>{
let regiest = await Umodel.addUser(req.query);
res.send(regiest);
});
//列表
app.use("/userlist",async (req,res)=>{
let userlist = await Umodel.getUserlist(req.query);
res.send(userlist);
});
app.listen(1111, () => {
console.log('服务启动', 'localhost:1111')
});
业务层功能模块
const { dataTool } = require("echarts");
const fs=require("node:fs/promises");
const path=require("node:path");
class UserModel{
constructor(){
this.filePath=path.join(__dirname,"../","./json/user.json");
}
//读静态资源文件的方法
async readFileByPath(fileName){
return await fs.readFile(path.join(__dirname,"../public",fileName),"utf-8");
}
//读JSON文件
async readJSONByFile(){
return await fs.readFile(this.filePath,"utf-8");
}
//写JSON文件
writeJSONToFile(data){
fs.writeFile(this.filePath,JSON.stringify(data));
}
//获取用户列表数据
async getUserlist(){
return JSON.parse(await this.readJSONByFile());
}
//登录功能
/**
* user={username,pwd}
*/
async login(user){
let userlist=await this.getUserlist();
if(userlist.find(item=>item.username===user.username&&item.pwd===user.pwd)){
return {code:200,msg:"登录成功!"};
}else{
return {code:201,msg:"登录失败!用户名或密码错误"};
}
}
//注册功能
/**
* user={username,pwd}
*/
async addUser({username,pwd}){
//校验有效性
if(this.checkData(username)||this.checkData(pwd)){
return {code:201,msg:"用户名或密码无效,请检查!"}
}else{
let userlist=await this.getUserlist();
//校验重名
if(userlist.find(item=>item.username===username)){
return {code:201,msg:"用户名已存在,请检查!"};
}else{
let newUser={
userid:userlist.at(-1).userid*1+1,
username,
pwd,
isadmin:"0"
}
userlist.push(newUser);
try{
this.writeJSONToFile(userlist);
return {code:200,msg:"注册成功!"};
}catch(e){
console.log(`写文件出错:${e.message}`);
return {code:201,msg:"注册失败!"};
}
}
}
}
//校验数据有效性方法
checkData(param){
let dataArr=["undefined",undefined,"","null",null];
return dataArr.includes(param);
}
}
module.exports=new UserModel;
index.js模块
import "/js/jquery.min.js";
$("#login_btn").on("click",async()=>{
let user={
"username":$("#username").val(),
"pwd":$("#pwd").val(),
}
let {code,msg}=await $.get("/loginon",user);
alert(msg);
if(code===200){
location.href="/html/userlist.html";
}
});
$("#reg_btn").on("click",async()=>{
let user={
"username":$("#username").val(),
"pwd":$("#pwd").val(),
}
let {code,msg}=await $.get("/regiest",user);
alert(msg);
if(code===200){
location.reload();//刷新当前页
}
});
userlist.js模块
import "/js/jquery.min.js";
{
//Jquery的预加载
let data = await $.get("/userlist");
drawUserTable(data);
}
//渲染用户列表方法
function drawUserTable(userlist) {
let tbText = "";
for (let item of userlist) {
tbText += `<tr>
<td>${item.userid}</td>
<td>${item.username}</td>
<td>${item.pwd}</td>
<td>${item.isadmin * 1 === 1 ? '管理员' : '普通用户'}</td>
<td>
<button class="update">修改</button>
<button class="del">删除</button>
</td>
</tr>`
}
$("#userlist_text").html(tbText);
};