NodeJs Express MySQL 实现用户简单注入解析

熊孩纸 阅读:223 2021-03-31 21:00:02 评论:0

第一步:使用express 创建student 应用

express student  # 创建student 应用

第二步:student 应用依赖第三方功能模块(mysql 和 body-parser)

mysql :mysql 数据库连接

body-parser:解析post请求的参数

本地安装第三方模块(mysql 和 body-parser)

cnpm install mysql

cnpm install body-parser

编辑package.json 文件

{ 
  "name": "student", 
  "version": "0.0.0", 
  "private": true, 
  "scripts": { 
    "start": "node ./bin/www" 
  }, 
  "dependencies": { 
    "cookie-parser": "~1.4.3", 
    "debug": "~2.6.9", 
    "express": "~4.16.0", 
    "http-errors": "~1.6.2", 
    "jade": "~1.11.0", 
    "morgan": "~1.9.0", 
	"mysql": "~2.16.0",  //依赖mysql 
	"body-parser": "~1.18.3"  //依赖body-parser 
  } 
}

第三步:在student文件夹下,创建MySQL数据库模板(db.js)

//student 文件夹下 
var mysql=require("mysql"); 
const DB={	     
	host : '192.168.1.73',	     
	user : 'root',	     
	password : 'digipower',    
	database : 'student' 
} 
const DBConnection=mysql.createConnection({ 
	    host:DB.host,	     
	    user:DB.user, 
	    password:DB.password, 
	    database:DB.database, 
	    multipleStatements:true 
}); 
DBConnection.connect(); 
module.exports.DBConnection=DBConnection;

第四步:编辑相关页面的路由

编辑student/routes/index.js 文件,引入自定义DB 模块和 body-parser模块

var express = require('express'); 
var db=require('./../db.js'); // 引入自定义DB 模块 
var router = express.Router(); 
var bodyParser=require("body-parser");  //引入body-parser模块 
 
//创建application/x-www-form-urlencoded编码解析 
var urlencodedParser=bodyParser.urlencoded({extended:false}); 
 
/* GET home page. */ 
router.get('/user.html', function(req, res) { 
  res.sendfile("./views/user.html");    //前端HTML页面文件 
}); 
 
router.post('/sub',urlencodedParser,function(req,res,next){ 
	var mysqlParams=[    //获取HTML表单发送来的数据 
		    req.body.name, 
		    req.body.chinese, 
		    req.body.english, 
		    req.body.math	 
	]; 
	var mysqlQuery='insert into student(name,chinese,english,math) values (?,?,?,?)'; 
	db.DBConnection.query(mysqlQuery,mysqlParams,function(err,rows,fields){ 
		if(err){ 
			console.log(err);	 
		    	return;		 
		}		 
		var success={			     
			message: '增加成功' 
		}; 
		 res.send(success);	 
	}); 
}); 
 
 
 
module.exports = router; 

第五步:编辑user.html 文件

在student/views文件夹下新增user.html 文件

<form  id="myform" method="post" action="http://localhost:3000/sub"> 
	姓名: <input type="text" name="name"> 
	<br/> 
	语文: <input type="text" name="chinese"> 
	<br/> 
	英语: <input type="text" name="english"> 
	<br/> 
	数学: <input type="text" name="math"> 
	<input type="submit" value="提交"> 
</form>

第六步:student 应用加载项目依赖模块和启动student 应用

cnpm install

cnpm start

项目访问地址:http://localhost:3000/user.html

效果截图:

声明

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

发表评论
搜索
排行榜
KIKK导航

KIKK导航

关注我们