git, google 드라이브 및 공용 ci/cd 러너만 사용하는 서버리스 풀 스택 애플리케이션

TL;DR; git 및 ci/cd 러너만 사용하는 데이터베이스와 백엔드 작업자가 있는 서버리스 풀 스택 애플리케이션인 Vilicus 서비스를 구축한 방법.

Vilicus 란 무엇입니까?

컨테이너 이미지(Docker/OCI)의 보안 스캔을 오케스트레이션하고 추가 분석 및 메트릭을 위해 모든 결과를 데이터베이스로 중앙 집중화하는 오픈 소스 도구입니다.

Vilicus는 이를 사용할 수 있는 많은 대안을 제공합니다.

Own Installation ;

GitHub Action GitHub 워크플로에서;

Template CI GitLab CI/CD 파이프라인에서;

Free Online Service ;

이 문서에서는 기존 배포를 사용하지 않고 어떻게 무료 온라인 서비스를 구축할 수 있었는지 설명합니다.

건축물

프런트엔드는 GitHub 페이지에서 호스팅됩니다. 이 프런트엔드는 컨테이너 이미지의 취약점을 스캔하거나 표시하는 무료 서비스가 포함된 랜딩 페이지입니다.

컨테이너 이미지 스캔 결과는 GitLab 리포지토리에 저장됩니다.

사용자가 이미지의 결과를 보여달라고 요청하면 프런트엔드는 GitLab API를 사용하여 이 이미지에서 취약점이 있는 파일을 검색합니다. 이 이미지가 아직 스캔되지 않은 경우 사용자는 Google 양식을 사용하여 스캔을 예약할 수 있습니다.

이 양식을 채우면 데이터가 Google 스프레드시트로 전송됩니다.

GitHub 워크플로는 5분마다 실행되어 이 스프레드시트에 새로운 답변이 있는지 확인합니다. 스프레드시트의 각각의 새 이미지에 대해 이 워크플로는 다른 워크플로를 트리거하여 이미지를 스캔하고 결과를 GitLab 저장소에 저장합니다.

GitLab에 저장하는 이유는 무엇입니까?

GitLab은 더 큰 제한을 제공합니다.

다음은 퍼블릭 클라우드와 프리 티어에서 제공되는 차이점에 대한 요약입니다.



무료 사용자
최대 리포지토리 크기(GB)
최대 파일 크기(MB)
시간당 최대 API 호출(클라이언트당)


GitHub
삼
2
100
5000

비트버킷
5
1
무제한(리포지토리 크기까지)
5000

깃랩
제한 없는
10
무제한(리포지토리 크기까지)
36000

구글 드라이브

이 선택은 "빠른 승리"였습니다. 일반적인 배포에서 백엔드는 클라이언트가 비밀을 알지 못하는 상태에서 비밀을 전달하는 API를 호출할 수 있습니다.

하지만 저는 GitHub Pages를 사용하고 있기 때문에 그것을 사용할 수 없습니다.

이렇게 하면 Google 스프레드시트가 대기열로 작동합니다.

구글 양식:

답변이 포함된 Google 스프레드시트:

GitHub 워크플로

Schedule Workflow는 최대 5분마다 실행됩니다. 이 작업 흐름은 Google Spreadsheet에 새 행이 있는지 확인하는 Python 스크립트를 실행하고 각 행에 대해 이벤트repository_dispatch를 트리거하는 HTTP 요청을 만듭니다.

이렇게 하면 워크플로가 백엔드 작업자로 작동합니다.

워크플로의 일정:

name: Schedule
on:
  schedule:
    - cron:  '*/5 * * * *'
...

WorkFlow의 이벤트repository_dispatch:

name: Report
on: [repository_dispatch]
...

스크린샷:

일정 내역:

일정 워크플로우:

스캔 내역:

보고서 작업 흐름:

GitLab에 저장된 스캔 보고서:

소스 코드:

Schedule Workflow

Report Workflow

Script to upload the report file to Gitlab

Script to iterate the answers and trigger new scans

GitLab Repo with report files

GitHub Actions에 대해 더 알고 싶으신가요?

Learn GitHub Actions

Workflow syntax

Github 페이지

프런트엔드는 GitHub 페이지에서 실행 중입니다.

기본적으로 GH Pages에서 실행되는 응용 프로그램은 http://<github-user>.github.io/<repository>로 호스팅됩니다.

그러나 GitHub에서는 https://vilicus.edersonbrilhante.com.br 대신 http://edersonbrilhante.github.io/vilicus를 사용하여 Vilicus에 액세스할 수 있기 때문에 도메인을 사용자 지정할 수 있습니다.

애플리케이션을 빌드하고 GH 페이지에 배포하는 GitHub 워크플로

소스 코드 빌드:

- name: Build
  run: |
    cd website
    npm install
    npm run-script build
  env:
    REACT_APP_GA_CODE: ${{ secrets.REACT_APP_GA_CODE }}
    REACT_APP_FORM_SCAN: ${{ secrets.REACT_APP_FORM_SCAN }}

빌드 배포:

- name: Deploy
  uses: JamesIves/github-pages-deploy-action@releases/v3
  with:
    GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
    BRANCH: gh-pages
    FOLDER: website/build

소스 코드:

Workflow to deploy code in GitHub Pages

Application Source Code

Deployed code in GH Pages

GitHub 페이지에 대해 더 알고 싶습니까?

Configuring a publishing source

Configuring a custom domain

그게 다야!

질문이 있는 경우 여기에 의견을 남기거나 저에게 ping을 보내주십시오.