next-s3-upload icon indicating copy to clipboard operation
next-s3-upload copied to clipboard

Enable request aborting

Open sitch opened this issue 1 year ago • 1 comments

It's rather useful (especially if filesizes are large), to be able to abort an upload

Just need to modify: https://github.com/ryanto/next-s3-upload/blob/master/packages/next-s3-upload/src/hooks/use-uploader.ts#L122

Looks like this:

let controller = new AbortController();
fetch(url, {
  signal: controller.signal
});
controller.abort()

Easiest is probably just to accept controller as an arg to .uploadToS3/2:

let controller = new AbortController();

uploadToS3(file, {endpoint: {request: {controller}})

controller.abort()

See: https://javascript.info/fetch-abort#using-with-fetch

However, better is likely to modularize the http lib in the event that a use-case prefers something other than fetch, like axios or request, etc.

A syntax like:

const { abort, progress, promise } = uploadToS3(file)

Would be breaking, but IMHO is a bit more natural in terms of being given access to both abort and the promise at the same execution point, and avoiding fetch specific details, and dependency injection.

sitch avatar Apr 21 '23 22:04 sitch

Thanks for the issue!

Having an abort controller for large file uploads is a great idea. I'd be happy to accept a PR that adds this. An abort controller can be supplied to lib-storage's Upload class on this line here: https://github.com/ryanto/next-s3-upload/blob/master/packages/next-s3-upload/src/hooks/use-s3-upload.tsx#L41

Right now this library use fetch for getting the signed credentials for uploading, but not for performing the upload. To do the upload we rely on lib-storage. I think at this point in time I don't have the bandwidth to have this library support multiple http clients.

ryanto avatar Apr 21 '23 23:04 ryanto