GitLab CI/CD

最終更新日：March 21, 2024

上級者向けですが、GitLab CI/CD（継続的インテグレーション/継続的デリバリー、または継続的デプロイメント）を使用して、弊社サイトを更新することができます。関連するブランチに新しいコミットをプッシュするたびに、コードの変更が自動的にサイトにデプロイされます。これにより、WordPressのMySQLデータベースを上書きせずに、継続的に弊社プラットフォーム上の本番環境にコードをプッシュできます。

GitLab CI/CDをセットアップすることで、ローカル環境や弊社のステージング環境からコードをプッシュできるだけでなく、バージョン管理システムも構築できます。以下の例では、ステージング環境を作成し、変更をGitLab経由で本番環境にプッシュします（「本番環境への反映」機能はバイパスします）。

GitLabのアカウントをお持ちでない場合は、まずはアカウントを作成してください。

Kinstaサイトの作成

まずは、空のサイトを作成してからWordPressをインストールします。弊社で既にWordPressサイトを運営されている場合でも、以下の手順でサイトをGitLabに接続することができます。

MyKinstaで「WordPressサイト」を選択し、右上の「サイトを追加する」＞「新規サイト作成」をクリックします。次のページで「空の環境（WordPress無し）」を選択し「続行」で次に進みます。

必須フィールドに入力し、「次へ」ボタンをクリックして各ウィンドウに進み、サイト作成プロセスを終了します。

GitLabプロジェクトの作成

まずGitLabにアクセスし、「新しいプロジェクトを作成」をクリックして、Kinstaサイト用に新しいリポジトリを作成します。なお、表示言語を日本語に設定するには、サイドバーの「Preference」＞「Localization」の「Language」ドロップダウンから日本語を選択し、「Save Changes」で変更を保存します。

「空のプロジェクトを作成」オプションを選択し、「プロジェクト名」と「プロジェクトslug」を入力します。

「表示レベル」では、リポジトリを「プライベート」に設定することをお勧めします。このGitLabリポジトリには、有料のプラグインやテーマのコードが含まれる可能性があり、「公開」に設定してしまうと、他のユーザーが自由に購入した製品をダウンロードすることができてしまいます。

新しいプロジェクトの設定が完了したら、「プロジェクトを作成」をクリックして続行します。

SSH鍵の設定

次に、GitLabとMyKinstaの2つのプラットフォームが通信できるように、SSH鍵を追加します。

GitLabにSSH公開鍵を追加する

まず、Kinstaサイトの本番環境にSSH接続し、以下のcatコマンドを実行して、SSH公開鍵を表示します。

cat ~/.ssh/id_rsa.pub

公開鍵は、以下のような形式です。コマンドラインウィンドウを開いたままにして、ウェブブラウザでGitLabに戻ります。

ssh-rsa AAAAB3NzaC1yc2EAAAADAQABAAABgQC7zdjwd6UIUJ5t4YnXNi6yhdHgrvIV2xgjvJ3592wd1Hzmnta4dau7yOIxQDU7/oNIr6DIskuIUii5ruGi4YZpIwB/AWGrn/uWb+FXJFiQHMZq9rCFcqtZXT0fyzKiSNkblV4F1RaPQJRvxfSUsSQ3jJU3FX8CF1c4R40CiBKkSHM8uavVIIESzgIHRiWVxkL9F6SKzg8GeTctJaAa3W+q1F1T60OKYmzH3OLdA37ZNmkm1CYWa8SF0JjOszxOnPwhfQ49P5r+rftXRFLz/7hGJ8CnUyzErSiUdUKNknUAB+w4KEZshQSNuiken0+GKqIw83dWWSyjiJJigcyDez2s+3AqDLHPG45NoBEXuBXjPQ9C08hokVyKlbzd/P2qvcnzUT5S6zTuaYOW+50+fiXeYkJlEoYYxoGRVx6FFdFqWyJx5UyaDv7QY3iQH0qct1iq9XGXMhBxIecIAEPUwF8nOp15in8L+5UIFMiNnihztTAXysc+8xvVwbuRlQIeR/E= ansible-generated on fvj-kinstagit

GitLabの画面右上にあるユーザーアイコンをクリックし、ドロップダウンメニューから「設定」を選択すると、「ユーザー設定」画面が表示されます。

サイドバーにある「SSHキー」をクリックします。

「新しいキーを追加」をクリックし、「キー」フィールドにSSH公開鍵を貼り付けます。「タイトル」フィールドは自動入力されますが、必要に応じて変更可能です。GitLabでは、SSH鍵の有効期限を設定することもできます。これは、インフラのセキュリティプロトコルの一部としてSSH鍵を無効にしたり、ローテーションしたりする場合に有用です。特に必要ない場合は、「有効期限」フィールドは空白のままにしてください。

構成を再確認後、「キーを追加」をクリックして終了します。

MyKinstaにSSH公開鍵を追加する

