前后端交互注册 数据储存到数据库

后端注册：

写在路由级别里

var express = require('express');
var router = express.Router();
const db = require("../db/index");

/* GET users listing. */
router.post('/reg', async function (req, res, next) {
  let { username = '', age = 0, addr = '', tel = '' } = req.body;
  console.log(username,age,addr,tel);
  //表单校验
  if (!username || !tel) {
    res.send({
      code: 501, msg: "用户名、电话为必填项"
    })
    return;
  }
  //注册流程
  //将数据放入数据库中
  //1.检测用户名是否重复
  let [err0, rst0] = await db.operator(`SELECT * FROM user WHERE name=?`,[username])  ;//占位符
  if (err0) {
    res.send({ code: 502, msg: "数据库操作失败：" + err0 })
    return;
  }
  if (rst0.length > 0) {
    res.send({ code: 503, msg: "用户名已注册" })
    return;
  }
  //2.不重复的用户名，可以注册
  let [err, data] = await db.operator(`INSERT INTO user (name,age,addr,tel) VALUES (?,?,?,?)`,[username,age,addr,tel])
  err ? res.send({ code: 504, msg: "注册失败", data: err }) : res.send({ code: 200, msg: "注册成功" });

});

module.exports = router;

写在入口文件里：

const createError = require('http-errors');
const express = require('express');
const path = require('path');
const cookieParser = require('cookie-parser');
const logger = require('morgan');
const cors=require("cors")

//引入自定义的路由模块
const indexRouter = require('./routes/index');
const usersRouter = require('./routes/users');

const app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');

app.use(logger('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
app.use(cors())

app.use('/', indexRouter);
app.use('/users', usersRouter);

// catch 404 and forward to error handler
app.use(function(req, res, next) {
  next(createError(404));
});

// error handler
app.use(function(err, req, res, next) {
  // set locals, only providing error in development
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page
  res.status(err.status || 500);
  res.render('error');
});

//监听listen

封装的数据库基本样式在db文件夹下：
?

const mysql = require('mysql');
const path=require('path');

//数据库操作类
class DB {
    constructor(config) {
        //配置项
       
        this.config = {
             host: "127.0.0.1",//主机名
            user: "root",//数据账号
             password: "root",//数据库密码
            database: "students",//要连接的数据库
             charset: "utf8",//编码格式
         }
        this.conn = null;

        this.init();
    }

    //初始化
    init() {
        this.conn = mysql.createConnection(this.config);//创建数据库连接
        this.conn.connect(err => {
            if (err) console.log('连接数据库失败：', err);
        });
    }

    //执行数据库操作
    operator(sql,params) {
        return new Promise(resolve => {
            this.conn.query(sql,params, (err, rst) => {
                err ? resolve([err, null]) : resolve([null, rst])
            })
        });
    }

    close() {
        this.conn.end();//关闭连接
    }
}

let buf=require("node:fs").readFileSync(path.join(__dirname,'..',"config",'config.json'));
// console.log(buf.toString());

let db = new DB(JSON.parse(buf.toString()));
module.exports = db;


//使用
// let db=new DB();
// db.query()

简易前端登录前面：

<button>注册</button>
    <script>
        document.querySelector('button').onclick=function(){
            fetch('http://localhost:3000/users/reg',{
                headers:{
                    "content-type":"application/x-www-form-urlencoded"
                },
                method:"POST",
                body:"username=admin666&age=19&addr=test&tel=234234234"
            }).then(rst=>rst.json()).then(data=>{
                console.log(data);
            })
        }