nodejs前后端的数据交互

数据流向一般是:前端请求 ---->后端数据校验 ---->查询数据库 ---->响应前端

基本的数据库sql(结构化查询语句)一般涉及增删改查四大操作,具体如下:


  1. INSERT INTO 表(字段列表) VALUES(值列表)
INSERT INTO user_table(ID,name,gender,chinese,math,english) VALUES(0,"张三","男",20,30,50)

  1. DELETE FROM 表 WHERE 条件
DELETE FROM user_table WHERE ID=1

3.改
UPDATE 表 SET 字段1=值1,字段2=值2 WHERE 条件

UPDATE user_table SET chinese=20 WHERE ID=1

  1. SELECT 字段1,字段2 FROM 表 WHERE 条件
SELECT chinsese FROM user_table WHERE ID=1

前后端配合完成简单注册和登陆的数据交互代码如下:

  1. 前端代码:
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>前后台联调往数据库存取数据</title>
    <script src="./jquery.js"></script>
    <script>
        $(function(){
            $("#btn1").click(function(){
                $.ajax({
                    url: "/reg",
                    method: "get",
                    data: {
                        username: $("#user").val(),
                        password: $("#pwd").val()
                    },
                    dataType: "json",
                    success(json){
                        if(json.err){
                            alert("注册失败了"+json.msg);
                        }else{
                            alert("注册成功了");
                        }
                    },
                    error(err){
                        alert("请求出错了"+JSON.stringify(err));
                    }
                })
            })
            $("#btn2").click(function(){
                $.ajax({
                    url: "/login",
                    method: "get",
                    data: {
                        username: $("#user").val(),
                        password: $("#pwd").val()
                    },
                    dataType: "json",
                    success(json){
                        if(json.err){
                            alert("登陆失败了"+json.msg);
                        }else{
                            alert("登陆成功了");
                        }
                    },
                    error(err){
                        alert("请求出错了"+JSON.stringify(err));
                    }
                })
            })
        })
    </script>
</head>
<body>
    用户名:<input type="text" name="user" id="user"><br>
    密码:<input type="password" name="pwd" id="pwd"><br>
    <button id="btn1">注册</button>
    <button id="btn2">登陆</button>
</body>
</html>
  1. 后端代码
const http = require("http");
const fs = require("fs");
const mysql = require("mysql");
const url = require("url");
const zlib = require("zlib");
const crypto = require("crypto");

let key = "1234656";
function md5(str){
    let obj = crypto.createHash("md5");
    obj.update(str);
    return obj.digest("hex");
}
function md5_2(str){
    return md5(md5(str+key));
}
//创建数据库的连接
let db = mysql.createPool({host: "localhost", port: "3306", user: "root", password: "cf540294", database: "user"})
//创建服务
let server = http.createServer((req,res)=>{
    let {pathname,query} = url.parse(req.url,true);
    let {
        username,
        password
    } = query;
    switch(pathname){
        case "/reg":
            //对数据进行校验
            if(!username){
                res.write('{"err":1,"msg":"username can\'t be empty"}');
                res.end();
            }else if(!password){
                res.write('{"err":1,"msg":"password can\'t be empty"}');
                res.end();
            }else if(!/^\w{4,16}$/.test(username)){
                res.write('{"err":1,"msg":"username is invalid"}');
                res.end();
            }else if(/['|"]/.test(password)){
                res.write('{"err":1,"msg":"password is invalid"}');
                res.end();
            }else{
                //写入数据库之前先判断用户明是否存在
                db.query(`SELECT * FROM user_table WHERE username='${username}'`,(err,data)=>{
                    if(err){
                        res.write('{"err":1,"msg":"database error"}');
                        res.end();
                    }else{
                        if(data.length>0){
                            res.write('{"err":1,"msg":"the username is exists"}');
                            res.end();
                        }else{
                            db.query(`INSERT INTO user_table (id,username,password) VALUES(0,'${username}','${md5_2(password)}')`, (err, data) => {
                                if(err){
                                    res.write('{"err":1,"msg":"database error"}');
                                    res.end();
                                }else{
                                    res.write('{"err":0,"msg":"success"}')
                                    res.end();
                                }
                            })
                        }
                    }
                })
            }
            break;
        case "/login":
            //对数据进行校验
            if (!username) {
                res.write('{"err":1,"msg":"username can\'t be empty"}');
                res.end();
            } else if (!password) {
                res.write('{"err":1,"msg":"password can\'t be empty"}');
                res.end();
            } else if (!/^\w{4,16}$/.test(username)) {
                res.write('{"err":1,"msg":"username is invalid"}');
                res.end();
            } else if (/['|"]/.test(password)) {
                res.write('{"err":1,"msg":"password is invalid"}');
                res.end();
            } else {
                //写入数据库之前先判断用户明是否存在
                db.query(`SELECT * FROM user_table WHERE username='${username}'`, (err, data) => {
                    if (err) {
                        res.write('{"err":1,"msg":"database error"}');
                        res.end();
                    }else if(data.length == 0){
                        res.write('{"err":1,"msg":"the username is not exists"}');
                        res.end();
                    }else if(data[0].password != md5_2(password)){
                        res.write('{"err":1,"msg":"the username or password is incorrect"}');
                        res.end();
                    }else{
                        res.write('{"err":0,"msg":"success"}');
                        res.end();
                    }
                })
            }
            break;
        default:
            let rs = fs.createReadStream(`www${pathname}`);
            let gz = zlib.createGzip();
            res.setHeader("content-encoding","gzip");
            rs.pipe(gz).pipe(res);
            rs.on("error",err=>{
                res.writeHeader(404);
                res.write("Not Found");
                res.end();
            });
            break;
    }
})
// 监听端口
server.listen(8080);
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 关于Mongodb的全面总结 MongoDB的内部构造《MongoDB The Definitive Guide》...
    中v中阅读 32,099评论 2 89
  • 转 # https://www.cnblogs.com/easypass/archive/2010/12/ 08/...
    吕品㗊阅读 9,880评论 0 44
  • 绒布峰针特种兵训练营21天顺利蜕变[玫瑰][玫瑰]心若改变,态度跟着改变;态度改变,习惯跟着改变;习惯改变,性格跟...
    32f001595a43阅读 125评论 0 0
  • 今天看了我的女神, 她还是像当年那样~美丽 她还是像当年那样~乐观 她还是像当年那样~学霸 她一直都那么好。 她是...
    LewisBetty阅读 153评论 0 0