You need to enable JavaScript to run this app.
Torch Object Storage

Torch Object Storage

Copy page
Download PDF
Upload Object
Multipart Upload (Browser.js SDK)
Copy page
Download PDF
Multipart Upload (Browser.js SDK)
When uploading large objects, the data can be divided into multiple parts for separate upload. Finally, the merge parts operation is invoked to combine the uploaded parts into a single object.​
Notes​
  • To prevent exposure of your Volcengine account credentials (namely, AccessKey ID and AccessKey Secret) in browser environments, it is strongly recommended to perform TOS-related operations using temporary access credentials. For detailed instructions, please refer to Using STS Temporary AK/SK+Token to Access Volcengine TOS.​
  • The Endpoint is the access domain name for TOS's external services. For information on Endpoints supported by TOS, please refer to Access Domain Name Endpoint.​
  • Before initiating a multipart upload, you must have the tos:PutObject permission. For more information, please refer to the Permission Configuration Guide.​
  • Before canceling a multipart upload task, you must have the tos:AbortMultipartUpload permission. For more information, please refer to the Permission Configuration Guide.​
  • Except for the last fragment, the size of each fragment must be greater than or equal to 4 MiB. Part numbers can be any number from 1 to 10,000, inclusive.​
  • When uploading objects, object names must comply with specific standards. For detailed information, please refer to Object Naming Guidelines.​
  • TOS is a distributed object storage product designed for large-scale storage. Its internal partitions store object index data. To enable horizontal scaling of the maximum throughput for object uploads and downloads, and to reduce the likelihood of hotspot partitions, please avoid using lexicographically incremental object naming. For detailed information, see Performance Optimization.​
  • If an object with the same name already exists in the bucket, the new object will overwrite the existing one. If versioning is enabled for your bucket, the original object will be retained, and a new version number will be generated to identify the newly uploaded object.​
Chunked Upload Procedure​
Multipart upload consists of the following three steps:​
  1. Initialize Multipart Upload Task​
  • Invoking the createMultipartUpload method returns a globally unique UploadID generated by TOS.​
  1. Upload Fragment​
  • Invoke the uploadPart method to upload data chunks.​
tip​
  • For the same multipart upload task (identified by UploadID), the part number (PartNumber) indicates the relative position of the part within the entire object. If data is uploaded multiple times under the same shard number, TOS will overwrite the original data, and only the data from the last upload will be retained.​
  • The response header contains the MD5 value of the data, which can be obtained via the Etag. When merging parts, you must specify all part information (part number and ETag value) from the current multipart upload task.​
  1. Complete Multipart Upload​
  • After all parts have been uploaded, invoke the completeMultipartUpload method to combine all parts into a single object.​
Sample Code​
Complete Process of Multipart Upload​
The following code demonstrates the complete process of uploading a local file using a chunked method.​
​
<!DOCTYPE html>​
<html lang="en">​
<head>​
<meta charset="UTF-8" />​
<title>Document</title>​
</head>​
​
<body>​
<button id="upload">Upload</button>​
<input id="file" type="file" />​
<script src="https://tos-public.volccdn.com/obj/volc-tos-public/@volcengine/tos-sdk@latest/browser/tos.umd.production.min.js"></script>​
<script type="text/javascript">​
const client = new TOS({​
region: yourRegion,​
endpoint: yourEndpoint,​
accessKeyId: yourAccessKey,​
accessKeySecret: yourSecretKey,​
stsToken: yourSecurityToken,​
bucket: examplebucket,​
});​
​
const upload = document.getElementById('upload');​
upload.addEventListener('click', async () => {​
const file = document.getElementById('file').files[0];​
const name = 'exampledir/partUploadObject.txt';​
let uploadId = null;​
try {​
const {​
data: { UploadId },​
} = await client.createMultipartUpload({​
key: name,​
});​
uploadId = UploadId;​
​
const PART_SIZE = 8 * 1024 * 1024;​
const uploadPartRes = [];​
​
for (let i = 0; i * PART_SIZE < file.size; ++i) {​
const { data } = await client.uploadPart({​
key: name,​
partNumber: i + 1,​
body: file.slice(i * PART_SIZE, Math.min((i + 1) * PART_SIZE, file.size)),​
uploadId: UploadId,​
});​
uploadPartRes[i] = data.ETag;​
}​
​
await client.completeMultipartUpload({​
key: name,​
parts: uploadPartRes.map((eTag, idx) => ({​
eTag,​
partNumber: idx + 1,​
})),​
uploadId: UploadId,​
});​
} catch (err) {​
console.log(err);​
if (uploadId) {​
await client.abortMultipartUpload({​
key: name,​
uploadId,​
});​
}​
}​
});​
</script>​
</body>​
</html>​
​
List Uploaded Chunks​
The following code is used to enumerate information about the uploaded parts of a specified object within a specified storage bucket.​
​
// 导入 SDK​
<!DOCTYPE html>​
<html lang="en">​
<head>​
<meta charset="UTF-8" />​
<title>Document</title>​
</head>​
<body>​
<button id="upload">Upload</button>​
<input id="file" type="file" />​
<script src="https://tos-public.volccdn.com/obj/volc-tos-public/@volcengine/tos-sdk@latest/browser/tos.umd.production.min.js"></script>​
<script type="text/javascript">​
const client = new TOS({​
region: yourRegion,​
endpoint: yourEndpoint,​
accessKeyId: yourAccessKey,​
accessKeySecret: yourSecretKey,​
stsToken: yourSecurityToken,​
bucket: examplebucket,​
});​
​
const bucketName = 'browser-sdk-test-bucket';​
const objectName = 'exampledir/partUploadObject.txt';​
const uploadId = `65b597dc7eca47bcb99f01647431bd15`;​
​
const {data} = await client.listParts({​
bucket: bucketName,​
key: objectName,​
uploadId,​
});​
​
console.log('result data:', data);​
</script>​
</body>​
</html>​
​
Cancel Multipart Upload Task​
You can use the abortMultipartUpload method to cancel a multipart upload task. Once a multipart upload task is canceled, TOS will delete all previously uploaded part data, and you will no longer be able to perform any operations on this multipart upload task. The following code is used to cancel a multipart upload task.​
​
<!DOCTYPE html>​
<html lang="en">​
<head>​
<meta charset="UTF-8" />​
<title>Document</title>​
</head>​
<body>​
<button id="upload">Upload</button>​
<input id="file" type="file" />​
<script src="https://tos-public.volccdn.com/obj/volc-tos-public/@volcengine/tos-sdk@latest/browser/tos.umd.production.min.js"></script>​
<script type="text/javascript">​
const client = new TOS({​
region: yourRegion,​
endpoint: yourEndpoint,​
accessKeyId: yourAccessKey,​
accessKeySecret: yourSecretKey,​
stsToken: yourSecurityToken,​
bucket: examplebucket,​
});​
​
const bucketName = 'browser-sdk-test-bucket';​
const objectName = 'exampledir/partUploadObject.txt';​
const uploadId = `65b597dc7eca47bcb99f01647431bd15`;​
​
const {data} = await client.abortMultipartUpload({​
bucket: bucketName,​
key: objectName,​
uploadId,​
});​
​
console.log('result data:', data);​
</script>​
</body>​
</html>​
​
​
Last updated: 2025.09.22 18:55:46