strapiで記事を作成したらGridsomeがビルドされるようにしてみる
前回ではstrapiのGridsome Blog StarterをGitHubにpushしたときに自動でビルドとデプロイが実行されるようにしました。
今回はstrapiの管理画面から記事の作成や更新をしたタイミングでGridsomeのビルドとデプロイが実行されるようにしてみます。
前回までの記事
事前準備
前回までのプロジェクトを引き続き使用します。
Secret Manager APIを有効化
VSCodeでgcloudのコンテナに入り、下記コマンドを実行してSecret Manager APIを有効化します。
$ gcloud services enable secretmanager.googleapis.com
APIキーの取得
Webhookに使用するAPIキーを作成します。
Google Cloud Platformの"APIとサービス"から"認証情報"を選択します。
"認証情報を作成"をクリックします。
"API キー"を選択します。
APIキーが作成されるので、"キーを制限"をクリックします。
"名前"を入力し、"アプリケーションの制限"で"HTTPリファラー（ウェブサイト）"を選択します。
ここでは"リファラー"にstrapiのURLのドメイン部分を入力し、完了をクリックします。
"保存"をクリックして設定したAPIキーの名前と制限を保存します。
Cloud BuildでWebhook用トリガーを作成
Cloud Buildのページから"トリガー"を選択します。
前回作成したGridsomeのトリガーを複製してWebhookトリガーを作成します。
デフォルトでついていたトリガー名の文字数が長くて複製できなかったので、事前にGridsomeのトリガー名は"gridsome-blog-github"に変更しています。
"gridsome-blog-github"のメニューをクリックします。
"複製"をクリックします。
トリガーが複製されるので、複製した方のトリガー名をクリックします。
ここでは名前を"gridsome-blog-webhook"に変更し、"イベント"で"Webhook イベント"を選択します。
"シークレット"の"新規作成"で"シークレットを作成"をクリックします。
"シークレット名"を入力して"シークレットを作成"をクリックします。
"リビジョン"の"ブランチ名"がmasterになっているのでmainに変更します。
"保存"をクリックして変更を保存します。
strapiでWebhookを作成
strapiでWebhookを作成します。
strapi管理画面のメニューから"設定"をクリックします。
"グローバル設定"の"Webhooks"をクリックします。
"Webhookを追加"をクリック
"Webhookを作成"が表示されます。
"名前"にはgridsome_buildを入力しました。
"URL"には作成したWebhook用トリガーのURLを入力します。
Webhook用トリガーのURLを確認するにはGoogle Cloud PlatformのCloud Buildのページから"トリガー"に行き、作成したトリガー名をクリックします。
"URL のプレビューを表示"をクリックします。
"Webhook URLのプレビュー"に表示されているURLをコピーしてstrapiのWebhookのURLにペーストし、<API_KEY>の部分を取得したAPIキーに置換します。
"ヘッダー"の"キー"にRefererを選択し、"値"にはAPIキーの取得で設定した"リファラー"を入力します。
"イベント"にはすべてにチェックを入れます。
"保存"をクリックします。
トリガーがうまく動作するか"トリガー"をクリックしてテストします。
トリガーがうまくいけば下記が表示されます。
Google Cloud PlatformのCloud Buildページでビルドが実行されていることが確認できます。
トリガーのテストがうまくいけば、記事の新規作成や更新をしたときにもビルドが実行されるようになっているはずです。
Discussion