node的express中间件之static之ajax提交json

static中间件可以使客户端直接访问网站中的所有静态文件.

利用这个功能可以直接把服务器上的静态页面直接读取出来返回到客户端.

从客户端点击一个按钮,向服务器端发送数据.并且插入到mysql数据库中去.

服务器端代码:

 var express=require("express");

 var app=express();

 var mysql=require("mysql");

 var pool=mysql.createPool({

     host:"localhost",

     port:3306,

     database:"test_db",

     user:"root",

     password:"gys"

 });

 app.use(express.static(__dirname));

 /*app.use(express.static("public"));*/

 app.post("/", function (req,res) {

     req.on("data", function (data) {

         var obj=JSON.parse(data.toString());

         pool.getConnection(function(err,connection){

             if(err) res.send("与mysql数据库建立连接失败.");

             else{

                 var str;

                 connection.query("insert into users set ?",{username:obj.username,firstname:obj.firstname}, function (err,result) {

                     if(err) str="在服务器mysql数据库中插入数据失败.";

                     else    str="在服务器端mysql数据库汇总插入数据成功.";

                     connection.release();

                     res.send(str);

                 });

             }

         })

     });

 });

 app.listen(1337,"127.0.0.1", function () {

     console.log("开始监听1337");

 });

根目录下的index.html代码:

 <!DOCTYPE html>

 <html>

 <head lang="en">

     <meta charset="UTF-8">

     <title>session中间件的使用</title>

     <script type="text/javascript">

         function submitData(){

             var xhr=new XMLHttpRequest();

             xhr.open("post","/",true);

             xhr.onload= function () {

                 if(this.status=200){

                     document.getElementById("res").innerHTML=this.response;

                 }

             };

             var obj={firstname:"郭",username:"延思"};

             xhr.send(JSON.stringify(obj));

         }

     </script>

 </head>

 <body>

 <input type="button" value="提交" onclick="submitData();" />

 <div id="res"></div>

 </body>

 </html>

在浏览器中键入:localhost:1337或localhost:1337/index.html

如果文件名是index.html可以直接这样写:localhost:1337

否则就是localhost:1337/文件名

巴特西

node的express中间件之static之ajax提交json

最新文章

热门文章