node.js+express简单实现注册登录功能对mysql进行增删改查

node.js+express实现mysql增删改查

前言

此文为个人所写原创,仅为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。一起学习。

发布了6 篇原创文章 · 获赞 7 · 访问量 234

猜你喜欢

转载自blog.csdn.net/qq_31676725/article/details/103608148