はぴすぷ

【WordPress】サブドメインでステージング環境作成 in【お名前.comの共用サーバーSD】

      2015/09/22

WordPressのカスタマイズしてますか？

バックアップは取っていますか？

ローカル環境でしっかりテストしてますか？

これ全てにYES！な人にオススメするのが、ステージング環境の作成です。

一応タイトルに「WordPress」と「お名前.comの共用サーバーSD」と含めていますが、他のWebサービスやレンタルサーバーご利用中のお方にも役立つ内容になっているはずです(・∀・)

スポンサーリンク

ステージング環境とは

本番環境に何か変更を加える前に、最終確認・調整を行う為の開発環境の一種です。

具体的には、「本番環境と同じサーバ」もしくは「限りなく近い構成で構築されたサーバ」に用意される環境のことです。

ローカルの開発環境でうまく動いたとしても、本番環境でうまく動くという保証はありません。

特にWindowsでXAMPPで開発しているという人は要注意です。

恐らく本番環境はレンタルサーバーのLinux（大体はCentOS）の上で動作していると思います。

そもそもOSが違うのも大きいですが、phpやMySQL、Apacheのバージョンや設定もかなり違っていると思います。

その為、「手元で動いたから大丈夫！本番にFTPで送信！」なんてやっているとおかしな動作になるだけならまだしも、エラー画面しか表示されない。といった状況にもなりかねません。

もし、ローカルの開発環境はバーチャルマシン上に、本番環境と同じ環境を用意しているというのであれば、すぐにはトラブルは起こらないでしょう。それでもトラブルは起こりえるので、ステージング環境を用意した方が良いというのは変わりません。

たかがWordPressでそこまでするか？というのもありますが、「本格的にWordPressをカスタマイズするつもりだ」とか、「ゆくゆくは他のWebサービスも提供したい」とかの考えがあれば是非ステージング環境を作成してみましょう。

ステージング環境の作成

本来ならWebサービスの開発では、ステージング環境があって、それを本番環境に移して公開という流れが普通なんですが、この記事を見ている方はきっと既に本番で運用中の方が多そう。

というわけで本番環境を複製します。

サブディレクトリ？サブドメイン？

ステージング環境を用意するにあたって、どうやってアクセスするか決めます。

サブディレクトリの場合は以下のようになります。

https://hapisupu.com/stg/

サブドメインの場合は以下のようになります。

http://stg.hapisupu.com/

仮に「stg」としましたが、何でも良いです。

そして、サブディレクトリと、サブドメインどちらが良いかは一概には言えないので、お好みでどうぞ(´・ω・｀)

私は本番環境の下に、ステージング環境を配置するのは何か嫌だったのでサブドメインにしました。

他に理由をあげると、環境を変える時に「stg」の部分を取っ払ったり、「dev」とかに変えるんですが、頭に付いてた方が探しやすくていいかなとか。

後は、サブドメインの作り方とか知らなかったからやってみようとかそんな理由です。

お名前.comの共有サーバーSDでサブドメイン作成

私の現在利用している「お名前.comの共有サーバーSD」での方法です。1分とかかりません。

コントロールパネルから「独自ドメイン設定」を選択します。

SS_0997

対象のドメインの横にある「サブドメインを追加」をクリック。

SS_0931_1

サブドメインの名前を入力して「確認画面へ進む」をクリック。

SS_0932_1

確認して問題なければ「決定」をクリック。

SS_0933_1

完了。

SS_0934_1

戻るとサブドメインが増えてます。

SS_0935_1

サーバーにSSHやFTPクライアントで接続してみると、サブドメインのディレクトリが作成されているのが分かります。

SS_0988

本番環境のファイル・ディレクトリ複製

本番環境のWordPress用のファイルを全てステージング環境にコピーします。

FTPクライアント使ってローカルに全部ダウンロードして、アップロードという方法も可能ですが、時間がかかるので、SSHでサーバー内で完結させます。

黒い画面に慣れましょう！

まずは本番の構成を確認してみる。
移動して。

cd hapisupu.com/

何があるか確認。

ls -la

結果（分かりやすくなるよう弄ってます）

.
..
.htaccess
index.php
wordpress-4.2.2-****
wp -> /****/hapisupu.com/wordpress-4.2.2-****

wpでシンボリックリンク張ってた。

ステージング環境に移動。

cd ../stg.hapisupu.com/

本番のファイルとディレクトリをコピー

cp -p ../hapisupu.com/.htaccess .
cp -p ../hapisupu.com/index.php .
cp -rp ../hapisupu.com/wordpress-4.2.2-**** .

同じようにシンボリックリンクを貼る

ln -s /****/stg.hapisupu.com/wordpress-4.2.2-**** wp

シンボリックリンクは無視してwpディレクトリそのままコピーしてもいいと思いますが、一応合わせておきました。

これで、サブドメインにブラウザからアクセスすると、「本番と同じもの」が表示されます。

データベースが同じ接続先になっているので、ステージング環境用のデータベースを用意します。

お名前.comの共有サーバーSDでデータベース作成

これも1分もかからず出来ます。

