开源项目教程：Serverless 静态网站与基本认证

1. 项目的目录结构及介绍

serverless_static_website_with_basic_auth/
├── src/
│   ├── index.html
│   ├── style.css
│   └── script.js
├── .editorconfig
├── .eslintrc.js
├── .gitignore
├── .travis.yml
├── README.md
├── handler.js
├── package.json
└── serverless.yml

• src/：包含静态网站的所有源文件，如 index.html、style.css 和 script.js。
• .editorconfig：编辑器配置文件，用于统一代码风格。
• .eslintrc.js：ESLint 配置文件，用于代码检查。
• .gitignore：Git 忽略文件配置。
• .travis.yml：Travis CI 配置文件，用于持续集成。
• README.md：项目说明文档。
• handler.js：Lambda 函数处理文件，用于基本认证。
• package.json：Node.js 项目配置文件，包含依赖和脚本。
• serverless.yml：Serverless 框架配置文件，定义服务和资源。

2. 项目的启动文件介绍

handler.js

handler.js 是项目的启动文件，主要负责处理基本认证逻辑。以下是文件的主要内容：

module.exports.basicAuth = (event, context, callback) => {
  const authorizationHeader = event.headers.Authorization;

  if (!authorizationHeader) {
    return callback(null, {
      statusCode: 401,
      headers: {
        'WWW-Authenticate': 'Basic realm="Secure Area"',
      },
      body: 'Unauthorized',
    });
  }

  const encodedCredentials = authorizationHeader.split(' ')[1];
  const decodedCredentials = Buffer.from(encodedCredentials, 'base64').toString('ascii');
  const [username, password] = decodedCredentials.split(':');

  if (username === 'demo' && password === 'letmein') {
    return callback(null, {
      statusCode: 200,
      body: 'Authorized',
    });
  } else {
    return callback(null, {
      statusCode: 401,
      headers: {
        'WWW-Authenticate': 'Basic realm="Secure Area"',
      },
      body: 'Unauthorized',
    });
  }
};

该文件定义了一个 basicAuth 函数，用于检查请求头中的 Authorization 字段，并验证用户名和密码。

3. 项目的配置文件介绍

serverless.yml

serverless.yml 是 Serverless 框架的主要配置文件，定义了服务的所有资源和行为。以下是文件的主要内容：

service: serverless-static-website-with-basic-auth

provider:
  name: aws
  runtime: nodejs12.x
  region: us-east-1

functions:
  basicAuth:
    handler: handler.basicAuth
    events:
      - http:
          path: /{proxy+}
          method: any
          cors: true

resources:
  Resources:
    StaticSiteBucket:
      Type: AWS::S3::Bucket
      Properties:
        BucketName: ${self:custom.websiteBucketName}
        AccessControl: PublicRead
        WebsiteConfiguration:
          IndexDocument: index.html
          ErrorDocument: error.html

custom:
  websiteBucketName: sls-static-basic

plugins:
  - serverless-plugin-cloudfront-lambda-edge
  - serverless-s3-sync

• service：定义服务的名称。
• provider：定义云服务提供商和运行时环境。
• functions：定义 Lambda 函数及其触发事件。
• resources：定义 AWS 资源，如 S3 存储桶。
• custom：定义自定义变量，如存储桶名称。
• plugins：定义使用的插件。

package.json

package.json 是 Node.js 项目的配置文件，包含项目依赖和脚本。以下是文件的主要内容：

{