javascript - 上传单张图片

Question

我有一个应用程序，您可以在其中制作卡片并上传图片。问题是我总是遇到问题，有时图片上传并工作，有时却没有。我看过很多教程和示例，但我找不到我的错误在哪里。

部分表格与文件上传

<span class="event-image picture2">
    <img style="height:300px" id="promo-img-upload uploaded-picture" class="promo-img-upload" src="${eventPicture}">
    <input id="new-event-picture filename" class="img-upload filename" type="file" name="filename" accept="image/*">
</span>

AJAX 调用

var formData = new FormData($($(this).closest('form'))[0]);

console.log('heeeyyy form', $($(this).closest('form'))[0]) //THIS ONE PRINTS ALL THE FORM 
console.log('formData', formData) //THIS RETURNS EMPTY

      let offerEdited = function(res) {
        let promoId = res['promotion'][0]['id']
        $('.hidden-promo-id:last').text(promoId)
        $(`#${this_form.attr('id')} .confirmation`).text('Promo Saved')
        $('.confirmation').fadeOut(3000)


            // image upload
        $.ajax({
          type: 'POST',
          url: `/api/Upload-promo?promoId=${promoId}`,
          crossDomain: true,
          data: formData,
          cache: false,
          processData: false,
          contentType: false,
          enctype: 'multipart/form-data',
          mimeType: 'multipart/form-data',
          beforeSubmit : function() {
        },
          success : function(responseText, statusText, xhr, $form) {
    $(`#promo${promoNumber}`).find('.promo-img-upload').attr('src', `https://res.cloudinary.com/hn90uqs5e/image/upload/promos/${responseText}`);

                },
          error: function(response){
            console.log('there was an error', response)
        }
     });
   }

帖子查询

router.post('/Upload-promo', function(req, res) {
  let promoId = req.query.promoId

  let upload = multer({ storage: cloudinaryPromoStorage }).single('filename')
  upload(req, res, function (err) {
    let file = req.file
    if(file != undefined) {
      let fullFileName = file["public_id"]
      regex = /(promos\/)(.+)/
      let fileName = fullFileName.match(regex)[2]
      if (err) {
        return res.send("Error: file not uploaded")
      }

      db.any("UPDATE promotions set event_picture = $1 WHERE id = $2", [fileName, promoId])
      .catch(function(err){
        console.log(err)
      })
      return res.send(fileName)
    }
  })

})

标签： javascriptjqueryajax