antd AWS S3 upload

要使用 Ant Design (antd) 的 Upload 组件上传文件至 Amazon Web Services (AWS) S3 存储桶，您可以按照以下步骤操作：

### 步骤 1: 安装必要的依赖

确保您的项目已经安装了 `react` 和 `antd` 库。接着，您还需要安装 `aws-sdk` 用于与 S3 进行交互。

npm install aws-sdk

### 步骤 2: 引入依赖库

在您的 React 组件中引入所需的库和组件：

import React from 'react';
import { Upload } from 'antd';
import * as AWS from 'aws-sdk';

// 初始化 AWS SDK
const s3 = new AWS.S3({
    accessKeyId: '<your-access-key-id>',
    secretAccessKey: '<your-secret-access-key>',
    region: '<your-region>'
});

### 步骤 3: 创建 Upload 组件并配置自定义请求

使用 `antd` 的 `Upload` 组件并设置 `customRequest` 属性以实现自定义上传逻辑：

function handleFileChange(info) {
    if (info.file.status === 'uploading') {
        console.log(info.file, info.fileList);
    }
    else if (info.file.status === 'done') {
        // 成功上传后，打印结果信息
        console.log('Success!', info.file.response);
    }
    else if (info.file.status === 'error') {
        // 处理上传错误时的响应
        console.error('Failed!', info.file.error);
    }
}

const CustomUpload = () => (
    <Upload
        action="https://path-to-your-bucket.s3.amazonaws.com"
        customRequest={{
            headers: {
                'Content-Type': 'multipart/form-data',
            },
            body: formData,
            method: 'POST',
            credentials: 'include',
            onProgress: (event) => {
                const percentCompleted = Math.round((event.loaded * 100) / event.total);
                console.log(`${percentCompleted}% completed`);
            },
            onSuccess: (response) => {
                console.log('File uploaded successfully:', response);
            },
            onError: (error) => {
                console.error('Error uploading file:', error);
            },
        }}
    >
        <div>
            <p>Click to Upload</p>
            <p className="ant-upload-text">Drag and Drop or Select Files</p>
        </div>
    </Upload>
);

export default CustomUpload;

在这个示例中，我们设置了 `customRequest` 方法来控制上传过程，包括进度更新、成功和失败情况下的回调。

### 相关问题:

1. 如何优化 AWS S3 上的上传性能？
2. 如何处理上传过程中断网的情况？
3. 怎样通过 AWS IAM 权限控制上传文件的访问权限？