<p>以下の記事でGoogle App EngineにTwitter Botをデプロイしましたが、GAEの制約（HTTPリクエストが10分間来なかったらインスタンスがシャットダウンされる）を知らなかったため、24時間常に起動していてほしいBotのデプロイ先としては適していないことがわかりました。<br><a href="https://dev.eringiv3.com/blog/post/github_actions_google_app_engine_ci_cd" target="_blank" rel="noopener noreferrer">GitHub Actions と Google App Engine でCI/CD</a><br><br>今回は、そのリベンジとしてGCEにデプロイして、問題なく動かすことができました。<br>CI/CDの自動化まで行ったので、手順を記録します。<br></p><h2 id="ha88dc2a453">ゴール</h2><ul><li>GCEにコンテナ化したアプリケーションをデプロイして動かすことができる</li><li>デプロイを自動化する</li></ul><p><br></p><h2 id="h6cce74c095">アプリケーションのDocker化</h2><p>以下の記事に別途まとめました。<br><a href="https://dev.eringiv3.com/blog/post/run_typescript_app_on_docker_container" target="_blank" rel="noopener noreferrer">TypeScriptで作ったアプリケーションをコンテナで実行する</a><br></p><h2 id="h4ee84e6ac6">まずは手動でGCEにコンテナをデプロイしてみる</h2><h3 id="he0a3ad0c4f">GCP Container Registory にイメージをpushする</h3><p>ローカル環境でビルドしたDockerイメージをContainer Registoryにpushします。<br>次のステップで、GCEのインスタンスをたてるときにイメージを指定するためです。<br><br>ローカルのイメージにレジストリ名をタグ付けします。ホストはasia, イメージ名にはappを指定しました。</p><pre><code>docker tag [IMAGE_NAME] asia.gcr.io/[PROJECT-ID]/app</code></pre><p><br>タグ付けされたイメージをContainer Registoryにpushします。</p><pre><code>docker push HOSTNAME/PROJECT-ID/IMAGE</code></pre><p><br></p><h3 id="h33b5353ef5">GCEインスタンスにコンテナをデプロイする</h3><p>Google Cloud Consoleから、Compute Engineの管理画面に行き、「インスタンスを作成」→「コンテナイメージをデプロイ」を選択します。<br>コンテナイメージには、先程pushしたイメージを指定します。<br>また、環境変数もここで設定可能です。<br>マシンタイプには「f1-micro」を指定しました。f1-microには無料枠があるので、1台までなら無料で使用できるようです。<br>ここまでできたら、「作成」をクリックでインスタンスが作成されます。<br>ちなみに、「コンテナイメージをデプロイ」を選択すると、Compute EngineのOSには、Docker コンテナの実行に最適化されたContainer-Optimized OSというOSが自動で選択されます。<br><br>以上で、手動で単一のコンテナをGCEにデプロイすることができました。<br></p><h2 id="h2007d5f3b4">デプロイを自動化する</h2><p>GitHub Actions を使って、masterブランチへのpush毎に、イメージのビルド・push、GCEのコンテナの更新を行うようにします。<br>buildのジョブでイメージのビルド・pushを行います。<br>deployのジョブでコンテナの更新を行います。<br><code>gcloud compute instances update-container</code> コマンドで、インスタンスの停止→再起動と、起動時に新しいイメージをダウンロードしてコンテナの起動まで行ってくれます。</p><pre><code>name: CI/CD

on:
  push:
    branches: [master]

env:
  IMAGE: asia.gcr.io/dev-article-twitter-bot/app:${{ github.sha }}

