Fork me on GitHub

用nodejs和js写增删查模块

  文件目录如下:public是静态资源文件,index.html入门页面,server.js就是用nodejs创建的服务端代码,users.json就类似是数据库。

目录

显示界面

  

  这儿也是自己想总结下,nodejs代码,listUsers、delUsers、addUsers,这是用nodejs作为服务端,写的接口。

listUsers

  而这儿的数据就是通过listUsers接口从静态json取的,而这儿listUsers接口只用了readFile方法。

app.get("/listUsers",function(req,res) {
    fs.readFile(__dirname + "/" + "users.json","utf8",function(err,data){
        console.log(data);
        res.end(data);
    });
})

  当启动server.js时,命令窗口显示:

      

  

addUsers

addUsers接口就是接客户端传过来的参数,然后返回数据给它,就跟后台写的接口一样。然后既然要传数据,自然是要读取json文件(咱的数据库),把客户端传过来的新数据插到json文件中。其中,主要就是用nodejs的api中两个方法readFile、writeFile。

app.post('/addUsers', function (req, res) {
    //console.log(req.body);
    fs.readFile(__dirname + "/" + "users.json","utf8",function(err,data){
        if (err) {
          console.error(err);
          process.exit(1);
        }
        var users = JSON.parse(data);
        var newusers = req.body;
        users.push(newusers);
        console.log(users);
        fs.writeFile(__dirname + "/" + "users.json",JSON.stringify(users, null, 4),function(err){
            if (err) {
                console.error(err);
                process.exit(1);
            }
            res.json(users);
        })
    })
})

delUser接口我们就不细看,可自行看源代码。  

 

然后再看看我们的index.html。

var getData = function() {
    var html = "";
    $("#example tbody").html("");
    $.ajax({
        url:"/listUsers",
        type:'GET',
        dataType:"json",
        success:function(data){
            for(var i=0;i<data.length;i++){
               。。。
            }
            $("#example tbody").html(html);
        }
    })
}

  

这就是我们很常见的ajax方法,接口就是listUsers也就是我们通过nodejs提供的接口。

就这么完美的将前台的js和nodejs结合起来了,当然这还真是nodejs,与静态json搭配使用。

源代码:https://github.com/wanliyuan/module/tree/gh-pages/node/simpleDemo ,下载demo链接在此

 

uploadDemo

 这是通过nodejs写的通过客户端上传文件到本地的。

 server.js核心方法是:

app.post('/file_upload', function (req, res) {

   console.log(req.files[0]);  // 上传的文件信息

   var des_file = __dirname + "/" + req.files[0].originalname;
   fs.readFile( req.files[0].path, function (err, data) {
        fs.writeFile(des_file, data, function (err) {
         if( err ){
              console.log( err );
         }else{
               response = {
                   message:'File uploaded successfully', 
                   filename:req.files[0].originalname
              };
          }
          console.log( response );
          res.end( JSON.stringify( response ) );
       });
   });
})

  

我们启动server.js成功,界面如下:

--》上传成功   --》 

   

 源代码:https://github.com/wanliyuan/module/tree/gh-pages/node/uploadDemo uploadDemo下载链接在此

posted on 2016-06-22 15:13  雨为我停  阅读(311)  评论(0编辑  收藏  举报