S3网站Endpoint无法正常打开，访问触发文件下载问题排查

核心问题 #

访问S3静态网站时触发文件下载，最主要的原因是上传的文件未设置正确的Content-Type元数据。S3默认会将未指定Content-Type的文件标记为binary/octet-stream，浏览器识别到这个类型时会直接触发下载，而非解析为网页内容。

脚本中的具体问题 #

1. 缺少Content-Type配置：你的aws_s3_object资源没有指定content_type参数，导致所有文件（包括HTML、CSS、JS等）都使用默认的二进制类型。
2. 目录结构丢失：key = basename(each.value)会把所有子目录下的文件都放到S3根目录，不仅会导致网页引用的相对路径失效，还可能出现重名文件覆盖的问题。

修复方案 #

修改aws_s3_object资源，添加Content-Type自动识别并保留原文件目录结构：

resource "aws_s3_object" "object" {
  for_each = fileset("${path.module}/travel-agency-html-template", "**/*")

  bucket      = aws_s3_bucket.My_bucket.bucket
  key         = each.value  # 保留原文件的目录结构
  source      = "${path.module}/travel-agency-html-template/${each.value}"
  etag        = filemd5("${path.module}/travel-agency-html-template/${each.value}")
  content_type = filetype("${path.module}/travel-agency-html-template/${each.value}")  # 自动识别并设置MIME类型
}

说明 #

• filetype函数会根据文件后缀自动返回对应的MIME类型，比如.html文件会被设置为text/html，.css文件设置为text/css，浏览器就能正确解析这些文件。
• 保留原目录结构后，网页中的相对路径（如./images/banner.jpg）能正确匹配S3中的文件路径，避免资源加载失败。

内容的提问来源于stack exchange，提问作者charles uneze