jobs:
  test:
    runs-on: ubuntu-latest
    strategy:
      matrix:
        os: [ubuntu-latest]
        node-version: [14.x]
    steps:
      - name: checkout the repository
        uses: actions/checkout@v2

      - name: Use Node.js ${{ matrix.node-version }}
        uses: actions/setup-node@v1
        with:
          node-version: ${{ matrix.node-version }}

      - name: yarn install, and test
        run: |
          yarn
          yarn test
        env:
          CI: true

  build:
    runs-on: ubuntu-latest
    steps:
      - name: checkout the repository
        uses: actions/checkout@v2

      - name: set up Cloud SDK
        uses: google-github-actions/setup-gcloud@master
        with:
          project_id: ${{ secrets.GCP_PROJECT_ID }}
          service_account_key: ${{ secrets.GCP_SA_KEY }}
          export_default_credentials: true

      - name: configure docker to use the gcloud cli
        run: gcloud auth configure-docker --quiet

      - name: build a docker image
        run: docker build . -t $IMAGE

      - name: push the docker image
        run: docker push $IMAGE

  deploy:
    needs: [test, build]
    runs-on: ubuntu-latest
    steps:
      - name: set up Cloud SDK
        uses: google-github-actions/setup-gcloud@master
        with:
          project_id: ${{ secrets.GCP_PROJECT_ID }}
          service_account_key: ${{ secrets.GCP_SA_KEY }}
          export_default_credentials: true

      - name: set project
        run: gcloud config set project $GCP_PROJECT_ID
        env:
          GCP_PROJECT_ID: ${{ secrets.GCP_PROJECT_ID }}

      - name: deploy to GCE
        run: gcloud compute instances update-container $GCP_PROJECT_ID --container-image $IMAGE --zone=us-west1-b
        env:
          GCP_PROJECT_ID: ${{ secrets.GCP_PROJECT_ID }}</code></pre><p><br>以上でデプロイの自動化までできました！<br></p><h2 id="h57d3da36fb">できあがったもの</h2><p>dev.toの公開記事取得APIを使用して、リプライで受け取った単語を検索キーワードとし、ヒットした記事のタイトルとリンクをリアルタイムにリプライするTwitter Botです。<br>よかったら使ってみてください。<br><a href="https://twitter.com/dev_reply_bot" target="_blank" rel="noopener noreferrer">https://twitter.com/dev_reply_bot</a><br><img src="https://images.microcms-assets.io/assets/702dbaa8dfa34d1195fd2644792b2156/04671489f65e6484665e9d1e5f2e7494/dfdba771d07b08bb507b54a4e5ae8855.png" alt=""><br></p><h2 id="h88876ec3b5">リポジトリ</h2><p><a href="https://github.com/EringiV3/dev-article-reply-twitter-bot" target="_blank" rel="noopener noreferrer">https://github.com/EringiV3/dev-article-reply-twitter-bot</a><br></p><h2 id="h8d78e14043">感想</h2><p>gcloudコマンドがとても便利で、デプロイの自動化も特に詰まることなくできました。<br>コマンド一つでGCEインスタンス上のコンテナ更新できるの凄いです。<br>ただ、GCEにデプロイできるコンテナは1つまでらしいので、複数のコンテナをデプロイする必要がある場合はGoogle Kubernetes Engineを使用してくださいと公式のドキュメントに書いてありました。<br>GCPのドキュメントは丁寧かつ知識のない人でも読みやすいようにできていて、これからもGCPを積極的に使いたいという気持ちになります。<br>GAE, GCEにデプロイするワークフローの作成を体験できたので、次なにかデプロイするときはCloud Runを使ってみたいです。<br>常時起動しておく必要があるアプリケーションの場合は、GAEは向かず、GCEのほうが適していることはわかりましたが、HTTPリクエストのたびに起動すればよいアプリケーションの場合、GAEとCloud Runどちらが適しているか、手を動かして理解したくなりました。<br></p><h2 id="h3de35099b3">参考</h2><p><a href="https://cloud.google.com/compute/docs/containers/deploying-containers?hl=ja#console" target="_blank" rel="noopener noreferrer">VM と MIG へのコンテナのデプロイ</a><br><a href="https://cloud.google.com/container-registry/docs/pushing-and-pulling?hl=ja" target="_blank" rel="noopener noreferrer">イメージの push と pull</a></p>

Twitter BotをGoogle Compute Engineにコンテナとしてデプロイするまで

