当我上传图像并在 angular 中显示它们并使用 GraphicsMagick 节点时出现问题

Question

我使用这段代码在 Node 中上传图片：

req.file('image[]')
.upload({
  maxBytes: 5000000, // Files limit(in bytes)
  dirname: path.resolve(sails.config.appPath, 'assets/images/user') // Path to copy the files
}, function whenDone(err, uploadedFiles) {
  if (err) {
    // here must delete the created user before the error
    console.log(err);
  }
  var image_real_name = '';
  var json = [];
  for(var i = 0; i < uploadedFiles.length; i++){
    image_real_name = 'images/user/'+path.basename(uploadedFiles[i].fd);
    json.push(image_real_name);
  }
  res(json);
});

但我需要压缩图像以在服务器上获得 space，所以我使用了 gm GraphicsMagick:

`

var receiver = new Writable({objectMode: true});
  receiver._write = function(file, enc, cb) {
    // The output stream to pipe to
    var output = require('fs').createWriteStream('assets/images/user/' + file.fd);
    gm(file).resize('200', '200').stream().pipe(output);
    cb();
  };
  req.file('image[]').upload(receiver, function(err, files){
    if (err) {
      // here must delete the created user before the error
      console.log(err);
    }
    var image_real_name = '';
    var json = [];
    for(var i = 0; i < files.length; i++){
      image_real_name = 'images/user/'+path.basename(files[i].fd);
      json.push(image_real_name);
    }
    res(json);
  });

`

我正在使用 angular，当我通过绑定更改图像的方向时，应该显示新图像，但它没有加载，第一个代码完美无缺，但使用 gm 不再起作用。我必须重新启动页面才能显示图像。

轨道：显然图像还没有完全处理，如果输入一个setTime，图像会正确显示：

setTimeout((dataService: DataService, image: any) => {
          dataService.getUser().image = image;
        }, 1000, this.data, dataI.json().url);

有什么想法吗？

Answer 1

文件完全加载时有一个完成事件，我通过添加以下内容解决了问题：

output.on("finish", function() { return cb(); });

当我上传图像并在 angular 中显示它们并使用 GraphicsMagick 节点时出现问题

Problems when I upload images and show them in angular and node using the GraphicsMagick

node.js

sails.js

angular