更新时间:2026-06-01 GMT+08:00
分享

批量上传

本示例用于批量上传文件。

// 认证用的ak和sk硬编码到代码中或者明文存储都有很大的安全风险,建议在配置文件或者环境变量中密文存放,使用时解密,确保安全;本示例以ak和sk保存在环境变量中为例,运行本示例前请先在本地环境中设置环境变量AccessKeyID和SecretAccessKey。
// 前端本身没有process对象,可以使用webpack类打包工具定义环境变量,就可以在代码中运行了。
// 您可以登录访问管理控制台获取访问密钥AK/SK,获取方式请参见https://support.huaweicloud.com/usermanual-ca/ca_01_0003.html
const AK = process.env.AccessKeyID
const SK = process.env.SecretAccessKey
// 【可选】如果使用临时AKSK和SecurityToken访问OBS,则同样推荐通过环境变量获取
const security_token= process.env.SecurityToken
//  server填写Bucket对应的Endpoint, 这里以华北-北京四为例,其他地区请按实际情况填写。
const server = "https://obs.cn-north-4.myhuaweicloud.com"
// 创建ObsClient实例
var obsClient = new ObsClient({
    access_key_id: AK,
    secret_access_key: SK,
    server: server
});

// 桶名
var bucket = 'examplebucket';
// 上传后的对象前缀
var objectPrefix = 'upload/';
async function putObjects() {
    var fileInput = document.getElementById('folder');
    var files = fileInput.files;
    if (!files || files.length === 0) {
        console.log('请选择要上传的文件夹');
        return;
    }
    console.log('开始批量上传,共 ' + files.length + ' 个文件...');
    for (var i = 0; i < files.length; i++) {
        var file = files[i];
        // 保持文件夹结构,使用 relativePath 或 webkitRelativePath
        var relativePath = file.webkitRelativePath || file.relativePath || file.name;
        var key = objectPrefix + relativePath;
        try {
            var params = {
                Bucket: bucket,
                Key: key,
                SourceFile: file
            };
            var result = await obsClient.putObject(params);
            if (result.CommonMsg.Status <= 300) {
                console.log('[' + (i + 1) + '/' + files.length + '] 成功: ' + relativePath);
            } else {
                console.log('[' + (i + 1) + '/' + files.length + '] 失败: ' + relativePath + ' - ' + result.CommonMsg.Message);
            }
        } catch (error) {
            console.log('[' + (i + 1) + '/' + files.length + '] 异常: ' + relativePath + ' - ' + error);
        }
    }
    console.log('批量上传完成!');
}
putObjects()
  • 使用SourceFile参数指定待上传的文件,其必须是File对象或者Blob对象,例如在HTML页面中使用类型为“file”的input标签指定待上传的文件:<input type="file" id="input-file"/>。
  • SourceFile参数Body参数不能同时使用。
  • 上传的内容大小不能超过5GB。

相关文档