nodejs + Mysql 在前端頁面控制后台數據

var express = require("express");  //映入express  沒有的下載  可以在網上找百度
var mysql = require('mysql');    //引入mysql

var app=express();

app.use(express.static(__dirname + "/public"));  //公共  目錄  定義

//配置數據庫信息
var connection = mysql.createConnection({
    host     : '127.0.0.1',
    user     : 'root',
    password : '',
    database : 'study'
});

//連接

connection.connect();

//路徑get請求
app.get("/",function(req,res){
    //跨域
    res.setHeader("Access-Control-Allow-Origin", "*");
    
    res.writeHead(200, {"Content-Type": "text/html;charset=utf-8"});

    //查詢
    connection.query('SELECT * FROM `作業`', function (err,data) {
        if(err){
            console.log(err);
        }else{
            //console.log(data);  //打印數據
            res.end(JSON.stringify(data));   轉化成字符串
        }
    });
});

//刪除
app.get("/del",function(req,res){
    res.setHeader("Access-Control-Allow-Origin", "*");

    var id = req.query.aaa;   前台傳入的id
    //console.log(req.query); 
    //刪除
    var delSql = 'DELETE FROM 作業 where id='+id;

    //console.log(delSql);
    connection.query(delSql,function (err) {
        if(err){
            res.end("0")

未刪除的時候返回0

        }else{
            res.end("1")   成功返回1
        }
    });

});

//添加
app.get("/add",function(req,res){
    res.setHeader("Access-Control-Allow-Origin", "*");

    console.log(req.query);

    //增 插入
    var sql = "INSERT INTO `作業` (`id`, `img`, `til`, `price`, `h6`, `day`, `xing`) VALUES (NULL, '"+req.query.img+"', '"+req.query.til+"', '"+req.query.price+"', '"+req.query.h6+"', '"+req.query.day+"', '"+req.query.xing+"')";
    console.log(sql)
connection.query(sql,function (err, result) {
    if(err){
        console.log("錯誤"+err);
        res.end("1")
    }else{
        res.end("2")
    }
});


});




//修改
app.get("/xiu/gai",function(req,res){
    res.setHeader("Access-Control-Allow-Origin", "*");
    console.log(req.query);

//改
    var mosql = "UPDATE `作業` SET `img` = '"+req.query.img+"', `til` = '"+req.query.til+"', `price` = '"+req.query.price+"', `h6` = '"+req.query.h6+"', `day` = '"+req.query.day+"', `xing` = '"+req.query.xing+"' WHERE `作業`.`id` ="+req.query.id;
    connection.query(mosql,function (err) {
        if(err){
            console.log(err);   //錯誤
        }else{
            res.end("x")    //成功
        }
    });
});

app.listen(4848);
console.log('4848 running');

//    用ajax渲染數據
    $.ajax({
        url:"http://127.0.0.1:4848",   //路徑
        dataType:"json",
        success:function(res){
            console.log(res);

            var str ="";
            for(var temp of res){
                str +=`<li>
                        <a href="http://127.0.0.1:4848/user/${temp.id}"><img src="${temp.img}" alt="" val="${temp.img}"/></a>
                        <p class="p1">${temp.til}</p>
                        <p><span class="p2">${temp.price}</span>起/人</p>
                        <input type="button" value="刪除" class="sc" text="${temp.id}" />
                        <input type="button" value="修改" class="xg" jia="${temp.price}"  index="${temp.id}" img="${temp.img}"   til="${temp.til}" />
                    </li>`
            }
            $(".box ul").append(str);  //添加

//            點擊折行刪除
            $('.sc').click(function () {
//                    $(this).parent().remove();
                    var id = $(this).attr("text");//獲取自定義屬性text   id的值
                    var $that = $(this);  //保存this
                if(confirm("確定刪除嗎？")){
                    //                    console.log(id);ajax發送數據到后台
                    $.ajax({
                        url: 'http://127.0.0.1:4848/del', //路徑
                        data:{aaa:id},  //歘id值到后台
                        success: function (res) {
                            console.log(res); //后台返回值 1成功 然后判斷
                            if(res == 1){
                                $that.parent().remove();
                            }else{
                                alert("失敗")
                            }
                        }
                    });
                }
            });

      點擊按鈕提交數據到后台
            $("#tij").click(function(){

                $.ajax({
                    url:"http://127.0.0.1:4848/xiu/gai",
                    data:{
                        img:$(".mo1 input").eq(0).val(),   //input框值傳到后台
                        til:$(".mo1 input").eq(1).val(),
                        price:$(".mo1 input").eq(2).val(),
                        day:$(".mo1 input").eq(3).val(),
                        h6:$(".mo1 input").eq(4).val(),
                        xing:$(".mo1 input").eq(5).val(),
                        id:num
                    },
                    success:function(res){
                        console.log(res);
                        if(res){
                            location.reload()   //成功刷新頁面   不成功就是else
                        }else{
                            console.log("shi");
                        }
                    }
                })
            })

}

})

            //------------------------------------------------------------------