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>
版权声明：本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
您提到的内容涉及阿里云对象存储服务（OSS）的几个关键操作：设置区域、查看文件列表、上传文件和下载文件。下面我将基于您的描述，提供更详细的指导和建议。
1. 设置Region参数
在使用阿里云OSS时，region参数确实非常重要，它指定了您所使用的OSS服务所在的地域节点。例如，oss-cn-hangzhou代表中国杭州区域。要获取完整的区域列表，您可以直接访问阿里云官方文档中的“OSS服务节点”部分，这里会列出所有可用的区域及其对应的Endpoint。
2. 查看List文件结果
在浏览器中预览HTML文件并利用Chrome开发者控制台查看OSS文件列表的结果是一种调试方法。但请注意，实际应用中，您可能需要通过编程方式调用OSS API或使用SDK来实现文件列表的获取。例如，使用JavaScript SDK可以方便地在前端实现这一功能，同时确保AccessKey信息的安全。
3. 注意事项：安全与鉴权
-
不建议明文保存Access Key：正如您指出的，直接在浏览器端保存AccessKeyId和AccessKeySecret非常危险。在生产环境中，应该采取更安全的鉴权方式。
-
STS鉴权模式：Security Token Service (STS)允许您为应用程序临时授权访问阿里云资源，避免长期密钥泄露的风险。通过STS，您可以生成一个具有有限权限和有效期的临时凭证给客户端使用。
-
自签名模式：虽然这个表述可能不够明确，但推测您可能是指使用签名URL或者VPC内访问等安全措施来保护资源。对于公开下载场景，生成签名URL是一个好方法，它允许用户在限定时间内访问特定资源，而无需暴露长期凭证。
4. 上传文件
使用multipartUpload接口上传大文件是推荐的做法，因为它支持断点续传，提高了上传的稳定性和效率。在阿里云OSS SDK中，您可以通过初始化一个MultipartUpload请求，并按分片上传数据，最后完成上传并合并分片。
5. 下载文件
生成签名URL是让用户直接从浏览器下载文件的安全方式。在阿里云OSS中，您可以通过SDK或API生成一个带有过期时间的URL，用户点击该链接即可下载文件，而无需暴露Bucket的直接访问权限。
总之，阿里云OSS提供了丰富的功能和安全保障机制，确保数据的存储、管理和访问既高效又安全。在实际应用开发中，合理选择鉴权方式、利用SDK提供的高级功能，能够有效提升应用的安全性和用户体验。
