AWS S3 缓存静态托管，但通过 github 工作流程更新存储桶内容

Question

我已经为我的 React 应用程序构建了一个 github 工作流程配置，该配置直接部署到 s3。我看到存储桶内容正在更新，但该存储桶上的历史静态网站没有更新。我也尝试创建 cloudfront 失效，但没有成功。谁能帮我解决这个问题吗？

这是我的 ci.yml 文件

name: App name

on:
  pull_request:
    branches:
      - main
      - development
  push:
    branches:
      - main
      - development
jobs:
  lint:
    runs-on: ubuntu-22.04
    name: Lint
    steps:
      - uses: actions/checkout@v3
      - uses: actions/setup-node@v3
        with:
          node-version: '18'
      - run: yarn
      - run: yarn lint
  test:
    runs-on: ubuntu-22.04
    needs: lint
    name: Test
    steps:
      - uses: actions/checkout@v3
      - uses: actions/setup-node@v3
        with:
          node-version: '18'
      - run: yarn
      - run: yarn test
  deploy:
    runs-on: ubuntu-22.04
    needs: test
    name: Deploy
    steps:
      - name: Checkout code
        uses: actions/checkout@v3
      - uses: actions/setup-node@v3
        with:
          node-version: '18'
      - name: Install dependencies
        run: yarn
      - name: Build the project
        run: yarn build
      - name: Cache the build directory
        uses: actions/cache@v2
        with:
          path: dist
          key: ${{ runner.os }}-build-${{ hashFiles('yarn.lock') }}
      - name: Deploy to S3
        run: | 
          echo "GITHUB_REF: $GITHUB_REF"
          if [ "$GITHUB_REF" = "refs/heads/development" ] || [ "$GITHUB_REF" = "refs/heads/main" ]; then
            echo "Deploying to S3"
            if [ "$GITHUB_REF" = "refs/heads/main" ]; then
              aws s3 sync ./dist s3://app-frontend-prod
              echo "Deployment completed"
            else
              aws s3 sync ./dist s3://app-frontend-dev
              echo "Deployment completed"
            fi 
          else
            echo "Branch not configured for deployment."
            exit 1
          fi
        shell: /usr/bin/bash -e {0}
        env:
          AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }}
          AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
          AWS_REGION: 'us-west-2'

Answer 1

所以这个问题是由于在 s3 上部署时构建文件夹被缓存所致。我通过首先使用 --recursive 标志删除所有先前的对象，然后再次上传整个构建文件夹来解决它。