Cloud Run上でNext.jsのアプリを動かす方法

Pilefort

Notes Works Snippets

2022年5月4日

対象読者

・ Vercel以外でNext.js (SSR) のアプリを動かしてみたい方

・ GCPのCloud Run上にコンテナアプリをデプロイしてみたい方

はじめに

Cloud RunはAWSでいうところのAWS App Runnerのようなサービスで、比較的安価にコンテナアプリを動かすためのサービスです。

本記事では、コンテナをGoogle Cloud Buildでビルドし、ビルドしたものをCloud Runにデプロイします。

Dockerfileの準備

Dockerfile側は特に特殊な設定は不要です。

実際にDockerを動かしてみて、3000ポートにアクセスできれば、準備完了です。


Dockerfile
1
FROM node:16-alpine
2

3
RUN apk add --no-cache libc6-compat
4

5
WORKDIR /app
6

7
COPY package.json yarn.lock ./
8
RUN yarn install --frozen-lockfile
9

10
COPY . .
11

12
ENV NODE_ENV production
13
RUN yarn build
14

15
EXPOSE 3000
16

17
ENV PORT 3000
18

19
CMD ["yarn", "start"]

Code Buildの準備

あらかじめGCP側でCode Buildを準備しておきます。

ここで、連携するGitHubの設定やブランチやタグをpushしたときに、Code Buildを実行するように設定できます。

構成については、「Code Build 構成ファイル (yaml または json)」を指定します。

環境変数を設定する場合は「代入変数」という箇所に「 _ 」付きで追加します。

codebuild.yamlの準備

公式を確認しながら、以下のように設定します。


codebuild.yaml
1
steps:
2
  # 環境変数の設定
3
  - name: node:16.15.0
4
    entrypoint: yarn
5
    args: [ "run", "create-env" ]
6
    env:
7
      - 'API_KEY=${_API_KEY}'
8
      - 'SERVICE_DOMAIN=${_SERVICE_DOMAIN}'
9
  # ビルド
10
  - name: 'gcr.io/cloud-builders/docker'
11
    args: ['build', '-t', 'gcr.io/$PROJECT_ID/サービス名:$COMMIT_SHA', '.']
12
  # Container Registryにデプロイ
13
  - name: 'gcr.io/cloud-builders/docker'
14
    args: ['push', 'gcr.io/$PROJECT_ID/サービス名:$COMMIT_SHA']
15
  # Cloud Runにデプロイ
16
  - name: 'gcr.io/google.com/cloudsdktool/cloud-sdk'
17
    entrypoint: gcloud
18
    args:
19
      - 'run'
20
      - 'deploy'
21
      - 'サービス名'
22
      # 誰でもアクセスできるように設定
23
      - '--allow-unauthenticated'
24
      - '--image'
25
      - 'gcr.io/$PROJECT_ID/サービス名:$COMMIT_SHA'
26
      - '--region'
27
      - 'asia-northeast1'
28
  # 最小起動インスタンスを設定
29
  - name: 'gcr.io/google.com/cloudsdktool/cloud-sdk'
30
    entrypoint: gcloud
31
    args:
32
      - 'run'
33
      - 'services'
34
      - 'update'
35
      - 'サービス名'
36
      - '--min-instances'
37
      - '1'
38
      - '--region'
39
      - 'asia-northeast1'
40
timeout: "1600s"
41
images:
42
  - 'gcr.io/$PROJECT_ID/サービス名:$COMMIT_SHA'

環境変数の設定 - codebuild.yamlの準備

nameはクラウドビルダー (使用するコンテナ) を指定するために使います。

以下ではCloud Buildに登録した環境変数をコンテナ内で使用するための設定です。


1
  - name: node:16.15.0
2
    entrypoint: yarn
3
    args: [ "run", "create-env" ]
4
    env:
5
      - 'API_KEY=${_API_KEY}'
6
      - 'SERVICE_DOMAIN=${_SERVICE_DOMAIN}'

package.jsonでは以下のようになってます。


package.json
1
{
2
  "name": "sample",
3
  "version": "0.1.0",
4
  "private": true,
5
  "scripts": {
6
    "dev": "next dev",
7
    "build": "next build",
8
    "start": "next start",
9
    "create-env": "printenv > .env"
10
  },
11
  "dependencies": {
12
    ...
13
  },
14
  "devDependencies": {
15
    ...
16
  }
17
}

ビルド - codebuild.yamlの準備

gcr.io/cloud-builders/dockerを使用してビルドします。

サービス名は適当で大丈夫です。

$PROJECT_IDや$COMMIT_SHAは自動で値が入ります。


1
- name: 'gcr.io/cloud-builders/docker'
2
  args: ['build', '-t', 'gcr.io/$PROJECT_ID/サービス名:$COMMIT_SHA', '.']

デプロイ - codebuild.yamlの準備

コンテナレジストリへデプロイし、gcloudを使ってCloud Runにデプロイします。

デフォルトだと、未認証ユーザーのアクセスが制限されるので、gcloudの引数に--allow-unauthenticatedを設定しておきます。


codebuild.yaml
1
  # Container Registryにデプロイ
2
  - name: 'gcr.io/cloud-builders/docker'
3
    args: ['push', 'gcr.io/$PROJECT_ID/サービス名:$COMMIT_SHA']
4
  # Cloud Runにデプロイ
5
  - name: 'gcr.io/google.com/cloudsdktool/cloud-sdk'
6
    entrypoint: gcloud
7
    args:
8
      - 'run'
9
      - 'deploy'
10
      - 'サービス名'
11
      # 誰でもアクセスできるように設定
12
      - '--allow-unauthenticated'
13
      - '--image'
14
      - 'gcr.io/$PROJECT_ID/サービス名:$COMMIT_SHA'
15
      - '--region'
16
      - 'asia-northeast1'

Cloud Runの設定

デフォルトは最小インスタンスがゼロなので、--min-instancesで値を設定しておきます。

その他、ビルドのタイムアウトなどを設定しておきます。


1
  # 最小起動インスタンスを設定
2
  - name: 'gcr.io/google.com/cloudsdktool/cloud-sdk'
3
    entrypoint: gcloud
4
    args:
5
      - 'run'
6
      - 'services'
7
      - 'update'
8
      - 'サービス名'
9
      - '--min-instances'
10
      - '1'
11
      - '--region'
12
      - 'asia-northeast1'
13
timeout: "1600s"
14
images:
15
  - 'gcr.io/$PROJECT_ID/サービス名:$COMMIT_SHA'