<p>最近GitHub Actionsを触り始めました。<br>リポジトリで発生したイベントをトリガーに処理したり、JavaScriptでActionを作ってパッケージにして公開できたり、かなり遊べそうな感じなのですが、まずはベーシックな使い方としてCI/CDパイプラインを構築してみたので記録します。<br></p><h2 id="h051675172a">アプリケーション</h2><p>TypeScript(Node.js)で作ったTwitter botのアプリケーションを対象とします。<br></p><h2 id="h0d376e5d4e">構成</h2><p><img src="https://images.microcms-assets.io/assets/702dbaa8dfa34d1195fd2644792b2156/6f800aed52b87e3f6939f78b23188c2e/%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88%202021-01-17%2020.21.18.png" alt=""><br></p><pre><code>name: Node.js CI


on:
  push:
    branches: [master]


jobs:
  test:
    runs-on: ubuntu-latest
    strategy:
      matrix:
        os: [ubuntu-latest]
        node-version: [12.x]
    steps:
      - uses: actions/checkout@v2


      - name: Use Node.js ${{ matrix.node-version }}
        uses: actions/setup-node@v1
        with:
          node-version: ${{ matrix.node-version }}


      - name: yarn install, and test
        run: |
          yarn
          yarn test
        env:
          CI: true
  build:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2


      - name: yarn install and build
        run: |
          yarn
          yarn build


      - name: upload dist
        uses: actions/upload-artifact@main
        with:
          name: dist
          path: dist
  deploy:
    needs: [test, build]
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2


      - name: douwnload dist
        uses: actions/download-artifact@main
        with:
          name: dist
          path: dist


      - name: Set up Cloud SDK
        uses: google-github-actions/setup-gcloud@master
        with:
          project_id: ${{ secrets.GCP_PROJECT_ID }}
          service_account_key: ${{ secrets.GCP_SA_KEY }}
          export_default_credentials: true


      - name: Setup Node.js
        uses: actions/setup-node@v1
        with:
          node-version: "12.x"


      - name: Load Env Variables
        run: node ./ci/load-env-variables.js
        env:
          APP_TWITTER_COSUMER_KEY: ${{ secrets.APP_TWITTER_COSUMER_KEY}}
          APP_TWITTER_COSUMER_SECRET: ${{ secrets.APP_TWITTER_COSUMER_SECRET}}
          APP_TWITTER_TOKEN_KEY: ${{ secrets.APP_TWITTER_TOKEN_KEY}}
          APP_TWITTER_TOKEN_SECRET: ${{ secrets.APP_TWITTER_TOKEN_SECRET}}
          APP_TWITTER_BOT_ACCOUNT_ID: ${{ secrets.APP_TWITTER_BOT_ACCOUNT_ID}}


      - name: Deploy App to GAE
        run: |
          gcloud app deploy
          rm -f app.yaml</code></pre><p><br></p><ul><li>masterブランチへのpushをトリガーにワークフローが起動します。</li><li>test, build, deployというJobによって構成されます。</li><li>test, buildは並列で実行されます。deployはtest, buildの完了をもって実行が開始されます。</li></ul><p><br></p><h3 id="h77ebeed133">test</h3><p>jestを実行します。今回はユニットテストしか行っていませんが、静的解析ツールによるチェックなどを入れてもいいでしょう。<br>strategy.matrixに、テストを実行する環境の組み合わせ（OS, 言語のバージョン）を指定することで複数の環境でのテストを実行可能です。<br>今回はUbuntu, Node.12.xで指定しました。<br></p><h3 id="he48418e812">build</h3><p>yarn build（中身はtscでのコンパイル）で、コンパイル済みの成果物（distディレクトリ）を出力します。<br>distディレクトリはdeployステップで必要なので、artifactとしてアップロードしておきます。<br>生成されたdistはJob間で共有することができないためです。<br>アップロードされたartifactは、ワークフローの詳細画面からダウンロードすることもできるようです。<br></p><h3 id="h2cea75c696">deploy</h3><p><code>needs</code>に、test, buildを指定しているため、test, buildのJobが完了してから実行されます。<br>buildでアップロードされたartifact(distディレクトリ)をダウンロードします。<br>次に、GCPのCloud SDKの初期化を行います。<br>初期化処理は、それ用のアクションが提供されているので使いましょう。<br><a href="https://github.com/google-github-actions/setup-gcloud" target="_blank" rel="noopener noreferrer">https://github.com/google-github-actions/setup-gcloud</a><br><code>GCP_SA_KEY</code>には、GCP管理画面から取得できる秘匿情報のjsonをbase64でエンコードした文字列を指定します。<br>secretsはリポジトリのsettingsから設定可能です。<br>その後、secretsに設定された環境変数を<code>app.yaml</code>に埋め込みます。<br>最終的に<code>gcloud app deploy</code>するときに参照される<code>app.yaml</code>にアプリケーションで使用する環境変数を指定する必要があるのですが、APIキーなどはGitの管理下に置くことができません。<br>そのため、環境変数の値の部分だけを置換用の文字列で設定した<code>app.template.yaml</code>を用意しておき、デプロイ直前に置換用の文字列をsecretsで取得した値で置き換えることで、バージョン管理に晒すことなくアプリケーションに環境変数を注入します。<br>このやり方は以下のブログで紹介されており、参考にさせていただきました。<br><a href="https://www.anoriqq.com/mask-env-from-github-actions-and-deploy-to-gae" target="_blank" rel="noopener noreferrer">GitHub Actionsから環境変数をマスクしてGAEにデプロイする</a><br>最後は、<code>gcloud app deploy</code>で完了です。<br><br>デプロイが完了すると、GCP管理画面から新しいバージョンが追加されていることが確認できます。<br><img src="https://images.microcms-assets.io/assets/702dbaa8dfa34d1195fd2644792b2156/c9a2e2d12e6549b5c1db74aaa1645da8/%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88%202021-01-17%2021.04.00.png" alt=""><br></p><h2 id="h28e1663de4">作成したワークフロー</h2><p><a href="https://github.com/EringiV3/dev-article-reply-twitter-bot/blob/master/.github/workflows/node.js.yml" target="_blank" rel="noopener noreferrer">https://github.com/EringiV3/dev-article-reply-twitter-bot/blob/master/.github/workflows/node.js.yml</a><br></p><h2 id="h61defdffe2">感想とワークフローがお蔵入りした理由</h2><p>肝心のアプリケーションが仕様的にGAEとマッチしていなかったため、このワークフローはお蔵入りになってしまったのですが、GitHub Actionsを使ってGAEにデプロイしたくなるときがいつか来そうな気がしたので記事にしました。<br>Node.jsの実行環境としてのGAEはとてもお手軽で便利だと感じたので、手持ちの弾にしておきたいです。<br>スタンダード環境だと最初からNode.js（この記事書いた時点では12.x）が入っていて、言語のセットアップをすることなくNode.jsアプリケーションを動かすことができます。<br>しかもスタンダード環境はある程度までは無料で使える！<br>静的なサイト作成時やNext.jsを使うときは、それらに特化したプラットフォーム(NetlifyやVercel)を使ったほうが良さそうですが、素のNode.jsでなにかやりたいときはGAEかなり良さそうです。<br>ただ、GAEはデフォルトの自動スケーリング（<a href="https://cloud.google.com/appengine/docs/standard/nodejs/how-instances-are-managed?hl=ja" target="_blank" rel="noopener noreferrer">https://cloud.google.com/appengine/docs/standard/nodejs/how-instances-are-managed?hl=ja</a>）だと、HTTPリクエストが10分来ないとシャットダウンされてしまいます。<br>今回デプロイしたアプリケーションは、Twitterのタイムラインをストリーミングして特定の条件を満たすツイートが流れてきたらアクションするものだったので、アプリケーションは常に稼働状態である必要がありました。そのため、GAEの制約がある実行環境ではうまく動作しませんでした（デプロイされたサーバーにHTTPリクエストしてから10分間しか動かない）。<br>アプリケーションの仕様をよく考えず、実行環境の選定をしてしまった結果踏んでしまった間違いだと言えます。<br>セットアップの手間が増えますが、GCE(Google Compute Engine)でうまくできないか実験してみます。<br>それでもダメそうなら、おとなしくラズパイ買ってお家サーバー立てて運用しようと思います。。<br></p>

eringiv3.dev

Category: GitHub Actions

Twitter BotをGoogle Compute Engineにコンテナとしてデプロイするまで

GitHub Actions と Google App Engine でCI/CD