node.js 实现搭建服务器并连接数据库实现增删查

最近写vue，有时候打包后，想看看打包后的dist的效果，就想搭建一个简易的服务器，就去看了看node，发现node真的是特别强大可以实现搭建服务器并连接数据库后，继而实现前后端同时写在一个项目里，相当全栈的不容错过啊
node环境先安装好。
首先npm init
去初始化package.json
然后npm install express --save

//test.js
var express = require("express");
var app = express();
//mysql 连接方法 你首先要有自己本地的mysql， 我这里就不细说了，这个host如果你有线上服务器的，可以写线上的
var mysql = require('mysql');
var connection = mysql.createConnection({
    host: 'localhost',
    user: 'root',  
    password: '123456', 
    database: 'html'
});
//增
app.get("/addStudent", (req, res) => {

    const id = req.query.id;
    const name = req.query.name;
    const age = req.query.age;


    const sql = 'INSERT INTO student (id,name,age) VALUES (?,?,?)'
    const value = [id, name, age];

    connection.query(sql, value, (error, data) => {
        if (error) {
            var result = {
                "status": "500",
                "message": "服务器错误"
            }
            return res.jsonp(result);
        } else {
            var result = {
                "status": "200",
                "message": "success",
                data: data
            }
            return res.jsonp(result);
        }


    });
})
//查
app.get("/selectStudent", (req, res) => {

    const id = req.query.id

    const sql = 'select * from student where id =?'
    connection.query(sql, id, (error, data) => {
        if (error) {
            var result = {
                "status": "500",
                "message": error
            }
            return res.jsonp(result);
        } else {
            var result = {
                "status": "200",
                "message": "success",
                data: data
            }
            return res.jsonp(result);
        }


    });
})


//删
app.get("/deleteStudent",(req,res)=>{
    const id = req.query.id
    const sql = "delete from student where id = ?"
    connection.query(sql,id,(error,data)=>{
        if (error) {
            var result = {
                "status": "500",
                "message": error
            }
            return res.jsonp(result);
        } else {
            var result = {
                "status": "200",
                "message": "success",
                data: data
            }
            return res.jsonp(result);
        }
    })
})

//如果没有路径取静态目录
app.use(express.static("public"));


// Listen

app.listen(3000)
console.log("我启动了")

静态页面我们放到public 下index.html里,代码我直接贴进来，其中public跟test.js同级
就是通过引入jq，然后get向后台发请求

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <script type="text/javascript" src="jquery.min.js"></script>
</head>

<body>
    <div>
        学生id：<input type="text" name="id">
        学生姓名：<input type="text" name="name">
        学生年龄：<input type="text" name="age">
        <input type="button" id="btn1" value="添加">
    </div>
    <div>
        学生id：<input type="text" name="idSearch">
        <input type="button" id="btn2" value="搜索">
        <div class="isShowClass">
        </div>
    </div>
    <script type="text/javascript">
    function deleteBox(id) {
        $.get("/deleteStudent",{
            id:id
        },function(date){
            if(data.status){
                alert("删除成功");
                
            }

        })
    }

    $(function() {
        $("#btn2").click(function() {
            var id = $("input[name=idSearch]").val();

            $.get("/selectStudent", {
                id: id,
            }, function(date) {

                let str = ''
                let data = date.data;
                for (var i = 0; i < data.length; i++) {
                    str += "<p>" + data[i].id + "===" + data[i].name + "===" + data[i].age + "</p><input onclick='deleteBox(" + id + ")' type='button' id='btn3' value='删除'>"
                }
                console.log(str)
                $(".isShowClass").html(str)

            })
        })
        $("#btn1").click(function() {
            var id = $("input[name=id]").val();
            var name = $("input[name=name]").val();
            var age = $("input[name=age]").val();
            $.get("/addStudent", {
                id: id,
                name: name,
                age: age
            }, function(data) {

                console.log(data)

            })
        })


    })
    </script>
</body>

</html>

这个看似简单，实际上可以做好多事情，最简单的就是如果你买了服务器和域名，可以直接放到服务器上，就可以实现一个线上地址，实现全栈的目标。