uploadFiles( )

Uploads the files that the site visitor has chosen.

Description

The uploadFiles() function triggers the upload of the files in the upload button's value property.

The uploadFiles() function allows you to upload image, video, audio, document, and gallery (both images and video) files. You can upload multiple image, video, and gallery files at a time. Use the fileLimit property to set the number of files you can upload at a time.

Note that this function does not yet support multiple audio and document file uploads. You can only upload audio and document files one at a time, and the fileLimit property is restricted to 1.

The upload button does not accept files larger than certain sizes, depending on the file type. Maximum allowed file sizes are listed here.

uploadFiles() returns promptly (meaning, it does not attempt to contact the upload server) with UploadError when either the validityState's fileSizeExceedsLimit or fileTypeNotAllowed property is true.

Note: This function replaces the deprecated startUpload(). The deprecated function will continue to work, but it will not receive updates. To keep any existing code compatible with future changes, see the migration instructions.

Syntax

function uploadFiles(): Promise<Array<UploadedFile>>

uploadFiles Parameters

This function does not take any parameters.

Returns

Fulfilled - Resolves when the file upload is completed and returns an array of UploadedFile objects. Rejected - Rejects if the file upload fails and returns an UploadError object, which contains the error code and description.

Return Type:

Promise<Array<UploadedFile>>

NAME

TYPE

DESCRIPTION

width

number

Width of an uploaded image or video file.

height

number

Height of an uploaded image or video file.

duration

number

Duration (in milliseconds) of an uploaded audio file.

fileUrl

string

Wix media URL of the successfully uploaded file in the following format: 'wix:image://v1/<uri>/<filename>#originWidth=<width>&originHeight=<height>[&watermark=<watermark_manifest_string>]'.

Note: This replaces the old fileName parameter. fileName will continue to work, but we recommend that you use the updated fileUrl parameter instead.

fileName

string

Deprecated. Use the fileUrl property instead.

Internal file name of the uploaded file, generated by the Media Manager. The name is the string located in the file's URL. Click here to learn more.

originalFileName

string

Original name of the uploaded file.

Was this helpful?

Start a file upload

Copy Code

1$w("#myUploadButton").uploadFiles()
2  .then( (uploadedFiles) => {
3    uploadedFiles.forEach(uploadedFile => {
4      console.log('File url:', uploadedFile.fileUrl);
5    })
6  })
7  .catch( (uploadError) => {
8    let errCode = uploadError.errorCode;  // 7751
9    let errDesc = uploadError.errorDescription; // "Error description"
10} );

Typical file upload scenario

This example uploads multiple files when the site visitor clicks a button. First it sets the type of file a site visitor can choose (in this case, an image). Then the example checks to see if the site visitor chose files using the upload button. If files were chosen, it triggers the uploadFiles() function and logs the status of the file upload when it completes successfully or with an error.

Copy Code

1$w("#myUploadButton").fileType = "Image"; // Site visitor can choose an image 
2$w('#myButton').onClick( () => {                 
3  if ($w("#myUploadButton").value.length > 0) {  // Site visitor chose a file
4    console.log("Uploading the following files:")
5    $w("#myUploadButton").uploadFiles()
6      .then( (uploadedFiles) => {
7        uploadedFiles.forEach(uploadedFile => {
8        console.log("File url:" + uploadedFile.fileUrl);
9        })
10      console.log("Upload successful.");
11      } )
12      .catch( (uploadError) => {
13      console.log("File upload error: " + uploadError.errorCode);
14      console.log(uploadError.errorDescription);
15      } );
16  }
17  else {  // Site visitor clicked button but didn't choose a file
18    console.log("Please choose a file to upload.")
19  }
20} );
21
22