Node.js + MangoDB数据库实现学生数据查询
项目创作背景
目前高校对于学生信息掌控力度不足,查找学生信息效率低下,从
节约时间成本和提升工作效率的角度出发,搭建数据库,并且利用node.js创建服务器,利用前后端分离实现一个简易版本的学生数据查询效果。
项目实现整体效果
页面设置查询输入框,点击搜索按钮实现完整姓名、部分名字以及姓氏查询。
查询到的结果被渲染在页面上,便于快速了解学生信息,工作效率得以大大提高。
项目实现代码分析
数据库连接管理
数据库创建是借用MongoDB实现的,创建一个JS文件对MongoDB数据库进行封装,实现数据的插入、查询、更新以及删除功能。
const { MongoClient } = require('mongodb');
class DB {
constructor(数据库名称 = "云上教室") {
this.uri = "mongodb://127.0.0.1:27017/";
this.client = new MongoClient(this.uri);
this.db = this.client.db(数据库名称);
}
async 连接数据库() {
try {
await this.client.connect();
console.log('已连接到 MongoDB');
return this.db;
} catch (error) {
console.error('连接到 MongoDB 时出错:', error);
throw error;
}
}
async 关闭连接() {
try {
await this.client.close();
console.log('已断开与 MongoDB 的连接');
} catch (error) {
console.error('断开与 MongoDB 的连接时出错:', error);
throw error;
}
}
}
创建一个
查询数据的异步方法,将查询到的数据通过.toArray()转换成数组,便于查询到的数据在页面上显示。
async 查询数据(集合名称, 查询条件 = {}, 选项 = {}) {
try {
const collection = this.db.collection(集合名称);
const cursor = collection.find(查询条件, 选项);
return await cursor.toArray();
} catch (error) {
console.error('查询数据时出错:', error);
throw error;
}
}
插入、更新以及删除功能与查询的方法类似,均可以通过这种异步操作对数据库进行功能实现。
express搭建服务器实现数据库与后端的连接
导入已经创建好的数据库连接
根据文件路径,导入已经搭建好的数据库
const DB = require('./DB0422.js');
const 芒果 = new DB(`学校`);
注意文件的跨域资源请求的问题,通过npm install cors下载cors模块,并设置代码防止跨域请求失败。
app.use((req, res, next) => {
res.header('Access-Control-Allow-Origin', '*');
res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept');
next();
});
同样为了加载静态页面资源,也可利用.static方式托管上层目录中的"前端"文件夹为静态资源
前后端创建数据接口
后端创建/api/findAll路由接口,利用动态的正则表达式实现搜索内容的模糊渲染
let regex = new RegExp(`^${stu_name}`);
let data = await 芒果.db.collection('23级').aggregate([
{ $unwind: "$stu_data" },
{ $match: { "stu_data.stu_name": { $regex: regex } } },
{ $project: {
class_name: 1,
stu_name: "$stu_data.stu_name",
stu_id: "$stu_data.stu_id",
gender: "$stu_data.gender"
}
}
]).toArray();
前端接收后端创建的路由接口,在前端调用。
在JS部分运用for循环遍历查询数据,并且利用innerHTML将查询到的数据显示在页面上。
项目总结
项目主要通过MongoDB数据库和Node.js实现学生数据查询效果,不仅节约了时间成本,而且还能迅速掌握学生动向,一个简易的学生数据查询系统就此但诞生了。