Question

我使用multipart/form-data上传图片，我想在将其存储在磁盘上的任何位置之前调整大小。我使用gm来完成此任务但无法完成此操作。

<form id="uploadForm" enctype="multipart/form-data" method="post" action="/upload">
        <input type="file" name="userFile" />
        <input type="submit" value="Upload File" name="submit">
</form>

这里是js文件，现在我想调整图像大小，而不是使用Imagemagick(gm)中的node模块将其存储在磁盘上的任何位置。我是节点的新手，我们如何使用该部件并调整图像大小。

var express = require('express');
var multiparty = require("multiparty");
var app = express();
const sharp = require('sharp');
const gm = require('gm').subClass({imageMagick: true});

app.get('/', function(req, res){
  res.sendFile('index.html' , { root : __dirname});
});


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

  console.log("in upload")

  var count = 0;
  var form = new multiparty.Form();

  // Errors may be emitted
  // Note that if you are listening to 'part' events, the same error may be
  // emitted from the `form` and the `part`.
  form.on('error', function(err) {
    console.log('Error parsing form: ' + err.stack);
  });

  // Parts are emitted when parsing the form
  form.on('part', function(part) {
    // You *must* act on the part by reading it
    // NOTE: if you want to ignore it, just call "part.resume()"

    if (!part.filename) {
      // filename is not defined when this is a field and not a file
      console.log('got field named dd' + part.name);
      // ignore field's content
      part.resume();
    }

    if (part.filename) {
      // filename is defined when this is a file
      count++;
      console.log('got file named ' + part.name);
     // console.log(part);

     part.on('data', (chunk) => {
       console.log("chunck: "+chunk);

      var readStream = fs.createReadStream(chunk);
       gm(readStream, part.filename)
       .resize(240, 240)
       .noProfile()
       .write('res.png', function (err) {
         console.log('Ingm');
         if (!err) console.log('resize done');
           else
               console.log('gm error: '+err);
       });

      });

      // ignore file's content here
      part.resume();
    }

    part.on('error', function (err) {
      // decide what to do
    });
  });

  // Close emitted after form parsed
  form.on('close', function() {
    console.log('Upload completed!');
    res.setHeader('text/plain');
    res.end('Received ' + count + ' files');
  });

  // Parse req
  form.parse(req);

  });

Answer 1

在这种情况下提供originalPath和thumbnailPath缩略图调整图像大小

function resizeImage(originalPath, thumbnailPath, callback) {
    const gm = require('gm').subClass({imageMagick: true});
    gm(originalPath)
        .resize(WIDTH, HEIGHT, "!")
        .autoOrient()
        .write(thumbnailPath, (err, data) => {
            callback(err)
        })
}

Answer 2

您尝试读取上传的文件流，而不是将其传递给imageMagick。此外，您在收到的文件上使用resume()，将其丢弃。尝试更改此内容：

if (part.filename) {
  // filename is defined when this is a file
  count++
  console.log('got file named ' + part.name)
  // console.log(part);
  part.on('data', (chunk) => {
    console.log('chunck: ' + chunk)
    var readStream = fs.createReadStream(chunk)
    gm(readStream, part.filename)
      .resize(240, 240)
      .noProfile()
      .write('res.png', function (err) {
        console.log('Ingm')
        if (!err) console.log('resize done')
        else
          console.log('gm error: ' + err)
      })
  })
  // ignore file's content here
  part.resume()
}

为此：

if (part.filename) {
  // filename is defined when this is a file
  count++
  console.log('got file named ' + part.name)
  // console.log(part);
  gm(part)
    .resize(240, 240)
    .noProfile()
    .write('res.png', function (err) {
      console.log('Ingm')
      if (!err) console.log('resize done')
      else
        console.log('gm error: ' + err)
    })
  // ignore file's content here; but we don't want that!
  // part.resume()
}

调整图像大小而不将其上传到任何使用nodejs中的gm

2 个答案: