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