腊月的季节

nodejs开发总结一

发表于 | 分类于 ， | | 阅读次数

图片上传

首先我要说个软件，就是ImageMagick，这个很厉害，有需要的可以联系我哦。

今天我要完整地说一下nodejs里面上传图片，包括缩放图片，裁剪图片。首先用到的工具是nodejs，用到的模块是multer,gm。还有一个就是图片工具imageMagick,这个工具很强大。你们可以去了解一下，它也可以作为Java图片的裁剪，专门有jar包。
言归正传，我们先用nodejs搭载一个简单的网站。
取名为app.js 里面的内容为

1
2
3
4
5
var express = require('express');  
var app = express();  
var testController = require('./testController');  
app.post('/dataInpute', testController.dataInput);  
app.listen(3000);

现在我们有个接受POST请求的API，接着我们做一个中间处理器testController.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
var multer = require('./controllers');  
var upload = multer.single('photo');  
exports.dataInput = function(req, res) {  
    upload(req, res, function(err) {  
        if (err) {  
            return res.json({  
                msg: "出错了"  
            });  
        }  
        console.log(req);  
        return res.json({  
            msg: "上传成功"  
        })  
    });  
}

再一个就是这个controllers模块，所以我们就在做一个controllers.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
var multer = require('multer');  
var gm = require('gm').subClass({imageMagick:true});  
var storage = multer.diskStorage({  
    destination: function(req, file, cb) {  
        cb(null, './public/uploads');  
        gm('./public/images/' + filename).crop(req.body.width, req.body.height, req.body.x, req.body.y).write('./public/images/' + filename, function(err) {  
          if (err) {  
            console.log(err);  
            }  
        });  
    },  
    filename: function(req, file, cb) {  
        var fileFormat = (file.originalname).split(".");  
        filename = file.fieldname + '-' + Date.now() + "." + fileFormat[fileFormat.length - 1];  
        cb(null, filename);  
    }  
});  
var upload = multer({  
    storage: storage  
});  
module.exports = upload;

这三个文件在同一个目录下，还有图片的存放位置，也设在这个目录，也就是在这个目录再建立public文件夹，再在public里面建立images文件夹。
运行app.js就可以进行post请求。
现在我们说一说首先你电脑或者服务器必须安装一个imageMagic的工具，这个工具主要用作裁剪，放缩图片用的。紧接这说multer如何上传图片，首先引入multer模块，multer里面有一个diskStorage方法，传一个json语句，json语句是这样的，我目前知道两个name，一个destination，一个是filename，第一个是文件的存放的路径，第二个是文件的命名。然后再把这个定义的方法放入multer方法中，也是json语句参数，最后导出，或者可以直接调用。
调用有两种方法，第一个是单图片multer.single(‘photo’)传进来的name一定要与这个里面的photo是一样的。第二个是多图片multer.array(‘photo’,12)差不多就这两种。
文件上传后，再来 说说上传的过程中我们应该在哪去修剪图片，本人认为，修剪图片的过程可是要考虑好，因为这之间涉及异步处理，我只列出了单图片，这个很好处理，只要你能提取图片名和这个图片名的路径就可以修改这个图片。
说一下修改图片的方法吧！

1
2
3
4
5
gm('./public/images/' + filename).crop(req.body.width, req.body.height, req.body.x, req.body.y).write('./public/images/' + filename, function(err) {
          if (err) {
          console.log(err);
            }
        });

gm第一个参数是图片路径紧接着调用crop裁剪方法还有一个resize放缩方法，我讲一个裁剪方法，参数1,2是裁剪后图片的宽度和高度，参数3,4是裁剪时的起始横纵坐标。
这就是整个上传，裁剪图片的过程 。

热评文章