NodeJs利用七牛云存储实现图片上传缩略图生成等操作

作为国内比较出色的oss内容存储，七牛有一下几个特点：

1、安全性

针对用户上传的数据，至少创建三副本并跨IDC存储到多个数据中心，保证数据的高可用性和可靠性。用户可通过七牛的身份验证机制设置不同的访问权限和访问级别。

2、弹性空间

七牛的存储系统支持弹性扩容，让您无需担心存储空间不足。七牛的存储、加速节点遍布全球，且每个节点都是读/写/同步IO，真正做到数据实时一致，从而保障了读写性能不会随着数据量增长而降低。

3、按需付费

用多少，花多少！传统的存储方式，基本是按峰值预估带宽和空间，但日常用不到那么大的量。使用七牛云存储，可以帮您节省高达70%的存储成本。

4、持续在线

所有的故障（IDC故障、设备故障等）和升级（系统升级、扩容等）透明化，您感觉到的是持续可用的服务。七牛的服务7x24小时在线，避免服务升级或服务器宕机而导致数据不可访问。

在分发加速和数据处理方面也做的不错，提供丰富的api可以实现复杂的需求，目前我就最简单的图片上传说明一下。

主要用到了七牛的JS SDK 和 NodeJs sdk

1、前端引入js文件：

<!--七牛上传-->
<script src="/plugins/qiniu/plupload.full.min.js"></script>
<script src="/plugins/qiniu/qiniu.js"></script>

2、前端表现层：

<div class="col-sm-4 selectHeaderLog" id="upContainer">
       <button class="btn btn-gray" role="button" id="pickfiles">选择图片</button>
       <p>jpg、gif、png格式，尺寸要求：<font color="#c00">100x100/px</font></p>
</div>

3、初始化上传按钮：

//初始化七牛云存储
function initQiniuBtn($scope,containerId,bottonId,callBack){
    var uploader = Qiniu.uploader({
        runtimes: 'html5,flash,html4',    //上传模式,依次退化
        browse_button: 'pickfiles',       //上传选择的点选按钮，**必需**
        uptoken_url: '/users/qiniu/upToken',
        //Ajax请求upToken的Url，**强烈建议设置**（服务端提供）
        // uptoken : '<Your upload token>',
        //若未指定uptoken_url,则必须指定 uptoken ,uptoken由其他程序生成
        // unique_names: true,
        // 默认 false，key为文件名。若开启该选项，SDK会为每个文件自动生成key（文件名）
        save_key: true,
        // 默认 false。若在服务端生成uptoken的上传策略中指定了 `sava_key`，则开启，SDK在前端将不对key进行任何处理
        domain: 'http://7xkrk4.com1.z0.glb.clouddn.com/',
        //bucket 域名，下载资源时用到，**必需**
        container: 'upContainer',           //上传区域DOM ID，默认是browser_button的父元素，
        max_file_size: '5mb',           //最大文件体积限制
        flash_swf_url: 'js/plupload/Moxie.swf',  //引入flash,相对路径
        max_retries: 3,                   //上传失败最大重试次数
        dragdrop: true,                   //开启可拖曳上传
        drop_element: 'container',        //拖曳上传区域元素的ID，拖曳文件或文件夹后可触发上传
        chunk_size: '4mb',                //分块上传时，每片的体积
        auto_start: true,                 //选择文件后自动上传，若关闭需要自己绑定事件触发上传
        filters: {
            mime_types : [
                {title : "Image files", extensions: "jpg,jpeg,gif,png"}
            ]
        },
        multi_selection : false,
        init: {
            'FilesAdded': function(up, files) {
                plupload.each(files, function(file) {
                    // 文件添加进队列后,处理相关的事情
                });
            },
            'BeforeUpload': function(up, file) {
                // 每个文件上传前,处理相关的事情
            },
            'UploadProgress': function(up, file) {
                // 每个文件上传时,处理相关的事情
            },
            'FileUploaded': function(up, file, info) {
                var domain = up.getOption('domain');
                var res = jQuery.parseJSON(info);

                callBack($scope,domain,res);

            },
            'Error': function(up, err, errTip) {
                //上传出错时,处理相关的事情
            },
            'UploadComplete': function() {
                //队列文件处理完毕后,处理相关的事情
            },
            'Key': function(up, file) {
                // 若想在前端对每个文件的key进行个性化处理，可以配置该函数
                // 该配置必须要在 unique_names: false , save_key: false 时才生效
                var key = "";
                // do something with key here
                return key
            }
        }
    });
// domain 为七牛空间（bucket)对应的域名，选择某个空间后，可通过"空间设置->基本设置->域名设置"查看获取
// uploader 为一个plupload对象，继承了所有plupload的方法，参考http://plupload.com/docs
}

上面是七牛提供的初始化按钮的方式，在七牛文档可以找到，我在这里做了点小改动，传入了callBack 回调函数，通过后面的

initQiniuBtn($scope,'upContainer','pickfiles',afterUpdateLogo);

方式进行调用，这样其它的上传按钮就可以用同一个初始化的方法了，不用重复写。

4、服务端只实现了一个获取 upToken 的方法，服务端需要先安装nodejs sdk

npm install qiniu --save

//七牛获取uptoken
//七牛云存储
var qiniu = require('qiniu');

//七牛key
qiniu.conf.ACCESS_KEY = Settings.QINIUACCESS_KEY;
qiniu.conf.SECRET_KEY = Settings.QINIUSECRET_KEY;

router.get('/qiniu/upToken', function(req, res, next) {

    var myUptoken = new qiniu.rs.PutPolicy(Settings.QINIUCMSBUCKETNAME);
    var token = myUptoken.token();
    moment.locale('en');
    var currentKey = moment(new Date()).format('YYYY-MM-DD--HH-mm-ss');
    res.header("Cache-Control", "max-age=0, private, must-revalidate");
    res.header("Pragma", "no-cache");
    res.header("Expires", 0);
    if (token) {
        res.json({
            uptoken: token,
            sava_key :currentKey
        });
    }

});

我这里返回了两个参数：

uptoken 必须，赋予客户端上传权限

save_key 非必须，定义上传文件名称参数

大功告成