AWS S3 实现预签名上传

拼搏现实的明天。 2022-08-31 02:17 21阅读 0赞

步骤：

1、前端上传文件，将要上传的文件名称传到后台

2、后台通过该文件名称生成预上传URL返回前端

3、前端请求该URL，并携带文件上传至S3

后端代码

/**
         * AWS预签名上传
         * @return
         */
        @GetMapping("/upload")
        public Object generatePreSignedUrl(String fileName){
            Map<String, Object> map = new HashMap<>();
            try {
                AWSCredentials awsCredentials = new BasicAWSCredentials(AWS_ACCESS_KEY, AWS_SECRET_KEY);
                AWSCredentialsProvider awsCredentialsProvider = new AWSStaticCredentialsProvider(awsCredentials);
                AmazonS3 s3Client = AmazonS3ClientBuilder.standard()
                        .withCredentials(new ProfileCredentialsProvider())
                        .withRegion(Regions.CN_NORTH_1)
                        .withCredentials(awsCredentialsProvider)
                        .build();
                java.util.Date expiration = new java.util.Date();
                long expTimeMillis = expiration.getTime();
                expTimeMillis += 1000 * 60 * 30;
                expiration.setTime(expTimeMillis);
                String name = fileName.substring(0,fileName.lastIndexOf("."));
                String fileType = fileName.substring(fileName.lastIndexOf("."));
                String prefixFileName = name+ "_"+String.valueOf(System.currentTimeMillis()).substring(6)+""+fileType;
                Review review = new Review();
                review.setName(name);
                GeneratePresignedUrlRequest generatePresignedUrlRequest = new GeneratePresignedUrlRequest(BUCKET_NAME, prefixFileName)
                        .withMethod(HttpMethod.PUT)
                        .withExpiration(expiration);
                URL url = s3Client.generatePresignedUrl(generatePresignedUrlRequest);
                if(url == null){
                    return map;
                }
                // 文件访问地址
                StringBuilder urlImage = new StringBuilder();
                urlImage.append(url.getProtocol()).append("://").append(url.getHost()).
                        append(URLDecoder.decode(url.getPath(), "UTF-8"));
                // 预签名put地址
                StringBuilder preUrl = new StringBuilder();
                preUrl.append(url.getProtocol()).append("://").append(url.getHost()).
                            append(URLDecoder.decode(url.getFile(), "UTF-8"));
                map.put("preUrl",preUrl);
                map.put("urlImage",urlImage);
                return map;
            } catch (Exception e) {
                e.printStackTrace();
                return map;
            }
        }

前端代码

import axios from 'axios'
     
                    axios.put(preUrl, fileList[0], {
                    headers: {
                      'Content-Type': 'multipart/form-data'
                    },
                    onUploadProgress: progressEvent => {
                      let complete = (progressEvent.loaded / progressEvent.total * 100.).toFixed(2)
                      
                    }
                  })
                    .then((res: any) => {
                      if (res.status == 200) {
                        console.log(res)
                      }
                    }).catch(
                      err => {
                        console.log(err)
                      })

参考官方文档：[https://docs.aws.amazon.com/AmazonS3/latest/userguide/PresignedUrlUploadObject.html][https_docs.aws.amazon.com_AmazonS3_latest_userguide_PresignedUrlUploadObject.html]

[https_docs.aws.amazon.com_AmazonS3_latest_userguide_PresignedUrlUploadObject.html]: https://docs.aws.amazon.com/AmazonS3/latest/userguide/PresignedUrlUploadObject.html