3.4 KiB
3.4 KiB
AWS S3 配置指南
1. 创建 S3 Bucket
- 登录 AWS 控制台
- 进入 S3 服务
- 点击"创建存储桶"
- 输入存储桶名称(如:
my-audio-recordings) - 选择区域(建议选择离用户最近的区域)
- 保持默认设置,点击"创建存储桶"
2. 配置 Bucket 权限(重要!)
必须配置公开读取权限
当前问题:浏览器无法直接访问 S3 文件,需要配置公开读取权限
-
进入你的 S3 Bucket
-
点击"权限"标签
-
取消勾选"阻止公有访问":
- 取消勾选"阻止公有访问"
- 点击"保存更改"
- 在确认对话框中输入 "confirm"
-
添加存储桶策略:
- 在"存储桶策略"部分点击"编辑"
- 添加以下策略:
{
"Version": "2012-10-17",
"Statement": [
{
"Sid": "PublicReadGetObject",
"Effect": "Allow",
"Principal": "*",
"Action": "s3:GetObject",
"Resource": "arn:aws:s3:::your-bucket-name/*"
}
]
}
注意:
- 将
your-bucket-name替换为你的实际 Bucket 名称 - 这个策略允许任何人读取 Bucket 中的文件
- 如果需要更严格的权限控制,可以考虑使用 CloudFront CDN
3. 配置 CORS(重要!)
必须配置 CORS 才能解决上传问题:
- 进入你的 S3 Bucket
- 点击"权限"标签
- 找到"CORS"部分,点击"编辑"
- 添加以下 CORS 配置:
[
{
"AllowedHeaders": ["*"],
"AllowedMethods": ["GET", "PUT", "POST", "DELETE", "HEAD"],
"AllowedOrigins": ["http://localhost:3000", "https://your-domain.com"],
"ExposeHeaders": ["ETag"],
"MaxAgeSeconds": 3000
}
]
注意:
- 将
your-domain.com替换为你的实际域名 - 开发环境保留
http://localhost:3000 - 生产环境添加你的实际域名
4. 创建 IAM 用户
- 进入 IAM 服务
- 点击"用户" → "创建用户"
- 输入用户名(如:
audio-recorder-app) - 选择"程序化访问"
- 点击"下一步:权限"
- 选择"直接附加策略"
- 搜索并选择
AmazonS3FullAccess(或创建自定义策略) - 完成创建
5. 获取访问密钥
- 点击创建的用户
- 点击"安全凭据"标签
- 点击"创建访问密钥"
- 选择"应用程序运行在 AWS 外部"
- 下载 CSV 文件或复制 Access Key ID 和 Secret Access Key
6. 配置环境变量
复制 env.example 为 .env.local,并填入你的配置:
# AWS S3 Configuration
AWS_ACCESS_KEY_ID="your-access-key-id"
AWS_SECRET_ACCESS_KEY="your-secret-access-key"
AWS_REGION="us-east-1" # 替换为你的区域
AWS_S3_BUCKET="your-bucket-name"
7. 自定义 IAM 策略(可选)
为了安全,建议创建自定义策略,只允许特定操作:
{
"Version": "2012-10-17",
"Statement": [
{
"Effect": "Allow",
"Action": ["s3:PutObject", "s3:GetObject", "s3:DeleteObject"],
"Resource": "arn:aws:s3:::your-bucket-name/recordings/*"
}
]
}
8. 测试配置
- 启动开发服务器:
npm run dev - 尝试录制并上传音频
- 检查 S3 Bucket 中是否出现文件
- 验证音频播放功能
注意事项
- 确保 S3 Bucket 名称全局唯一
- 重要:必须配置公开读取权限才能播放音频
- 重要:必须配置 CORS 才能解决上传问题
- 定期轮换访问密钥
- 监控 S3 使用量和费用
- 考虑设置生命周期策略自动清理旧文件
- 生产环境建议使用 CDN 加速音频播放