# miniprogram-file-uploader

Small procedures large file upload library.

This upload library depends on FileSystemManager.readFile Interface for block reading of files, basic library version 2.10.0 And above can be obtained through isSupport Interface judgment.

# Supported features

• [x] Block reading, limiting memory footprint
• [x] Partitioned concurrent uploads
• [x] Support suspension, recovery, cancellation, retransmission
• [x] Support second pass, calculated md5 to determine whether the server has existed
• [x] Support schedule, estimated remaining time, average speed, automatic error retry
• [x] Error handling

# install

adopt npm install

npm i miniprogram-file-uploader

# Use

Create a uploader Examples:

if  (Uploader.isSupport()) {
  const uploader = new Uploader({
    tempFilePath,
    totalSize: size,
    uploadUrl: UPLOAD_URL,
    mergeUrl: MERGE_URL,
  })

  uploader.upload()
}

After instantiation, you can choose to listen for some events:

// It's triggered by success or failure.
uploader.on('complete', (nothing) => {
  console.log('upload complete', nothing)
})

// File upload successfully
uploader.on('success', (nothing) => {
  console.log('upload success', nothing)
})

// File upload failure
uploader.on('fail', (nothing) => {
  console.log('fail', nothing)
})

// Change in file schedule
uploader.on('progress', (nothing) => {
  this.setData({
    progress: nothing.progress,
    uploadedSize: parseInt(nothing.uploadedSize / 1024),
    averageSpeed: parseInt(nothing.averageSpeed / 1000),
    timeRemaining: nothing.timeRemaining
  })
})

# How the server receives

Because the Mini Program side adopts block uploading, the server side also needs to verify the second pass, receive block, block merge and other processing. example/server/app.js That involves three interfaces:

1. Second pass verification (verifyUrl: Get)

When the configuration item testChunks for true The Mini Program side sends a validation request in advance using the spark-md5 According to the content of the file to calculate the unique identity, the server can determine whether the value has uploaded, or uploaded part of the fragment, and returned to the front. Mini Program side in this way can be continued or second transmission effect. It is important to note that the hash Values also have a certain amount of time and memory consumption.

# Request parameters

# Return parameters

2. Receive partitioning (uploadUrl: Post)

Mini Program side wx.request Interface sends binary data of a file,content-type for application/octet-streamAfter receiving the request, the server puts it into the temporary storage area and merges after receiving a merge request.

Upload interface query Contains the following chunking information

• identifier: Unique identification of a file
• indexBlock number, from 0 start
• chunkSize： Block size, the last block may be less than this value
• fileName: Filename, passed in
• totalChunksTotal number of blocks, based on chunkSize Calculation
• totalSize: Total file size

3. Merge block (mergeUrl: Get)

After all the blocks are sent, the Mini Program sends the merge request, the server merges according to the fragment sequence number, and returns the final file online path.

# Request parameters

# Return parameters

For each request, the Mini Program side is configured according to the successStatus 、 failStatus And returned statusCode Judge success or failure.

• 200, 201, 202: Successful request
• 404, 415, 500, 501: Request fails, file upload aborted
• Other Status Code: Error occurred, but will automatically retry

# API file

# Uploader

# Configuration item

When instantiated, you can pass in a configuration item:

const uploader = new Uploader(option)

# method

• .on(event, callback) Listening event
• .off(event, callback) Remove event monitoring
• .upload() Start uploading.
• .pause() Suspend upload
• .resume() Continue uploading, with pause Paired use
• .cancel() Cancel all uploaded files with upload Paired use
• .isSupport() Is the current Mini Program version supported

# event

adopt on Method to listen in

• successTriggered upon successful upload,and = {errCode: 0, url: 'xxx'}
• failTriggered when uploading fails,and = {errCode: 0, errMsg: 'xxx'}
• completeTriggered when the upload succeeds or fails, and the return value is the same as the success or fail
• retryTriggered on request for retransmission,and = {statusCode: 302, url: 'xxx'}
• progess, triggered when the upload progress changes, and returns the following:

# Note

1. Because wx.requst No, progressUpdate Event, here. progress Event triggers after receiving the result of a chunking request
2. Real machine chooseVideo Returns temporary files, each calculated md5 Unable to use second pass function with different values
3. Lack of real machine console.timeEnd Method, some of the development logs will not print