ajax+nodejs+mysql总结

1.nodejs模块
在nodejs需要先建立一个服务器,引入http，url，fs，querystring模块，使用createServer创建服务，并且绑定一个监听端口

var http = require("http");
var url = require("url");
var fs = require("fs");
var querystring = require("querystring");
var app = http.createServer(function(req,res){
    }
app.listen(3000)    
    

html发过来的路径是字符串，所以需要把他转化为对象

var url_obj = url.parse("req.url")

根据html页面请求的路径，在nodejs设置不同的路径值，返回相对应的html界面

  if(url_obj.pathname === "/login"){
        fs.readFile("./login.html","utf-8",function(err,data){
            if(!err){  
                //把读取到的内容返回给浏览器
                res.write(data);
                res.end();
                }
            })
        }

当整个html页面加载完，我们发现如果有引入css文件，img文件或者js文件，无法完成静态渲染，因为在nodejs中，html如果有别的一些文件也要发送请求才能渲染出来，这样就需要对整个页面的所有文件设置user_obj.pathname了，这样子太过于麻烦，所有我们在nodejs后台封装一个render()请求函数，这样子当一个页面被加载，所有静态资源就都会向后台发送请求完成渲染。
调用render(),传入path参数，要用 “.”+url_pathname 拼串，因为传入的要是一个文件路径值，这个值要给fs的
还有一点是，之前的 if(url_obj,pathname) 判断最后全部要加return，不然会再次进入这个render()函数，会造成错误

render("."+url_obj.pathname,res)
function render(path, res) {
        //binary 二进制
        fs.readFile(path, "binary", function (err, data) {
            if (!err) {
                res.write(data, "binary");
                res.end();
            }
        })
    }

2.ajax模块

ajax是写在html前台中，通常是在写在一个事件里面，
xhr.responseText 是请求后台发送回来的数据，是字符串格式，如果要使用，可以用JSON.parse()转化为对象，可以取到里面的属性，如果status=0，一般表示正确或成功

oBtn.onclick = function () {
            xhr = new XMLHttpRequest();
            xhr.open("post", "/login666", true);
            xhr.send("username=" + oUser.value + "&password=" + oPass.value)
            xhr.onreadystatechange = function () {
                if (xhr.readyState === 4 && xhr.status === 200) {
                    var obj = JSON.parse(xhr.responseText);
                    if (obj.status === 0) { //状态值为0 ，表示接受成功
                        alert(obj.message);
                    } else {
                        alert(obj.message);
                    }
                }
            }
        }

ajax同时要注意兼容性的问题，所以一般会在开头声明xhr为null

            var xhr = null;
            try{
                xhr = new XMLHttpRequest();
            }catch(e){
                xhr = new ActiveXObject("Microsoft.XMLHTTP");
            }

如果前台ajax的请求方式为post，后台nodejs应该这样写来接受ajax发来的数据，其中user_info 为前台发送的数据，开启一个on监听，当数据开始传输的时候，向user_info赋值，因为数据是分块传输的，所以设置chunk参数，慢慢累积给user_info ，当数据传输完成时，在打开一个on监听end，这个时候如果没有错误的话，数据已经全部传输完成，设置一个对象 user_obj 来转化存储 user_info 字符串，然后根据转化结果可以判断user_obj下面的值，执行判断语句

    if(url_obj.pathname === "/login666" && req.method === "POST"){
        var user_info = "";
        req.on("data",function(chunk){
            user_info += chunk;
        })
        req.on("end",function(err){
            if(!err){
                var user_obj = querystring.parse(user_info);
                if(user_obj.username === "admin" && user_obj.password ==="123"){
                    res.write('{"status":0,"message":"登录成功"}'),
                    res.end();
                }else{
                    res.write('{"status":1,"message":"登录失败"}'),
                    res.end();
                }
            }
        })
    }

ajax的封装

我们可以将ajax封装成一个函数，如果我们下次再想使用ajax，就直接调用ajax()就好，不过我们传入的参数是一个对象，封装方法如下
method 是请求的方法，get或post，如果没有传入method默认是get；
url 是请求的地址 get请求传递的数据是在url中发送的，data没有数据
data 是post请求的传递的数据，因为post的数据没有在请求体中，不在url
success 是数据后台响应接受完成需要做的操作，一般传事件函数
其中arr是返回xhr.responseText的解析对象,
obj.success && obj.success(arr)
这句话的意思是，把arr作为参数，传入我们创建的success事件函数中；

function ajax(obj) {
    var method = obj.method || "get";
    var xhr = null;
    try {
        xhr = new XMLHttpRequest();
    } catch{
        xhr = new ActiveXObject("Microsoft.XMLHTTP");
    }
    if (method === "get") {
        xhr.open("get", obj.url + "?" + obj.data, true);
        xhr.send()
    } else if (method === "post") {
        xhr.open("post", obj.url, true);
        xhr.setRequestHeader("content-type", "application/x-www-form-urlencoded");
        xhr.send(obj.data);
    } else {
        console.log("请求方式不正确")
    }
    xhr.onreadystatechange = function () {
        if (xhr.readyState === 4 && xhr.status === 200) {
            //xhr.responseText 是文本格式。字符串解析为对象后才能使用
            var arr = JSON.parse(xhr.responseText);
            obj.success && obj.success(arr);
        }
    }
}

3.mysql数据库模块
查询user表

SELECT * FROM `user`;

查询user表下面id为1的

SELECT *FROM `user` WHERE id=1;

添加user表

INSERT INTO `user` VALUES(null,"admin","1@qq.com","15625716464","1191729646");

更改user表下面id为1的

UPDATE `user` SET email="1191729646@qq.com" WHERE id="1";

删除user表下面id为1的

DELETE FROM `user` WHERE id=1;

mysql模块需要在npm中下载mysql包，然后在nodejs中引入，在nodejs中创建一个mysql接口，首先创建一个来连接的目标对象,host是地址，user和passw是数据库的连接用户密码，database是要连接的数据库名称；

var mysql = require("mysql");
//创建一个连接对象
var connection = mysql.createConnection({
    host: 'localhost',
    user: 'root',
    password: 'root',
    database: "ajaxdemo",
});
//开始连接到数据库
connection.connect(function (err) {
    if (err) {
        console.error('error connecting: ' + err.stack);
        return;
    }
    console.log('connected as id ' + connection.threadId);
});

在nodejs中 req.on(“end”) 获取到完整数据后，就要拿去跟数据库做比较或者操作数据库，这时候就要连接数据库
sql 是指对数据库的操作，一般拼穿上user_obj.username 等属性
而下面的 ‘{“status”:0,“message”:“登录成功”}’ 则将返回到前台ajax中，可以根据status状态值，做出响应的事件

var user_obj = querystring.parse(user_info);
var sql = " SELECT * FROM user"
connection.query(sql, function (err, result) {
    if (!err && result && result.length !== 0) {
        res.write('{"status":0,"message":"登录成功"}', "utf-8");
        res.end();
    } else {
        res.write('{"status":1,"message":"用户名或密码错误"}', "utf-8");
        res.end();
    }
})