AWS s3 使用教程,前后端Java+html开发教程

目录

一、 AWS S3配置说明

1. S3 Bucket配置

1.1 ACL配置

1.2 存储桶策略配置

1.3 跨源资源共享配置

2. IAM配置

2.1 创建S3UploadPolicy策略

2.2 创建S3的Role

3. EC2配置

3.1 EC2添加role

二、S3 HTML+JAVA代码实现

三、AWS cloudfront 及Signed url

四、相关文档


一、 AWS S3配置说明

1. S3 Bucket配置

S3 Bucket包括ACL配置、存储桶策略配置及跨源资源配置

1.1 ACL配置

关闭 ”阻止所有公开访问”

1.2 存储桶策略配置

开放对image-upload-test-jim bucket的对象访问权限

1.3 跨源资源共享配置

允许Restful API跨源请求

2. IAM配置

IAM角色用于授权EC2实例具有基于sts服务的assumeRole方法生成S3临时凭证的权限

2.1 创建S3UploadPolicy策略

2.2 创建S3的Role

创建S3UploadRole,将S3UploadPolicy策略附加给S3UploadRole, 并建立与EC2服务的信任关系

 

3. EC2配置

3.1 EC2添加role

创建EC2实例时S3UploadRole附加到EC2实例。EC2安全组增加8888端口的入站规则

二、S3 HTML+JAVA代码实现

待完善

三、AWS cloudfront 及Signed url

待完善

四、相关文档

IAM Poilcy Generator: AWS Policy Generator

S3 JS SDK:

Class: AWS.S3.ManagedUpload — AWS SDK for JavaScript

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
AWS S3 分段上传是一种将文件分成多个部分上传到S3的方式,这样可以提高上传速度和稳定性。在Vue中,我们可以使用AWS SDK for JavaScript来实现S3分段上传。 下面是一个基本的Vue示例,演示如何使用AWS SDK for JavaScript实现S3分段上传。 首先,我们需要安装AWS SDK for JavaScript: ```bash npm install aws-sdk ``` 然后,在Vue组件中,我们可以按如下方式导入AWS SDK: ```javascript import AWS from 'aws-sdk'; ``` 接下来,我们需要初始化AWS SDK,并配置S3: ```javascript AWS.config.update({ accessKeyId: 'YOUR_ACCESS_KEY_ID', secretAccessKey: 'YOUR_SECRET_ACCESS_KEY', region: 'YOUR_REGION' }); const s3 = new AWS.S3({ apiVersion: '2006-03-01', params: { Bucket: 'YOUR_BUCKET_NAME' } }); ``` 现在,我们已经配置好了S3,接下来是分段上传的核心: ```javascript async uploadFile() { const file = this.$refs.fileInput.files[0]; const fileSize = file.size; const chunkSize = 1024 * 1024 * 5; // 5MB per chunk const chunks = Math.ceil(fileSize / chunkSize); const params = { Key: file.name, ContentType: file.type, ACL: 'public-read' }; const uploadId = await s3.createMultipartUpload(params).promise(); const promises = []; let uploadedSize = 0; for (let i = 1; i <= chunks; i++) { const start = (i - 1) * chunkSize; const end = Math.min(i * chunkSize, fileSize); const chunk = file.slice(start, end); const partParams = { Body: chunk, Key: file.name, PartNumber: i, UploadId: uploadId.UploadId }; promises.push(s3.uploadPart(partParams).promise().then(data => { uploadedSize += chunk.size; console.log(`Uploaded ${uploadedSize} bytes`); return { ETag: data.ETag, PartNumber: i }; })); } const parts = await Promise.all(promises); const completeParams = { Key: file.name, MultipartUpload: { Parts: parts }, UploadId: uploadId.UploadId }; await s3.completeMultipartUpload(completeParams).promise(); console.log('Upload complete'); } ``` 这里,我们首先计算出文件的大小和每个块的大小。然后,我们创建一个上传任务,并将文件分成多个块。对于每个块,我们将其上传到S3,并记录上传的总大小。上传完成后,我们将所有块合并为一个文件,完成上传。 最后,我们需要在Vue模板中添加一个文件输入框和一个上传按钮: ```html <template> <div> <input type="file" ref="fileInput"> <button @click="uploadFile">Upload</button> </div> </template> ``` 这就是一个基本的Vue示例,演示如何使用AWS SDK for JavaScript实现S3分段上传。当然,具体的实现方式还要根据自己的需求进行调整。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值