Flutter web通过Cloud Build、Cloud Run实现CI/CD

最近在用flutter web做网页开发，代码托管在Github上通过Cloud Build、Cloud Run实现CI/CD。记录下为了以后复盘。

主要实现功能

Cloud Build关联Github代码仓库，监听仓库动作触发CI/CD。

备注：这里不记录Load Balance及DNS相关操作及GCP上的相关配置，可以参阅官方文档完成。

cloudbuild.yaml文件:

steps:
  - name: gcr.io/cloud-builders/docker
    args:
      - build
      - '--no-cache'
      - '-t'
      - >-
        $_AR_HOSTNAME/$PROJECT_ID/cloud-run-source-deploy/$REPO_NAME/$_SERVICE_NAME:$COMMIT_SHA
      - .
      - '-f'
      - Dockerfile
    id: Build
  - name: gcr.io/cloud-builders/docker
    args:
      - push
      - >-
        $_AR_HOSTNAME/$PROJECT_ID/cloud-run-source-deploy/$REPO_NAME/$_SERVICE_NAME:$COMMIT_SHA
    id: Push
  - name: 'gcr.io/google.com/cloudsdktool/cloud-sdk'
    args:
      - run
      - services
      - update
      - $_SERVICE_NAME
      - '--platform=managed'
      - >-
        --image=$_AR_HOSTNAME/$PROJECT_ID/cloud-run-source-deploy/$REPO_NAME/$_SERVICE_NAME:$COMMIT_SHA
      - >-
        --labels=managed-by=gcp-cloud-build-deploy-cloud-run,commit-sha=$COMMIT_SHA,gcb-build-id=$BUILD_ID,gcb-trigger-id=$_TRIGGER_ID
      - '--region=$_DEPLOY_REGION'
      - '--quiet'
    id: Deploy
    entrypoint: gcloud
images:
  - >-
    $_AR_HOSTNAME/$PROJECT_ID/cloud-run-source-deploy/$REPO_NAME/$_SERVICE_NAME:$COMMIT_SHA
options:
  substitutionOption: ALLOW_LOOSE
  logging: CLOUD_LOGGING_ONLY
substitutions:
  _SERVICE_NAME: test-flutter-web-dev
  REPO_NAME: testflutterwebgithubactions
  _DEPLOY_REGION: us-central1
  _AR_HOSTNAME: us-central1-docker.pkg.dev
  _PLATFORM: managed
  _TRIGGER_ID: 99c735fb-f560-46b8-8ec7-f3ccc0327f63
tags:
  - gcp-cloud-build-deploy-cloud-run
  - gcp-cloud-build-deploy-cloud-run-managed
  - test-flutter-web-dev 

Dockerfile

# 使用 Flutter 镜像
FROM cirrusci/flutter AS builder

# 设置工作目录
WORKDIR /app

# 复制 Flutter 应用程序源代码
COPY . /app

# 获取依赖并构建应用程序
RUN flutter pub get && \
    flutter build web --dart-define=MODE=debug --base-href="/" --web-renderer html

# 创建生产用映像
FROM nginx
COPY --from=builder /app/build/web/ /usr/share/nginx/html/
# 用本地的 nginx.conf 配置来替换nginx镜像里的默认配置
COPY nginx.conf /etc/nginx/nginx.conf

注意：Dockerfile文件，我是用自己的nginx.conf文件替换了镜像nginx里的默认配置，端口设置8080