AWS s3文档
// 引入AWS SDK for JavaScript
import S3 from 'aws-sdk/clients/s3'
//初始化S3
const AWS_CONFIG = {
Bucket: '',桶名
key: {
accessKeyId: 'xxxx',
secretAccessKey: 'xxxx',
region: 'us-west-1',
},
}
const s3 = new S3(AWS_CONFIG.key)
//S3上传分为普通文件上传跟分片上传,调用不同API
//普通上传:
const params = {
Bucket: '桶域名',//发起 PUT 操作的存储桶名称
Key: '',//上传至存储桶路径
endpoint: 'xxxx', //s3.语言地区(region).amazonaws.com
'access-key-id': 'xxxx', //密钥
'access-key-secret': 'xxxx',
region: 'us-west-1',//语言地区
Body: file, //文件本身
'Access-Control-Allow-Credentials': '*',//跨域配置
ACL: 'public-read',//读写权限
ContentType: '', // 文件类型 video/MP4 image/jpeg等
}
// 上传S3
s3.upload(params, (data) => {
console.log(data)
}).on('httpUploadProgress', function (e) {
// 进度条
let plan = (parseInt(String(e.loaded), 10) / parseInt(String(e.total), 10)) * 100
plan = parseInt(plan.toFixed(2))
if (plan == 100) {
upLoadItem.state = '' //upLoadItem是列表内容数据,用于展示当前上传文件信息
return
}
upLoadItem.state = ''
upLoadItem.progress = plan
return
})
分片上传:先调用开启分片API//s3.createMultipartUpload,然后传分片小文件//s3.uploadPart,最后调用合并分片//API s3.completeMultipartUpload
const chunkSize = 5 * 1024 * 1024 //定义分片的大小 为5M 采用分片上传时,只能并且只有最后一个分片的size 小于 指定值(默认5M),不然就会报错
const chunkCount = Math.ceil(file.size / chunkSize) //分片数
let UploadId = ''//开启分片拿到UploadId 传文件时需要带上
const params = {
Bucket: '',
Key: '',
ContentType: '',
ACL: 'public-read',
}
// s3开启分片方法
s3.createMultipartUpload(params, (data) => {
UploadId = data.UploadId
let Parts = [] // 分片信息parts,合并时用
uploadPartFun(1, chunkCount, chunkSize, item, UploadId, Parts, upLoadItem)
})
const uploadPartFun = (
index,
chunkCount,
chunkSize,
item,
UploadId,
Parts,
upLoadItem,
) => {
let i = index - 1
let start = i * chunkSize
let end = Math.min(item.file.size, start + chunkSize)
let _chunkFile = item.file.slice(start, end) //分片文件
// 计算百分比
upLoadItem.progress = Math.ceil((index / chunkCount) * 100)
const params = {
Bucket: '',
Key:'',
UploadId: UploadId,
Body: _chunkFile,
PartNumber: index,
}
s3.uploadPart(params, ( data) => {
// 成功调自身下一次
let obj = {
ETag: data.ETag,
PartNumber: index,
}
Parts.push(obj)
if (index === chunkCount) {
// 最后一次
const params = {
Bucket: '',
Key: '',
UploadId: UploadId,
MultipartUpload: { Parts: Parts }, //必传,每次上传小分片返回的成功信息 tags等
}
// s3合并分片方法
s3.completeMultipartUpload(params, (data1) => {
console.log('合并成功')
upLoadItem.state = '上传成功'
upLoadItem.progress = 100
return false
})
}
uploadPartFun(++index, chunkCount, chunkSize, item, UploadId, Parts, upLoadItem)
})
}
//S3下载
s3.getObject({ Bucket: '', Key: '密钥' }, (data) => {
// 1. 创建一个 Blob 对象
const blob = new Blob([data.Body], { type: 'application/octet-stream' })
// 2. 创建一个 URL 对象
const downloadUrl = URL.createObjectURL(blob)
const eleLink = document.createElement('a')
eleLink.style.display = 'none'
eleLink.href = downloadUrl
eleLink.download = name
document.body.append(eleLink)
eleLink.click()
eleLink.remove()
})
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。