sffc / socketio-file-upload

Uploads files to a Node.JS server using Socket.IO
321 stars 84 forks source link

Ability to cancel an upload in progress #69

Open TroyWolf opened 6 years ago

TroyWolf commented 6 years ago

How difficult would it be to provide a method to cancel an in-progress file upload? Dropzone.js offers this functionality: http://www.dropzonejs.com/#config-addRemoveLinks. I'm thinking something similar.

To understand why someone might want this, "accidentally" drop a folder with a dozen 500MB video files onto your application's dropzone. It would be nice if the user could click to cancel either individual files or all files.

ryanaltair commented 6 years ago

exactly, siofu have this feature already // but only in server side

at doc, we can cancel(abort) the upload with instance.abort(id, socket)

Sadly, tha'st a bit hard to used (if wrong, correct me please) when cancel a specific upload

on web side

let serialNum = 0
function startAddMeta (event) {
// we make every upload a own tag before we upload
  event.file.meta.serialNum = serialNum // tag it
  siofu.removeEventListener('start', startAddMeta)
}
siofu.addEventListener('start', startAddMeta)

function cancelUpload() { // use this to cancel 
  console.log('cancel serial num ', 2)// now we will cancel the No.2 upload
  socket.emit('abortupload', 2)
})

on server side

let needaborts = []
socket.on('abortupload', function (whichAbort) {
  needaborts.push(Number(whichAbort))
})

uploader.on('progress', function (event) {
// check if cancel needed when process event happen
  while (needaborts.length > 0) {
    let slotaborted = needaborts.pop()
    if (Number(event.file.meta.serialNum) === slotaborted) {
      uploader.abort(event.file.id, socket)
    }
  }
})
sffc commented 6 years ago

ryanaltair's solution looks like it should work, but I agree that it is not very elegant.

One issue in ryanaltair's code: you'll need to increment serialNum to prevent two uploads getting the same ID.