快速入门

开发准备

SDK 获取

对象存储服务的 XML JS SDK 资源下载地址：XML JS SDK。 演示示例 Demo 下载地址：XML JS SDK Demo。

开发准备

1. 首先，JS SDk 需要浏览器支持基本的 HTML5 特性，以便支持 ajax 上传文件和计算文件 md5 值。

2. 到 COS 对象存储控制台创建存储桶，得到 Bucket（存储桶名称） 和 Region（地域名称）。

3. 到云API密钥获取您的项目 SecretId 和 SecretKey。

4. 配置 CORS 规则，配置例子如下图：

   

   关于文章中出现的 SecretId、SecretKey、Bucket 等名称的含义和获取方式请参考：COS 术语信息

快速入门

计算签名

由于签名计算放在前端会暴露 SecretId 和 SecretKey，我们把签名计算过程放在后端实现，前段通过 ajax 向后端获取签名结果，正式部署时请再后端加一层自己网站本身的权限检验。

这里提供 PHP 和 NodeJS 的签名例子，其他语言，请参照对应的 XML SDK

上传例子

1. 创建 test.html，填入下面的代码，修改里面的 Bucket 和 Region。

2. 部署好后端的签名服务，并修改 getAuthorization 里的签名服务地址。

3. 把 test.html 放在 Web 服务器下，然后在浏览器访问页面，测试文件上传。

<input id="file-selector" type="file">
<script src="dist/cos-js-sdk-v5.min.js"></script>
<script>
var bucket = 'BUCKET';        // 替换成用户的 Bucket
var region = 'REGION';        // 替换成用户的 Region
var domain = 'DOMAIN.COM';    // 替换成用户的 Domain

var endpoint = 'cos.' + region + '.' + domain;

// 初始化实例
var cos = new COS({
    getAuthorization: function (options, callback) {
        // 异步获取签名
        $.get('../server/auth.php', {
            method: (options.Method || 'get').toLowerCase(),
            pathname: '/' + (options.Key || '')
        }, function (authorization) {
            callback(authorization);
        }, 'text');
    },
    ServiceDomain: endpoint,
    Domain: '{Bucket}.' + endpoint // 传入模板字符串
});

// 监听选文件
document.getElementById('file-selector').onchange = function () {

    var file = this.files[0];
    if (!file) return;

    // 分片上传文件
    cos.sliceUploadFile({
        Bucket: bucket,
        Region: region,
        Key: file.name,
        Body: file,
    }, function (err, data) {
        console.log(err, data);
    });

};
</script>

webpack 引入方式

支持 webpack 打包的场景，可以用 npm 引入作为模块。

npm i cos-js-sdk-v5 --save

其他文档和例子

1. 更多例子请参阅 XML JavaScript SDK Demo。

2. 完整接口文档请参阅 XML JavaScript SDK 接口文档。