Localというツールでローカル環境でWordPressを作成することがあるのですが、クライアントに見せる場合に面倒だなと思うことが度々あります。
一応LocalのLive Linkというオンラインで閲覧できるツールもありますが、ノートPCを起動し続けないといけないデメリットがあります。
またLocalにはMagic Linkというサーバーと同期する機能もあるのですが、その専用サーバーをレンタルするのに月額の費用がかかリマス。
ということでWP-CLIとrsyncを使って、黒い画面でコマンドを叩いてWordPressのデータを同期してみました。
ローカルとリモートのデータの同期のメリットは?と思う方がいるかもしれませんが、ローカルの方が作業が早いですし(特に海外にいる場合)、レンタルサーバーも済む場合があるので手段として持っておくと便利です。
もちろん本番、ステージング、作業環境の3段階に分けて慎重にサイト制作をするというケースにも使えます。
WordPressのデータを同期するための環境構築
下記のツールを使います。
- SSH サーバーにリモート接続をします。
- WP-CLI WordPressの管理をコマンドラインから行うツール。データベース周りの作業に使います。
- rsync ローカルとリモートのファイル同期と転送で使います。
面倒ですが、全てちゃんと入れましょう。
コードはできるだけ具体的なサンプルで入れております。
SSHの導入
お使いのレンタルサーバーからSSHを調べてみましょう。
Macの環境設定
Macの環境設定から共有、リモートログインにアクセス(リモートログインで検索してもOK)
リモートログインをONにしてssh name@xxx.xxx.x.xx
をメモしておきましょう。
その後にMacのパスワードを打って下記のような表示が出ればSSH接続が完了です。Last login: Sat Nov 4 20:45:44 2023
SSHの設定
例えばConoHaであればサーバー管理からSSHの利用設定ができます。
まずは.sshフォルダを作成します。
mkdir ~/.ssh
ダウンロードしたネームタグ名.pemを作成したフォルダに移動
mv /Users/motoki/Downloads/ネームタグ名.pem ~/.ssh
パーミッションを変更します。
chmod 400 ~/.ssh/ネームタグ名.pem
ssh ユーザー名@www777.conoha.ne.jp -p ポート番号 -i ~/.ssh/ネームタグ.pem
を入れたコマンドを入れてSSH接続をします。
ssh username@www777.conoha.ne.jp -p 9999 -i ~/.ssh/name.pem
SSH接続の専用コマンドを作成する
Configも作成しましょう。
ターミナルを改めて起動。
SSHのフォルダにアクセスしてcongifフォルダを作成
touch ~/.ssh/config
configにアクセス
sudo vim ~/.ssh/config
VIMで書き込みます。
Host conoha
HostName www777.conoha.ne.jp
IdentityFile ~/.ssh/ネームタグ名.pem
User ユーザ名
Port ポート番号
参考
WP-CLIの導入
データベース周りの抽出に使います。
サーバー側のWP-CLIの導入
SSHで接続します。
cd ~
mkdir bin
cd bin/
curl -O https://raw.githubusercontent.com/wp-cli/builds/gh-pages/phar/wp-cli.phar
chmod +x wp-cli.phar
最後に下記のコマンドで確認。
wp-cli.phar --info
続いてコマンドを省略するために、エイリアスを追加します。
php74のところはPHPのバージョンに合わせて記述を変更しましょう。
cd ~
echo '' >> ~/.bashrc
echo 'alias wp="/opt/alt/php74/usr/bin/php ~/bin/wp-cli.phar"' >> ~/.bashrc
source ~/.bashrc
最後に確認をします。
wp --info
ローカル側のWP-CLIの導入
続いてローカル環境です。
brew install wp-cli jq
最後に確認します。
wp --info
エラーが出た場合はXcodeのコマンドラインツールをインストール
MacのOSによってはError: No developer tools installed. Install the Command Line Tools:xcode-select –installというエラーができるので、Xcodeのコマンドラインツールをインストールする必要があります。
xcode-select --install
エラーが出た場合
libavif
ライブラリが見つからないというエラーがあったので
brew reinstall libavif
さらに古いlibavifが参照されていたため、依存関係を更新
brew reinstall gd
rsyncIの導入
続いてをインストールします。
brew install rsync
確認します。
rsync --version
データベースの差し替え(リモートからローカルへ)
仮にLocalで作成したローカルのサイトをwaza.local
サーバー側のサイトはwaza.studio
と仮定して同期してみます。
リモート側の作業
SSH接続した後、特定の階層のファイルを調べてみます。
ちゃんと動作すればOKです。
ls -l ~/public_html/waza.studio
下記のコマンドでデータベースのエクスポートしましょう。
wp db export remote-database.sql --path=/home/username/public_html/waza.studio
ローカル側の作業
先程、生成したデータベースのデータをダウンロードします。
scp -P 9999 -i ~/.ssh/tag-name.pem user-name@www999.conoha.ne.jp:~/remote-database.sql ~/Downloads/remote-database.sql
LocalのWordPressの項目からShellを起動します。
下記のコマンドを実行するとデーターベースを差し替えできます。
wp db import /Users/motoki/Downloads/remote-database.sql
最後にデータベース内のパスを置換します。
wp search-replace 'https://waza.studio/' 'http://waza.local/'
メディア、プラグイン、テーマの同期(リモートからローカルへ)
rsyncのコマンドを利用して、差分のデータを同期します。
wp-content以下を同期
基本、wp-content以下を同期すればOKだと思います。rsyncは差分の同期なので初回以降はそこまで時間がかからないと思います。
rsync -avz -e "ssh -i /Users/motoki/.ssh/tag-name.pem -p 9999" user-name@www999.conoha.ne.jp:~/public_html/waza.studio/wp-content/ /Users/motoki/Local\ Sites/waza/app/public/wp-content/
これより以下は、フォルダごとでも同期できますよという例です。
メディアの同期
rsync -avz -e "ssh -i /Users/motoki/.ssh/tag-name.pem -p 9999" user-name@www999.conoha.ne.jp:~/public_html/waza.studio/wp-content/uploads/ /Users/motoki/Local\ Sites/waza/app/public/wp-content/uploads/
プラグインの同期
rsync -avz -e "ssh -i /Users/motoki/.ssh/tag-name.pem -p 9999" user-name@www999.conoha.ne.jp:~/public_html/waza.studio/wp-content/plugins/ /Users/motoki/Local\ Sites/waza/app/public/wp-content/plugins/
テーマの同期
rsync -avz -e "ssh -i /Users/motoki/.ssh/tag-name.pem -p 9999" user-name@www999.conoha.ne.jp:~/public_html/waza.studio/wp-content/themes/ /Users/motoki/Local\ Sites/waza/app/public/wp-content/themes/
以上で完了です。
WordPressのデータを同期するための環境構築
今度はローカルからサーバー側に同期します。
同期先は適当に作成したサブディレクトリ(hoge.com/waza)にしています。
データベースの同期
Localのデータベースは各サイトごと、下記のような階層にあります。
/Users/ユーザー名/Local Sites/waza/app/sql/local.sql
ローカルでターミナルを起動してサーバーにアップロードしましょう。
scp -P 9999 -i ~/.ssh/tag-name.pem "/Users/motoki/Local Sites/waza/app/sql/local.sql" username@www999.conoha.ne.jp:~/local-database.sql
SSH接続します。
ディレクトリをインポートしたいサイトにします。
cd ~/public_html/hoge.com/waza/
データーベースを差し替えます。
wp db import ~/local-database.sql
最後にデータベース内のパスを置換します。
wp search-replace 'http://waza.local/' 'https://hoge.com/waza/'
wp-content以下を同期
ローカルからターミナルを起動して以下のコマンドでwp-content以下の差分を同期。
rsync -avz -e "ssh -i /Users/motoki/.ssh/tag-name.pem -p 9999" "/Users/motoki/Local Sites/waza/app/public/wp-content/" username@www999.conoha.ne.jp:~/public_html/hoge.com/waza/wp-content/
まとめ
データベースとファイルの2種類の作業になりますが、コマンドを叩いて同期させてみました。
この一連の作業をすると理解できると思いますが、configを作成して、シェルスクリプトを作成すればワンクリックで同期するということも可能です。
もちろんプラグインを使ってインポートエクスポートするということができますが、スクリプトさえ作成できれば
ローカルで作成したサイトをサーバーに同期してクライアントさんに確認してもらうこともできますし、
逆にローカルへのバックアップもすぐにできると思います。
気になった方はぜひチャレンジしてみてください。