node.js - 平均堆栈文件上传

Question

我最近开始使用 MEAN Stack 进行编程，目前正在实现某种社交网络。一直在使用 MEAN.io 框架来做到这一点。 我现在的主要问题是让文件上传工作，因为我想要做的是从表单接收文件到 AngularJS Controller 并将它与更多信息一起传递给 ExpressJS，这样我最终可以将所有内容发送到 MongoDB。 (我正在构建一个注册新用户表单)。

我不想将文件本身存储在数据库中，但我想存储指向它的链接。

我用不同的搜索查询在谷歌上搜索了几十个页面，但我找不到任何我能理解或工作的东西。一直在寻找几个小时没有结果。这就是我来这里的原因。

谁能帮我解决这个问题？

谢谢:)

编辑:也许一些代码会有助于理解。

我用作基础的默认 MEAN.io 用户 Angular Controller 具有:

$scope.register = function(){
        $scope.usernameError = null;
        $scope.registerError = null;
        $http.post('/register', {
            email: $scope.user.email,
            password: $scope.user.password,
            confirmPassword: $scope.user.confirmPassword,
            username: $scope.user.username,
            name: $scope.user.fullname
        })//... has a bit more code but I cut it because the post is the main thing here.
    };

我想做的是: 从表单接收一个文件到这个 Controller 上，并将它与电子邮件、密码、姓名等一起传递，并且能够在位于服务器端的 expressjs 上使用 json。 '/register' 是一个 nodejs 路由，因此是一个服务器 Controller ，它创建用户(使用用户模式)并将其发送到 MongoDB。

Answer 1

我最近做了这样的事情。我用了angular-file-upload .您还需要 node-multiparty让您的端点解析表单数据。然后你可以使用 s3用于将文件上传到 s3。

这是我的一些[编辑]代码。

Angular 模板

<button>
  Upload <input type="file" ng-file-select="onFileSelect($files)">
</button>

Angular Controller

$scope.onFileSelect = function(image) {
  $scope.uploadInProgress = true;
  $scope.uploadProgress = 0;

  if (angular.isArray(image)) {
    image = image[0];
  }

  $scope.upload = $upload.upload({
    url: '/api/v1/upload/image',
    method: 'POST',
    data: {
      type: 'profile'
    },
    file: image
  }).progress(function(event) {
    $scope.uploadProgress = Math.floor(event.loaded / event.total);
    $scope.$apply();
  }).success(function(data, status, headers, config) {
    AlertService.success('Photo uploaded!');
  }).error(function(err) {
    $scope.uploadInProgress = false;
    AlertService.error('Error uploading file: ' + err.message || err);
  });
};

路线

var uuid = require('uuid'); // https://github.com/defunctzombie/node-uuid
var multiparty = require('multiparty'); // https://github.com/andrewrk/node-multiparty
var s3 = require('s3'); // https://github.com/andrewrk/node-s3-client

var s3Client = s3.createClient({
  key: '<your_key>',
  secret: '<your_secret>',
  bucket: '<your_bucket>'
});

module.exports = function(app) {
  app.post('/api/v1/upload/image', function(req, res) {
    var form = new multiparty.Form();
    form.parse(req, function(err, fields, files) {
      var file = files.file[0];
      var contentType = file.headers['content-type'];
      var extension = file.path.substring(file.path.lastIndexOf('.'));
      var destPath = '/' + user.id + '/profile' + '/' + uuid.v4() + extension;

      var headers = {
        'x-amz-acl': 'public-read',
        'Content-Length': file.size,
        'Content-Type': contentType
      };
      var uploader = s3Client.upload(file.path, destPath, headers);

      uploader.on('error', function(err) {
        //TODO handle this
      });

      uploader.on('end', function(url) {
        //TODO do something with the url
        console.log('file opened:', url);
      });
    });
  });
}

我从我的代码中更改了它，因此它可能无法立即使用，但希望它会有所帮助!