resumablejs
Reactive icon

ResumableJS

Stable version 1.0.2 (Compatible with OutSystems 11)
Uploaded
 on 17 October 2020
 by 
4.0
 (1 rating)
resumablejs

ResumableJS

Documentation
1.0.2

What is ResumableJS?

ResumableJS is a component that provides robust and reliable file upload functionality. It's designed to work with multiple files and has support for resuming file uploads (ie, retrying/restarting (a part of) a file).


Do I need more components then just this one?

This component is just the front-end part of the solution. You will also need to use a back-end component. Currently only one is available and that one works by storing the file parts in the OutSystems database. Be aware that uploading large files will fill up your database quickly!

Back-end component w/ storage in the OutSystems Database: ResumableJS Core.
Back-end component w/ storage in and Azure Storage Account: ResumableJS Core - Azure Storage Account


How do I use it?

Follow these steps:

Back-end:

  1. Open Service Center
  2. Open the back-end component
  3. Open the Site Settings tab
  4. Fill in an unique value in the ApiKey site settings. I recommend using an GUID

Front-end:

  1. Create a container and give it some dimensions (width and height)
  2. Give the container a name
  3. Drag the Resumable widget on the page (but after the container created in step 1)
  4. Set the ContainerId to the Id of the container created in step 1
  5. Fill in the ApiKey under Options -> Header - Api_Key. You created this key in step 4 of the back-end instructions.
  6. Create the needed Event Handlers
  7. Create a button that will start the upload after the files have been dragged into the Container
  8. Drag the Action "Upload" into the action of the button

In the default configuration you can now start to upload files. 


How do I retrieve my files?

Use the action "StitchFile" in the ResumableJS Core to retrieve the binary from the database. There are other actions available to manage the files (remove the different parts, change the different statusses and more).

For usage of the stitching process of the ResumableJS Core - Azure Storage Account please read its own documentation.


Can I get an application that shows how it works?

There is a Demo application available. For security purposes I have not enabled the "Try Now" button to make sure my storage isn't filled up. Please install this component in your own environment.


More instructions will be made in the near future.