コントロールパネルから「データベース設定」の「MySQL」を選択します。

SS_0996

「作成」をクリック。

SS_0906_1

出来ました(^q^)

SS_0990

一覧に戻ると、データベースが追加されてますが、データベース名を自分で決められず、何に使うものか分からないのでメモを付けておきます。「変更」をクリック。

SS_0998

メモを入力して「確認画面へ進む」をクリック。
（パスワードを変更したい場合は一緒にしておいても良いです。）SS_0992

問題なければ「決定」をクリック

SS_0993

完了。パスワード変更してへんけどな！

SS_0994

ステージング環境のデータベースに本番用データをインポート

もしステージング環境に本番データ反映する必要ないなら飛ばして下さい。

phpMyAdminを使ってエクスポート・インポートする方法についてはこちらから。
【WordPress】phpMyAdminでDBのバックアップと復旧（エクスポート・インポート）を行う方法

直接MySQL使えるよって方なら、ダンプして流し込みます。

ステージングDB作ってない人は先に作っておきましょう。

CREATE DATABASE [ステージングDB名] DEFAULT CHARACTER SET utf8;

ダンプ。

mysqldump -u [ユーザ] -p [本番DB名] > dump.sql

流し込み。

mysql -u [ユーザ] -p [ステージングDB名] < dump.sql

終わり。

ステージング環境用に調整

データベースの内容を全て同じにすると、WordPress上のリンクが本番環境に向けられてしまうので、それだけ変更します。テーブル名とURLは調整して下さい。

UPDATE wp_options SET option_value = 'http://stg.hapisupu.com/wp' WHERE option_name = 'siteurl';
UPDATE wp_options SET option_value = 'http://stg.hapisupu.com' WHERE option_name = 'home';

 

ステージング環境のWordPress設定ファイル変更

データベースを用意したので、WordPress設定ファイルのデータベースの接続先を、ステージング環境の内容に置き換えます。

wp-config.php

// ** MySQL settings - You can get this info from your web host ** //
/** The name of the database for WordPress */
define('DB_NAME', '**********');

/** MySQL database username */
define('DB_USER', '**********');

/** MySQL database password */
define('DB_PASSWORD', '**********');

/** MySQL hostname */
define('DB_HOST', '**********');

これでステージング環境は作成出来ました！

関係者以外は立ち入り禁止

ステージング環境とは言え、一般の人に見られるのは困りますよね。

というわけでアクセス制限をかけます。色々方法はありますが、簡単に出来る方法を2点あげておきます。

.htaccessで特定のIPアドレスからのみアクセスを許可する

本番環境からコピーしてきた「.htaccess」の先頭に以下を追記します。

# アクセス制限
order deny,allow
deny from all
# 特定のIPのみ許可する
allow from ***.***.***.***
allow from ***.***.***.***

自分のグローバルIPアドレスの確認はこことかで出来ます。
アクセス情報【使用中のIPアドレス確認】

これで関係者以外は403のForbiddenエラーが表示されます。

.htaccessでベーシック認証をかける

IPがコロコロ変更されるので困るとかの理由があれば、ベーシック認証を利用しましょう。

アクセスしようとした時に、こういうダイアログが出るやつです。

SS_1017

「お名前.comの共有サーバーSD」では簡単に、アクセス制限（ベーシック認証）をかける方法がコントロールパネルに用意されています。

SS_1012_1

ドメインを選択して「新規作成」をクリック。

SS_1013

認証フォームタイトルと、ユーザ情報を入力して「確認画面へ進む」をクリック。

SS_1014

確認して問題なければ「決定」をクリック。

SS_1015

ただ、コントロールパネルから作る方法だと特権ユーザしか触れない「.htgui」「.htguipw」の2ファイルが作られて、「.htaccess」が存在しない時にのみ適用される様子でした。WordPressで「.htaccess」使うので、この方法だけだとうまく働きません。

なので「.htaccess」から「.htguipw」のユーザ情報を確認する為に「.htaccess」の頭に以下を追記します。

# アクセス制限
AuthUserFile /[フルパス]/stg.hapisupu.com/.htguipw
AuthGroupFile /dev/null
AuthName "Staging"
AuthType Basic

require valid-user

これでベーシック認証がかかるようになりました。

ベーシック認証の説明をすると長くなるので、詳しい情報は他に任せます。
アクセス制限ベーシック認証 ～パスワードでページを守ろう～

以上で、アクセス制限の説明もおしまいです。

終わりに

これでステージング環境の用意が出来ました。私は本番環境と同じサーバに置いているので、ステージング環境で問題がなければ、安心して本番に展開できるようになりました。

当サイト「はぴすぷ」は、現在は私の個人ブログでしかありませんが、今後Webサービスを提供していこうと考えているので、その準備として一歩進むことが出来ました。

まだ何をするか考えてる段階なので、いつになるか分かりませんが、期待してて下さい！

それでは。

あ、私が今利用しているレンタルサーバーに興味があれば是非検討してみてください。キャンペーンしているので、かなりお安く始められます。
お名前.comの共用サーバーSD

 - MySQL, Webサイト構築, WordPress , , ,