SSH公開鍵をGitLabに追加したら、同じ鍵をMyKinstaにも追加する必要があります。この手順では、SSH公開鍵をサイトのauthorized_keysファイル（rootとMyKinstaのみ書き込み可能）に追加します。これにより、GitLabがSSHでサイトにアクセスしてコードの変更をデプロイできるようになります。MyKinstaの画面右上にあるユーザーアイコンをクリックし、ドロップダウンメニューから「ユーザー設定」を選択します。

スクロールダウンして、「SSH鍵を追加」ボタンをクリックします。

モーダル/ポップアップウィンドウで、SSH鍵の「ラベル（名前）」を指定し、「SSH鍵」フィールドに公開鍵を貼り付け、「SSH鍵を追加する」をクリックして終了します。

GitLabにSSH秘密鍵を追加する

次に、サイトの本番環境にあるSSH秘密鍵をGitLabの環境変数として追加する必要があります。

秘密鍵を見つけるには、コマンドラインウィンドウに戻り、以下のコマンドを実行します。SSHの秘密鍵は、GitLab以外の場所で共有しないでください。

cat ~/.ssh/id_rsa

GitLabで、先ほど作成したプロジェクトをクリックします。サイドバーの「設定」にカーソルを合わせ、表示されるメニューから「CI/CD」をクリックします。

「変数」セクションの「展開」ボタンをクリックし、「変数を追加」をクリックします。キー名にSSH_PRIVATE_KEYを使用し、「値」フィールドに秘密鍵を貼り付け、「変数を追加」ボタンをクリックして続行します。

変数を追加すると、リポジトリの設定に表示されます。

GitLabのリポジトリをMyKinstaに複製する

必要なSSH鍵を追加したため、弊社の本番環境にGitLabのリポジトリを複製します。GitLabでリポジトリに移動し、青い「クローン」ボタンをクリックし、「SSHでクローン」セクションのアドレスの横にあるアイコンをクリックして、リポジトリのアドレスをコピーします。

コマンドラインウィンドウに戻り、本番環境のホームディレクトリに移動します。ホームディレクトリへの移動方法がわからない場合は、以下のコマンドを使用してください。

cd ~/

ホームディレクトリに移動したら、GitLabからコピーしたリポジトリアドレスを指定してgit cloneコマンドを実行します。

git clone [your-repository-url-here]

リポジトリを複製すると、「you appear to cloned an empty repository（空のリポジトリをクローンしています」という警告が表示されます。現時点でリポジトリは空の状態であるため、問題ありません。

弊社のNginxの構成では、~/publicフォルダからコンテンツを配信します。したがって、既存の~/publicフォルダを削除し、クローンしたリポジトリフォルダの名前を「~/public」に変更する必要があります。これを行うには、以下の2つのコマンドを実行します。

rm -rf ~/public
mv ~/your-repo-folder-name ~/public

GitLabリポジトリを設定する

次に、以下のコマンドで~/publicフォルダに移動します。

cd ~/public

以下の2つのコマンドを実行して、GitLabリポジトリを設定します。このとき、必ず有効なメールアドレスと、GitLabアカウントに関連するユーザー名を指定してください。

git config --global user.email "[email protected]"
git config --global user.name "brian"

WP-CLIを使用してWordPressをインストールする

GitLabリポジトリを弊社の本番環境に複製し設定を行ったら、WordPressをインストールします。wordpress.orgからダウンロードしてインストールするか、WP-CLIでインストールすることができます。WP-CLIを使用する場合は、「~/public」フォルダで以下のコマンドを実行します。

wp core download

WordPressをインストールすると、「~/public」フォルダは以下のようになります。

新規WordPressインストールのWordPressコアファイルとディレクトリ

次に、MyKinstaのサイトの「ドメイン」画面に移動し、「URLを開く」リンクをクリックして、プライマリドメインにアクセスします。

WordPressの5分間インストールの手順が表示されます。WordPressの設定方法についてはこちらをご覧ください。

WordPressのインストール完了後、プライマリドメインにアクセスすると、WordPressサイトが表示されます。

GitLab CI/CDパイプラインを設定する

構成ファイルを設定して、リポジトリのメインブランチが更新されたら、GitLabに自動デプロイの開始を指示します。弊社本番環境の~/publicフォルダにいることを確認し（必要であればcd ~/publicを実行して移動します）、以下のコマンドを実行して、新しいファイル「.gitlab-ci.yml」作成します。

touch .gitlab-ci.yml

ファイルを作成したら、以下のテキストをファイルに追加します。コマンドラインでnanoやvimを使用してファイルを編集するか、SFTPとテキストエディターやコードエディターを使用して編集できます。SFTPクライアントを使用する場合は、.gitlab-ci.ymlファイルが見えるように隠しファイルの表示を有効化してください。

