前端与后台的之间的关系

1、在使用AJXA的时候

用get提交的时候[

        xmlhttp.open("get","/index",true);

         xmlhttp.send();

]

用post提交的时候[

xmlhttp.open("post","/index",true);

xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");

xmlhttp.send();

]

 

2、在后台处理时：get需要用query接收数据        post需要用body接收数据。

3、中间键：

     在把CSS样式写在外部样式的时候，需要使用：

            app.use(express.static(path.join(__dirname, 'public')));

    所以，要在APP文件之前导入第三方模块path:

                var path=require("path");

   

    在前端传值到后台的时候，需要使用中间键来实现接收，并返回到后台处理文件

         app.use(express.urlencoded());

---

 

     前端js文件：（需要在登陆页面加载AJXA）

   var input=document.getElementById("p1");

          input.onclick=function(){

                var name=document.getElementById("username").value;
               var pwd=document.getElementById("pwd").value;

             var xmlHttp=getmyXmlHttpResquest();

             xmlHttp.open("post","/dologin",true);      //采用post提交
             xmlHttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
             xmlHttp.send("uname="+name+"&pwd="+pwd);     //发送一个数组到后台

             xmlHttp.onreadystatechange=function(){
                  if(xmlHttp.readyState==4 && xmlHttp.status==200){
                        var str =xmlHttp.responseText ;
                                 if(str=="1"){
                        window.location.href="./html/sucess.html";    // 如果str=="1"，则页面进行跳转
                                }else{
                       document.getElementById("errInfo").innerHTML="用户名或则密码错误";      //如果str!="1"，则提示用户输入用户名或者密码错误
                                 }
                           }
                }

 }

 

 

       后台js文件：

          首先要导入数据库的路径

      

var dateUtil = require("./mysql.js");  

     function dologin(req,res){
             var name = req.body.uname;  //接收提交过来的用户名
            var pwd = req.body.upwd;      //接收提交过来的密码
             var con = dateUtil.getCon();    //连接数据库
           con.query("select * from userinfo where username=? and pwd=?",[name,pwd],function(e,row){
                if(e){
              console.log(e.stack);
                return ;
               }
            if(row.length){
                  res.send("1");   //如果有长度，则返回1
              }else{
               res.send("0");    //如果没有长度，则返回0
           }

  })

   }

      exports.dologin =dologin;   //暴露接口或方法

 

AJXA文件：

  

function getMyXmlHttpResquest(){
             var xmlHttp=null;
           if(document.all){     //判断是不是IE
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
             }else{
xmlHttp = new XMLHttpRequest();
            }
return xmlHttp;
       }

 

数据库文件：

var mysql = require("mysql");

            var config={
                host:"127.0.0.1", //ip地址
                user: "wang",     //数据库登录名

               password:"123456",   //登陆密码

              database:"test",        //数据库使用文件
                  port:3306         //端口号
}

function getConnection(){
            return mysql.createConnection(config);
}
              exports.getCon=getConnection;

 

 

 

（我觉得老师讲的很好，代码都是敲出来的，光看是看不懂，也理解不懂的，只有自己做的时候，才能发现很多问题。我们需要努力解决发现的问题，才能收获知识！）