Vue Express загрузка нескольких файлов в Amazon S3

Question

Мне нужна помощь о том, как загрузить несколько файлов изображений на Amazon S3. я скажу, что у меня есть три входа, как это

<template lang="html">
 <form enctype="multipart/form-data" @submit.prevent="sendFile">
  <input type="file" ref="file1" @change="selectFile1">
  <input type="file" ref="file2" @change="selectFile2">
  <input type="file" ref="file3" @change="selectFile3">
  <div class="field">
   <button class="button is-info">Send</button>
  </div>
 </form>
</template>

и мой сценарий внешнего интерфейса выглядит так

<script>
 import _ from 'lodash'

 export default {
  name: 'BulkUpload',



data() {
    return {
      file: "",
      message: "",
      error: false,
      sendFiles: []
    }
  },

  methods: {
    selectFile1() {
      this.file = this.$refs.file1.files[0]
      this.sendFiles.push(this.file)
      console.log(this.sendFiles);
    },

    selectFile2() {
      this.file = this.$refs.file2.files[0]
      this.sendFiles.push(this.file)
      console.log(this.sendFiles);
    },

    selectFile3() {
      this.file = this.$refs.file3.files[0]
      this.sendFiles.push(this.file)
      console.log(this.sendFiles);
    },

    sendFile() {

      let formData = new FormData()
      _.forEach(this.uploadFiles, file => {
        formData.append('file', file)
      })

      var self = this
      axios.post('http://localhost:3000/image/bulkupload', formData)
      .then(function(response) {
        console.log(response);
        self.message = "File has been uploaded"
        self.file = ""
        self.error = false
      })
      .catch(function(err) {
        self.message = "Something went wrong"
        self.error = true
        console.log(err);
      })
    }
  }
}
</script>

после отправки с использованием formData на экспресс-сервер мой маршрут изображения обработает его с этим кодом

const sendingImage = require('../helper/sendingImage');

    router.post('/bulkupload', sendingImage.upload.array("file"), (req, res) => {
  var promises=[];
  for(var i = 0; i < req.files.length; i++) {
    var file = req.files[i];
    promises.push(sendingImage.uploadLoadToS3(file));
  }
  Promise.all(promises).then(function(data){
    res.send('Uploadedd');
    console.log('success');
  }).catch(function(err) {
    console.log('failed');
    res.send(err.stack);
  })
})

и мой помощник выглядит так

const multer = require('multer');
const aws = require('aws-sdk');

aws.config.update({
  accessKeyId: <my access id>,
  secretAccessKey: <my secret key>
})

const upload = multer({
  dest: './uploads/'
})

function uploadLoadToS3(ObjFile){
  var params = {
    ACL :'public-read',
    Body : new Buffer(ObjFile.buffer),
    Bucket:'vue-express-upload',
    ContentType:ObjFile.mimetype,
    Key:ObjFile.originalname
  }
  return s3.upload(params).promise();
}

module.exports = {
  upload,
  uploadLoadToS3
}

Если честно, мой код работает без проблем. он отправляет статус ответа 200 без каких-либо ошибок. но проблема в том, что когда я проверяю свою корзину S3, в ней нет загруженного файла. все еще пусто что-то не так с моим кодом?

Answer 1

Решение, которое я нашел для использования aws-sdk. Хорошо, что я тоже буду использовать это решение и мои проекты.

Кредиты: StackOver - Ответ Справка: Multer-s3

В вашем вспомогательном файле вы оставите его так:

const aws = require('aws-sdk')
const multer = require('multer')
const multerS3 = require('multer-s3')

aws.config = new aws.Config({
    accessKeyId: <my access id>,
    secretAccessKey: <my secret key>,
    region: <my region>
})
const s3 = new aws.S3()
const upload = multer({
    storage: multerS3({
    s3: s3,
    acl: 'public-read',
    bucket: 'vue-express-upload',
    contentType: function(req, file,cb){
        cb(null, file.mimetype)
    },
    key: function (req, file, cb) {
        cb(null, file.originalname)
    }
    })
})

module.exports = upload

Ключ файла вы также можете изменить на что-то более уникальное, например дату / минуты / секунды. На ваше усмотрение, я использовал имя файла в качестве ключа.

В вашем роутере маршрут будет выглядеть так:

const upload = require('../helper/sendingImage')

router.post('/bulkupload', upload.array('files'), (req, res) => {
    console.log('success')
    //console.log(req.files)
    res.send('Uploadedd')
    //res.send(req.files)    
})

Для просмотра загружаемых данных:

router.post('/bulkupload', upload.array('files'), (req, res) => {
    res.send({
        status: 200,
        data: {
            sucess: true,
            file: req.files
        }
    })   
})

Если файл промежуточного программного обеспечения отсутствует, он просто не будет отправлять. Не вернет ошибку. Единственными ошибками, которые могут возвращаться, являются ошибки в информации доступа AWS.

Примечание: я использовал почтальона.