使用AWS Lambda上传HTML至S3静态网站无法直接访问问题

问题场景：
我有一个S3静态网站存储桶，地址是http://www.sentencex.com.s3-website-us-east-1.amazonaws.com/，根页面index.html正常显示。通过AWS控制台上传本地编写的hello world from local.html，浏览器能直接打开页面；但用Lambda代码上传hello world from lambda.html后，访问对应URL时浏览器会强制下载文件，无法直接渲染内容。

错误原因：
你在Lambda代码里把Content-Type放在了Metadata对象中，这是错误用法。S3的putObject API里，Content-Type是顶级参数，不属于自定义元数据范畴。把它放在Metadata里只会让S3将其当作普通自定义元数据存储，不会设置文件的HTTP响应头，浏览器无法识别这是HTML文件，因此触发下载行为。

修正后的代码：

const AWS = require('aws-sdk')
const s3 = new AWS.S3()

exports.handler = async (event) => {
    let html = `
        <!DOCTYPE html>
        <html lang="en">
        <head>
          <meta charset="UTF-8">
          <meta http-equiv="X-UA-Compatible" content="IE=edge">
          <meta name="viewport" content="width=device-width, initial-scale=1.0">
          <title>Document</title>
        </head>
        <body>
          <h1 class="sayHello">Hello</h1>
          <script src="./app.js" type="module"></script>
        </body>
        </html>
    `
    let putHtmlParam = {
        Body: html,
        ContentType: 'text/html', // 作为顶级参数，注意驼峰命名格式
        Bucket: 'www.sentencex.com',
        Key: 'hello world from lambda.html',
    }
    let putHtmlResult = await s3.putObject(putHtmlParam).promise()
    return putHtmlResult
};

关键说明：

• AWS SDK for JavaScript中，putObject的对应参数是ContentType（驼峰命名），不是Content-Type
• 控制台上传时AWS会自动检测文件类型并设置正确的Content-Type，但Lambda上传必须显式指定这个参数，确保S3返回正确的响应头，让浏览器识别并渲染HTML内容

内容的提问来源于stack exchange，提问作者田伯清