JavaScript-SDK之如何实现快速开始-浏览器（二）?

其中region参数是指您申请OSS服务时的区域，例如’oss-cn-hangzhou’。完整的区域列表可以在 OSS服务节点查看。
在浏览器中打开html文件，然后打开Chrome的“开发者控制台”，就可以看到list文件的结果了。

注意：浏览器是不受信任的环境，如果把AccessKeyId和AccessKeySecret直接保存在浏览器端，存在极高的风险。建议只在测试时使用明文设置，业务应用中请使用 STS鉴权模式和自签名模式 ,详细说明请参考访问控制、移动端直传。

上传文件

下面使用multipartUpload接口来上传文件：

<body>
  <input type="file" id="file" />
  <script type="text/javascript">
    document.getElementById('file').addEventListener('change', function (e) {
      var file = e.target.files[0];
      var storeAs = 'upload-file';
      console.log(file.name + ' => ' + storeAs);
      OSS.urllib.request("http://your_sts_server/",
                      {method: 'GET'}, 
                      function (err, response) {
          if (err) {
            return alert(err);
          }
          try {
            result = JSON.parse(response);
          } catch (e) {
            return alert('parse sts response info error: ' + e.message);
          }
          var client = new OSS.Wrapper({
            accessKeyId: result.AccessKeyId,
            accessKeySecret: result.AccessKeySecret,
            stsToken: result.SecurityToken,
            endpoint: '<oss endpoint>',
            bucket: '<Your bucket name>'
          });
          client.multipartUpload(storeAs, file).then(function (result) {
            console.log(result);
          }).catch(function (err) {
            console.log(err);
          });
        });
    });
  </script>
</body>

下载文件

在浏览器中不能直接操作文件，因此采用签名URL的方式来生成文件的下载链接，用户只需要点击链接就可以下载文件。

<body>
  <input type="button" id="download" value="Download" />
  <script type="text/javascript">
    document.getElementById('download').addEventListener('click', function (e) {
      var objectKey = 'test/download_file';
      var saveAs = 'download_file';
      console.log(objectKey + ' => ' + saveAs);
      OSS.urllib.request("http://your_sts_server/",
                      {method: 'GET'}, 
                      function (err, response) {
          if (err) {
            return alert(err);
          }
          try {
            result = JSON.parse(response);
          } catch (e) {
            return alert('parse sts response info error: ' + e.message);
          }
          var client = new OSS.Wrapper({
            accessKeyId: result.AccessKeyId,
            accessKeySecret: result.AccessKeySecret,
            stsToken: result.SecurityToken,
            endpoint: '<oss endpoint>',
            bucket: '<Your bucket name>'
          });
          var result = client.signatureUrl(objectKey, {
            expires: 3600,
            response: {
              'content-disposition': 'attachment; filename="' + saveAs + '"'
            }
          });
          console.log(result);
          window.location = result;
        });
    });
  </script>
</body>