Manul Tech

WordPressの環境を丸ごと共有してみた

MAMPを使用して構築しているWordPressを丸ごと共有（自分ともう一人の合計2名）する必要が出てきた。
データは問題ないだろうけど、データベースをさてどうしたものか。
（2018.07.27 追記あり）

WordPress本体／テーマファイルはGitで

本当はwp-content配下だけをGitに上げようかと思っていたけど、データベースも共有するわけだから
WordPressのバージョンに差異ができたら面倒そうなので、WordPressを丸ごと共有することに。
全部合わせても200MBほどだったから、まぁいいか。

問題はデータベース

最初はデータベースのファイルそのものをGitの管理下に置いて、/Applications/MAMP/db/mysql56/にシンボリックリンクを張ろうかと思ったんだけど、WordPressはファイルパスなどを絶対パスで保存しているから、何処かのタイミングでIPアドレスを共有先のものに書き換えないといけない。
構築にはgulpも使用しているから、gulpfile.jsにその辺の処理を書けばいいかと、node.jsでコマンドを実行する方法を調べてみた。

PolyPeaceLight
Node.jsでshellコマンドを叩く

上記サイトの通りできるようなんだけど、それでmysqlの内容を変更するのは大変そうだったからやめた。

結局データベースはWEB上に置いて共有することに

データベースは遊ばせているXserverに置く事に。早速データベースをインポートしていざ接続、って思ったんだけど、普通のレンタルサーバって外部からはデータベースには接続できないよねーって思って、何か方法は無いか調べてみた。そしたらドンピシャなものが。

中年プログラマーの息抜き
外部サーバーのMySQLにssh経由で接続してダンプとリストアをしてみる

上記のサイトでSSHポートフォワードなるものを知る。そんなものがあるのかー。
結論から言うと、そのSSHポートフォワードを使用すると外部からでもXserverのデータベースに接続できそう。
そしてSSHポートフォワードについてさらに調べてみる事に。

Qiita
SSHポートフォワーディングでMySQLにつなげる

なんとなくわかった気がする。
つまり、gulpでローカルサーバを立ち上げる前にSSHポートフォワーディングで接続（1回だけ）すればいいわけだ。

// gulpfile.js

const gulp = require('gulp');
const exec = require('child_process').exec;

gulp.task('sshPortForwarding', () => {
    const command = 'ssh -f -N -L {適当なポート 3307とか}:{Xserverのmysqlサーバ}:3306 {Xserverのホストなど、sshログイン情報}';
　　　　　
　　　　　// すでにsshポートフォワード接続されているかどうかをチェック
    const checkCommand = `ps -aefw | grep "${command}" | grep -v " grep " | awk '{print $2}'`;

    exec(checkCommand, (err, stdout, stderr) => {
        if(!stdout){
            console.log('ssh port forwarding');

            exec(command, (err2, stdout2, stderr2) => {
                console.log('start gulp');
            });
        }
        else{
            console.log(`ssh port forwarding startednPID:${stdout}`);
        }
    });
});

で、gulp起動時に上記を実行するようにする。

gulp.task('default', ['sshPortForwarding', 'server', 'watch']);

// server、watchはそれぞれローカルサーバの起動、ファイル変更監視。ここでは省略

すでにsshポートフォワード接続されているかどうかをチェックする部分は以下のサイトを参考にさせていただいた。

CloudAdvisor
実行コマンド名からPIDを取得する

そんで、wp-config.phpの内容もXserverのものに変更。だけどホスト名だけはローカルを指定。

// 例。ポート3307はポートフォワーディングで指定したもの
define('DB_HOST', '127.0.0.1:3307');

最後にテーマファイルのfunctions.phpにIPアドレスを変更する処理を。
ここも最初はSELECT文を発行するときにSELECT REPLACEでIPアドレスを変えようかと思った。

ITかあさん
Mysqlで便利な文字列一括置き換えのSQL

だけどこれはうまくいかなそうだったから、ob_start, ob_endで出力前に互いのIPアドレスがあった場合は自分のIPアドレスに置き換えるようにする事に。ローカルIPは固定にしてあるから決め打ちでOKだった。

add_action('after_setup_theme', 'buf_start');
add_action('shutdown', 'buf_end');
function buf_start(){
    ob_start('buf_call_back');
}

function buf_end(){
    ob_end_flush();
}

function buf_call_back($buffer){
    $ip1 = '192.168.1.1';
    $ip2 = '192.168.1.2';
    $search = $_SERVER['SERVER_ADDR'] === $ip1 ? $ip2 : $ip1;
    $buffer = str_replace($search, $_SERVER['SERVER_ADDR'], $buffer);

    return $buffer;
}

Web制作ナビ
WordPressですべての処理が終わった後にコンテンツを置換する方法（アクションフック）

これでとりあえず問題なく表示まではできた。
でもこれから実際に2名で作業していく中で、何か不具合が起こりそうな気もする。
普通は丸ごと共有なんてことはしないんだろうなーなんて考えつつ、今回も色んなサイトを参考にさせてもらって勉強になった。

2018.07.27 追記
予想通り、何かあった。
このままだと、管理ページにうまくログインできない場合があることがわかった。
その場合はwp-config.phpにWP_HOMEとWP_SITEURLを設定するとログインできるようになる。

if(strpos($_SERVER['REQUEST_URI'], '/wp-admin/') !== false || strpos($_SERVER['REQUEST_URI'], '/wp-login.php') !== false){
    define('WP_HOME', 'http://localhost:3000/JPS/wordpress');
    define('WP_SITEURL', 'http://localhost:3000/JPS/wordpress');
}

とか。

コメント0