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;

原文发布于微信公众号 - 交互设计前端开发与后端程序设计(interaction_Designer)

原文发表时间:2017-05-06

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏JMCui

Hybris 项目工程配置

1、控制台页面进入platform目录 cd F:\hybris640\hybris\bin\platform 并运行 setantenv.bat 生成对应的a...

5949
来自专栏令仔很忙

新手学Linux(八)----MySql安装(Centos7)

最近项目新申请了云服务器,老大让我搭了下环境,在安装MySql的时候遇到的坑稍微多点,所以在这里做个记录,我的安装方式不是通过安装包来安装的,而是通过yum来...

1311
来自专栏闵开慧

eclipse中执行程序显示找不到主类

eclipse中执行程序显示找不到主类 这种情况一般出现在工程中已编译有class文件的java文件,而后面新建的java则不会出现问题。这种情况说明工程bin...

3475
来自专栏信安之路

Java代码审计-铁人下载系统

初学 java 代码审计,跟着表哥们脚步,走一遍审计流程,就选了个没有使用 Java 框架的 java 系统,作为入门。

1050
来自专栏重庆的技术分享区

Git入门

Git由Linus Torvalds为Linux内核开发设计和开发。Git为非线性分布式开发提供支持,允许多个贡献者同时处理项目。Git是最流行的分布式版本控制...

1852
来自专栏一枝花算不算浪漫

[Linux基础]Linux基础知识入门及常见命令.

4007
来自专栏编程语言

Python:VScode 设置Python不同版本运行环境

1.首先本地安装有不同的Python的版本,比如2.7和3.5.mac下一般默认自带2.7版本。  终端输入侧  python -V 则显示默认版本号。而p...

1302
来自专栏三木的博客

Linux shell 程序设计1——安装及入门

1、什么是shell? shell是linux内核的“壳”,是用户和内核的桥梁。它类似于windows下的命令提示符,将用户输入的命令解释给内核执行,并返回给用...

2036
来自专栏木头编程 - moTzxx

CentOS下(rsync+crontab)触发式实现服务器间的文件备份同步

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/u011415782/article/de...

2102
来自专栏琦小虾的Binary

Ubuntu环境如何上传项目到GitHub网站?

Ubuntu环境如何上传项目到GitHub网站? 之前笔者写了一篇《CMake学习笔记(三)——以笔者的Robosub竞赛为例》的博客。博客中笔者以自己的项目为...

2868

扫码关注云+社区

领取腾讯云代金券