前言
此文为个人所写原创,仅为node.js+express实现mysql增删改查,并且简单易懂,适合新手学习,如有写的不恰之处,欢迎建议,如有抄袭或者使用文字转发的请注明来源,感谢。
结构
使用express新建了一个项目,新建的流程我就不多废话了,想必能看到我这篇文章的,建项目这回事应该难不倒你了吧,嘎嘎,我这里是创建好的,本次只讲对应的这5个js文件,直接上图(不明白之处,请留意代码注释,如果还是不明白,建议先去看看node基础)。
首先app.js,入口文件,需要启动服务器的时候启动的js文件,启动命令:node app
var express = require('express');
var path = require('path');
var Jump = require('./router/router'); //api路由
var config = require('./router/config'); //端口号
var router = express.Router();
var app = express();
app.use(Jump);
app.listen(config.port,function(req,res){ //创建服务器
console.log('可以启动啦'+'http://localhost:' + config.port);
})
其次看看在app.js导入的api路由文件router.js
var express = require('express');
var router = express.Router(); //导入路由中间件
var handle = require('./handle'); //为了代码的安全,我们在实现增删改查的时候还是写在另外的文件handle.js
var path = require('path');
router.get('/login',handle.funt); //指定get为请求方式
router.post('/register',handle.htmlpage); //指定post请求方式
router.all('/modify',handle.filecss); //不限制请求方式
router.all('/detele',handle.delet); //不限制请求方式
module.exports = router;
在了解handle.js功能实现页面之前,我们先看看定义sql语句的sql.js和定义端口号的db.js文件,直接上代码,我就不解释了。
sql.js
var sql = {
host:'localhost',
port:3306,
user:'root',
password:'12358lch',
database:'python'
}
module.exports = sql;
config.js,这里知道我app.js里面的config.port端口号文件内容是啥了吧
module.exports = {
port:3000
}
接口实现代码
接着直接看handle.js代码,这里看到下面这么一长篇代码,相信很多人跟我一样看到就不想看了,头疼。相信我慢慢看,下面的代码看似很多,其实很简单(留意下注释)。
var path = require('path');
var mysql = require('mysql');
var sql = require('../config/sql');
var connection = mysql.createConnection(sql,{multipleStatements: true});//multipleStatements防止恶意sql攻击
// connection.escape(sql); //防止恶意sql攻击,的第二种方式
connection.connect();
//登陆接口,就是这样实现了数据库查的功能
var funt = function(req,res){
var username = req.query.username; //接收请求文件的input内容,name为username
var password = req.query.password; //接收请求文件的input内容,name为password
var SELECT = 'SELECT * FROM login where user=? and pswd=?'; //定义mysql查询语句(看不懂就去看mysql基本语法)
var sqlvalue = [username,password]; //对应的内容
connection.query(SELECT,sqlvalue,function(error,data,fle){ //执行语句
if(error){throw error}; //请求错误时
var value = JSON.stringify(data); //将data转为字符串
var value = JSON.parse(value); //再转换为为 JavaScript 对象
console.log(value); //打印
for(var i=0;i<value.length;i++){ //因为得到的value值是一个数据,所以需要将它循环,可以使用forEach,但我这里使用的是for
if(username === value[i].user && password === value[i].pswd){ //判断输入的内容是否与数据库的内容相等。如果是那么直接输出res.send('密码输入正确,我是get方法,所以登陆成功啦'),并且return,后面的语句就不执行了
console.log('登陆成功');
res.send('密码输入正确,我是get方法,所以登陆成功啦');
return;
}
}
console.log('登陆失败');
res.send('账户或密码输入错误');
})
}
//注册接口,数据库实现查询并且增加的功能,看完第一个查的功能是不是觉得这里很简单呢,过多的注释我不写了,一个是因为懒,二是没必要,因为相信你看了查询的功能这里已经难不倒你了。
function htmlpage(req,res){
console.log(this.INSERT)
var username = req.query.username;
var password = req.query.password;
var SELECT = 'SELECT * FROM login where user=? and pswd=?';
var INSERT = 'INSERT INTO login(user,pswd) VALUES(?,?)';
var sqlvalue = [username,password];
connection.query(SELECT,sqlvalue,function(error,data,fle){
if(error){throw error};
var value = JSON.stringify(data);
var value = JSON.parse(value);
console.log(data=='')
if(data !== ''){
for(var i=0;i<value.length;i++){
if(username === value[i].user || password === value[i].pswd){
console.log('用户已存在,请重新注册');
// res.send(JSON.stringify(value));
res.json({
code:'-1',
message:'用户已存在,请重新注册',
data:value
})
}
}
}
if(data == ''){
connection.query(INSERT,sqlvalue,function(error,data,fle){
if(error){throw error};
console.log(data);
res.json({
code:'1',
message:'注册成功',
data:[{
user:username,
password:password
}]
})
})
}
})
}
//修改功能,数据库的改
function filecss(req,res){
var username = req.query.username;
var password = req.query.password;
var modifyname = req.query.modifyname;
var modifypswd = req.query.modifypswd;
var SELECT = 'SELECT * FROM login where user=? and pswd=?';
var UPDATE = 'UPDATE login SET user=?,pswd=? WHERE user=?';
var sqlvalue = [username,password];
var sqlupdate = [modifyname,modifypswd,username];
connection.query(SELECT,sqlvalue,function(error,data,fle){
if(error){throw error};
var value = JSON.stringify(data);
var value = JSON.parse(value);
console.log('[查询成功]',value);
if(data == ''){
res.json({
code:-2,
message:'用户名无效',
data:data
})
}
if(data !== ''){
connection.query(UPDATE,sqlupdate,function(error,data,rle){
if(error){throw error};
var value = JSON.stringify(data);
var value = JSON.parse(value);
console.log('[修改成功]',value);
if(data !== ''){
res.json({
code:1,
message:'修改成功',
data:[{data:'修改成功'}]
})
}
})
}
})
}
//删除功能,数据库的删
function delet(req,res){
var username = req.query.username;
var password = req.query.password;
var DELETE = 'DELETE FROM login WHERE user=? and pswd=?';
var sqlvalue = [username,password];
connection.query(DELETE,sqlvalue,function(error,data,fle){
if(error){throw error};
var value = JSON.stringify(data);
var value = JSON.parse(value);
if(data == ''){
res.json({
code:-1,
message:'无此用户名',
data:[{data:'无此用户名'}]
})
}
if(data !== ''){
res.json({
code:1,
message:'删除成功',
data:[{data:'删除成功'}]
})
}
console.log('[查询成功]',value);
})
}
//然后将这些方法导出,还记得在router.js的时候我们是怎么引入的吗?
module.exports = {
funt:funt,
htmlpage:htmlpage,
filecss:filecss,
delet:delet
}
好了上面的都写完了,我们来看看请求是否成功,随便先弄个index.html页面测一下。(留意一下我请求的路由)
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>登陆前</title>
</head>
<body>
<div class="panel-body">
<form class="form-horizontal" role="form" action="/get" method="get">
<div class="form-group">
<label for="firstname" class="col-sm-4 control-label">账号</label>
<div class="col-sm-4">
<input type="text" class="form-control" id="firstname" name="username" placeholder="请输入名字" required>
</div>
</div>
<div class="form-group">
<label for="password" class="col-sm-4 control-label">密码</label>
<div class="col-sm-4">
<input type="password" class="form-control" id="password" name="password" placeholder="请输入密码" required>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-4 col-sm-6">
<div class="checkbox">
<label>
<input type="checkbox"> 请记住我
</label>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-4 col-sm-7">
<button type="submit" class=" btn btn-primary btn-lg ">登录</button>
</div>
</div>
</form>
</div>
</body>
</html>
页面打开是这样的
随便输入内容然后点击登录
哇,瞧瞧,瞧瞧这儿是不是得到了登陆接口的那个接口(具体为啥显示这个内容,请去看代码吧),其它的接口我就不测啦,你自己测一下,或者可以用postman直接测。
结尾
好了,这篇文章就讲到这儿了,还是那句话:如有写的不恰之处,欢迎评论反馈或建议,或者也可以直接加我W信:hua658818。一起学习。