DevExtreme - File Uploader - Chunk Uploading and Client-Side Validation (v18.2)

Two very useful new File Uploader features are coming your way in v18.2: Chunk Uploading and Client-Side Validation.

As usual, these features are available to you on all platforms supported by DevExtreme, including Angular, Vue, React, jQuery and ASP.NET MVC and ASP.NET Core.

Chunk Uploading

When users upload large files, it is not safe to do so in a single request. For instance,the server might go down during the process and lose data kept in memory. Of course large files uploaded in single requests can also cause resource issues on a server.

In v18.2 we implemented support for chunk uploading. You activate it by setting the chunkSize option like this:

$('#file-uploader').dxFileUploader({
  chunkSize: 200000,
  uploadUrl: '...'
});

As a result, your server will receive multiple requests to the uploadUrl, including details about the file and the chunk index (see the chunkSize documentation). The format is multipart/form-data, with the new chunk-specific information passed as an extra part in JSON format.

Client-Side Validation

You can now configure the File Uploader with a maximum file size and a set of allowed file extensions:

$('#file-uploader-images').dxFileUploader({
  maxFileSize: 4000000,
  allowedFileExtensions: ['.jpg', '.jpeg', '.gif', '.png']
});

These validations are executed on the client, which means that the user receives instant feedback and unnecessary traffic to the server may be prevented. Note that this is not a mechanism to prevent abuse – you still need to perform server-side validation of uploaded data!

Your Thoughts Count

If you have any thoughts or concerns about the new features, please get back to us by leaving a comment below or by opening a Support Center ticket or a GitHub issue. We appreciate your feedback!

Free DevExpress Products - Get Your Copy Today