nodejs+ftp+linux+nginx 自动部署前端

原理就是利用

1.nodes中ftp模板，上传本地的前端文件到服务器指定目录；

2.在服务器上安装nginx已经搭建了ftp服务

下面就是详细步骤：

1.linux搭建FTP服务器，以前说了，就不说了；

2.linux安装nginx，以前也说了；

上面这两个属于前面的工作，先肯定要安装；

nginx注意配置，下面是我的配置：

注意看这个：

server {
        listen  8112;
        server_name localhost;
        location / {
                root /home/test/testautodev;
                index  index.html index.htm;
        }
    }

代表监听8112端口

根目录在/home/test/testautodev

入口文件是：index index.html index.htm;

到时候，我本地用nodejs上传就是上传到这个目录；

到时候启动nginx，可以用ip+端口8112访问;

nginx的配置每改动一次，记得重启生效；

记得给这个目录下面的文件给权限，不然上传的时候，无法创建文件夹；

权限这样给：

chmod 777 /home/test/testautodev/

3.之后，看nodejs这边

这个前端的项目结构是这样的，举个例子，结构比较简单，知道这个原理，结构复杂也是一样的

下面就是要把testautodev/testautodev这个目录整个上传到服务器

下面就是node/index.js

/**
 * Created by zhouli on 17/4/27.
 */
var Client = require('ftp');
var fs = require('fs');
var path = require('path');
var c = new Client();
var connectionProperties = {
 host: "47.89.193.183",
 user: "test",
 password: "Zhouli@json"
};

 


c.on('ready', function () {
c.put('../testautodev/index.html', 'testautodev/index.html', function(err) {
 if (err) throw err;
 console.dir("上传文件到服务器");
 c.end();
});
c.put('../testautodev/css/index.css', 'testautodev/css/index.css', function(err) {
 if (err) throw err;
 console.dir("上传文件到服务器");
 c.end();
});
c.put('../testautodev/js/index.js', 'testautodev/js/index.js', function(err) {
 if (err) throw err;
 console.dir("上传文件到服务器");
 c.end();
});

});


c.connect(connectionProperties);

写完后，到node这个目录执行这个文件

node index.js

不错意外就会上传成功；

如果有报错，可能是node模块没有安装，那就根据提示安装；

还有可能是服务器那边没有设置创建文件权限，那么就需要设置；

上传之后，服务器上就是这个样子

如果服务器启动了nginx，那么访问也有结果的

4。上面那个nodejs文件写得比较麻烦

其实可以直接用一个函数获取路径，

node/index.js
/**
 * Created by zhouli on 17/4/27.
 */
var Client = require('ftp');
var fs = require('fs');
var path = require('path');
var c = new Client();
var connectionProperties = {
 host: "47.89.193.183",
 user: "test",
 password: "Zhouli@json"
};

//获取目录下来的文件路径
var walk = function (dir, done) {
 var results = [];
 fs.readdir(dir, function (err, list) {
 if (err) return done(err);
 var pending = list.length;
 if (!pending) return done(null, results);
        list.forEach(function (file) {
            file = path.resolve(dir, file);
 fs.stat(file, function (err, stat) {
 if (stat && stat.isDirectory()) {
 walk(file, function (err, res) {
 results = results.concat(res);
 if (!--pending) done(null, results);
                    });
                } else {
 results.push(file);
 if (!--pending) done(null, results);
                }
            });
        });
    });
};


c.on('ready', function () {
 var tpath = path.resolve(__dirname, '..') + "/testautodev";
 walk(tpath, function (err, results) {
 if (err) throw err;
        results.forEach(function (filename) {
            (function (filename) {
 "use strict";
 var spath = filename.replace(//Users/zhouli/mycoding/testautodev//g, "");
 c.put('../' + spath, spath, function (err) {
 if (err) throw err;
 console.dir("上传文件" + spath);
 c.end();
                });
            })(filename)
        });
    });


});

c.connect(connectionProperties);

这样就方便多了，不需要每次加一个文件，手动加一次；

还有一个地方要注意

就是

这个地方，nodes中for循环与foreach都是异步的

这种利用闭包保证同步

results.forEach(function (filename) {
            (function (filename) {
 "use strict";
 var spath = filename.replace(//Users/zhouli/mycoding/testautodev//g, "");
 c.put('../' + spath, spath, function (err) {
 if (err) throw err;
 console.dir("上传文件" + spath);
 c.end();
                });
            })(filename)
        });

也就是说，下面这两种是达不到效果的

results.forEach(function (filename) 
 "use strict";
 var spath = filename.replace(//Users/zhouli/mycoding/testautodev//g, "");
 c.put('../' + spath, spath, function (err) {
 if (err) throw err;
 console.dir("上传文件" + spath);
 c.end();
                });
 
        });
for(var i = 0; i < results.length; i++){
 var spath = results[i].replace(//Users/zhouli/mycoding/testautodev//g, "");
 c.put('../' + spath, spath, function (err) {
 if (err) throw err;
 console.dir("上传文件" + spath);
 c.end();
                });
}

这两种方式都只会上传最后一个，原因就是循环太快，上传很慢；

导致输出同一个文件

下面就是结果

（浏览器并不是访问的本地，而是公网的服务器）

--------------

------

学习php的同学可加qq群交流：419079878；