before_script:
    - apt-get update -qq
    - apt-get install -qq git
    # Setup SSH deploy keys
    - 'which ssh-agent || ( apt-get install -qq openssh-client )'
    - eval $(ssh-agent -s)
    - ssh-add <(echo "$SSH_PRIVATE_KEY")
    - mkdir -p ~/.ssh- '[[ -f /.dockerenv ]] && echo -e "Host *ntStrictHostKeyChecking none" > ~/.ssh/config'
    - ssh-keyscan gitlab.com >> ~/.ssh/known_hosts
    - chmod 644 ~/.ssh/known_hosts
deploy_live:
    environment:
        name: Live
        url: your-primary-domain script:
        - ssh user@ip-address -p port-number "cd public-root && git checkout main && git pull origin main && exit"
    only:
        - main

deploy_liveブロックのurlとscriptパラメータを変更します。太字の値は、MyKinstaで表示されるサイトの詳細に置き換えます。

「your-primary-domain」を、サイトのプライマリドメインで置換する
「ssh user@ip-address -p port-number」を、MyKinstaの「WordPressサイト」＞（サイト名）＞「情報」>「SFTP/SSH」で表示される「SSHターミナルのコマンド」で置換する
「public-root」を、MyKinstaの「WordPressサイト」＞（サイト名）＞「情報」>「環境情報」で表示される「パス」で置換する

ファイルのonly: - mainセクションは、GitLabのCI/CDプロセスを起動するリポジトリブランチを参照します。この構成では、mainブランチにプッシュすると、本番環境へのデプロイが始まります。デプロイのトリガーとして別のブランチを指定する場合は、自由に設定を変更してください。

ステージング環境を考慮した追加の構成を実装するには、弊社のステージング環境のURLとSSHの詳細を使用して、追加のdeploy_stagingブロックを構成します。

deploy_staging:
    environment:
        name: Staging
        url: your-staging-domain script:
        - ssh user@ip-address -p port-number "cd public-root && git checkout main && git pull origin staging && exit"
    only:
        - staging

同様にonly: - stagingセクションに注意してください。これは、stagingブランチにプッシュすると、GitLabのCI/CDプロセスが始まることを意味します。必要に応じてこれを調整すると、任意のブランチからデプロイできます。

GitLabへの最初のコミット

以上で、WordPressとGitLabの設定ファイルの準備が整いました。続いて、GitLabに最初のコミットを実行します。ブランチ「v0.1」を作成し、リポジトリのファイルの追跡を開始します。変更をコミットして、v0.1ブランチのGitLabに変更をプッシュします。~/publicフォルダから以下のコマンドを実行して、最初のコミットを行います。

git checkout -b v0.1
git add .
git commit -a -m 'Initial Commit'
git push origin v0.1

GitLabでリポジトリを確認すると、最初のコミットで作成したファイルが表示されます。

ステージング環境の設定

次に、MyKinstaのステージング環境を作成して設定を行います。ステージング環境を利用することで、本番環境に影響を与えずに、プラグイン、テーマ、コードを安全にテストできます。

ステージング環境を作成したら、本番環境用のコマンドラインウィンドウは開いたまま、新しいコマンドラインウィンドウを開いてステージング環境にSSH接続し、以下のコマンドを実行して、コードの変更箇所を確認します。

cd ~/public && git status

すると、以下のようなメッセージが表示されます。ブランチは先ほど作成したv0.1ですが、ステージング環境を作成する際に、wp-config.phpファイルに数行追加されたため、変更されています。

変更をコミットし、本番環境にデプロイ

最後に、ステージング環境にいくつか変更を加え、GitLabを使用して本番環境にコミットをプッシュします。なおこの方法は、「本番環境への反映」機能をバイパスします。

次のWP-CLIコマンドを使用して、Yoast SEOプラグインをインストールします。

wp plugin install wordpress-seo

Yoast SEOプラグインをインストールしたら、以下のコマンドを実行してコミットし、v0.1ブランチに変更をプッシュします。

git add .
git commit -a -m ‘Installed Yoast SEO plugin.’
git push origin v0.1

最後に以下のコマンドで、mainブランチに切り替え、v0.1をmainにマージし、mainをGitLabにプッシュします。GitLab構成ファイルのonly: - mainの設定により、本番環境へのデプロイ処理が始まります。

git checkout main
git merge v0.1
git push origin main

GitLabで、レポジトリのサイドバーの「CI/CD」＞「ジョブ」に移動すると、稼働中のジョブが表示されます。以下のジョブは、GitLabが本番環境にYoast SEOプラグインをデプロイしているものです。

ジョブが終了したら、本番環境のコマンドラインウィンドウに戻り、そのウィンドウでwp plugin listを実行します。リストには、ステージング環境にインストールされたYoast SEOプラグイン、wordpress-seoが表示されます。

Kinstaサイトを扱うテーマおよびプラグイン開発者は、GitLab CI/CDの自動デプロイを設定することで、ワークフローを高速化し、同時にコードのバージョン管理を行うことができます。