Vagrantで仮想マシンに接続＆Webサーバを立ち上げてみよう

Tweet

Pocket

1. Macに『Vagrant + VirtualBox』を導入する手順
2. Windowsローカル開発環境を『Vagrant + VirtualBox』で作ってみよう
3. Vagrantを使ってみよう！Boxの取得から起動・停止・削除まで
4. 『Vagrant Cloud』を利用してVagrantのBoxを追加してみよう
5. Vagrantで仮想マシンに接続＆Webサーバを立ち上げてみよう <- 本記事
6. Vagrantで作成した環境を「コピー＆配布して他人と共有する」方法
7. 『Vagrant+VCCW』でWordPressローカル環境を構築してみよう
8. 本番環境のWordPressサイトを『VCCW+WordMove』でローカルと同期！

こんにちは、okutani(@okutani_t)です。ローカル開発環境の構築には、よくXAMPP・MAMPなどが使われていますね。

今回はXAMPP・MAMPを使わずに、最近流行りの「Vagrant」を使うことで、かんたんにローカル開発環境下でWebサーバーを立ち上げるまでを紹介しています。

前回の記事で、Vagrantの導入方法など解説しています。記事冒頭のSeriesリンクから辿ってみてください。

では、仮想マシンに接続＆Webサーバーの立ち上げ方法をみていきましょう。

スポンサーリンク

仮想マシンに接続する

では仮想マシンに接続してみましょう。

ログイン

下記コマンドを初期化をおこなったディレクトリ上で入力。

$ vagrant ssh

sshで仮想マシンに接続出来ました。pwdコマンドでホームディレクトリを確認すると「/home/vagrant」と表示されています。

ログアウト

仮想マシンからログアウトするには下記コマンドを入力。

$ exit

では、仮想マシンにもう一度接続して、Webサーバーを構築していきましょう。

WEBサーバーを導入する

下記コマンドでWEBサーバーを導入します（前回の記事のとおり、OSはCentOS6.4）。

$ sudo yum -y install httpd

sudoは管理者権限で実行、yumはLinuxで使うパッケージのインストールコマンドです。上記コマンドでhttpdをインストールしました。

下記コマンドでWEBサーバーを立ち上げます。

$ sudo service httpd start

[OK]と出て、無事にWEBサーバーが立ち上がりました。

下記のコマンドを入力しておくと、仮想マシンを再起動した時に自動的にWEBサーバーが立ち上がります。

$ sudo chkconfig httpd on

またローカルで開発環境を構築するので、設定に邪魔なファイアウォールをOFFに。さらに再起動時にもファイアウォールをOFFにする設定をおこないましょう。

$ sudo service iptables stop
$ sudo chkconfig iptables off

index.htmlを配置してブラウザで確認する

CentOSでは「/var/www/html」に公開するWEBサイトを配置します。htmlディレクトリに移動しましょう。

$ cd /var/www/html

index.htmlファイルをviコマンドで作成します。

$ sudo vi index.html

viを使ったことがない方は下記の通り入力しましょう。

index.htmlファイルを作成した後、exitコマンドで仮想マシンからログアウトします。

$ exit

その後、仮想マシン作成時に生成されている「Vagrantfile」にネットワークの設定を記述します。

$ vi Vagrantfile

29行目あたりにある「# config.vm.network “private_network”, ip: “192.168.33.10”」の先頭の「#」を削除することで「192.168.33.10」からindex.htmlにアクセスできるようになります。

Vagrantfileの設定を反映させるため、仮想マシンを再起動します。少し時間がかかります。

$ vagrant reload

再起動後、ブラウザでindex.htmlを確認してみましょう。ブラウザのアドレスバーに「192.168.33.10」と入力。

ブラウザに「Hello!Vagrant」と表示されているのが確認できました。

仮想マシンに接続せずにファイルを更新

sshで仮想マシンに接続してindex.htmlを作成しましたが、仮想マシン初期化時のディレクトリと、仮想マシン上のvagrantディレクトリはリンクしています。

今回、myCentOSVMディレクトリ上で初期化したので、そこにindex.htmlを作成し、「vagrant」ディレクトリと「var/www/html」ディレクトリをリンクすれば、ログインせずにファイルの作成・編集ができて便利です。

$ vagrant ssh
$ sudo rm -rf /var/www/html

上記コマンドで先ほど作成したindex.htmlを削除しておきます。

$ sudo ln -fs /vagrant /var/www/html
$ exit

上記コマンドでリンクさせてからログアウトしました。

では、index.htmlをmyCentOSVMディレクトリ直下で作成してみましょう。

$ vi index.html

hello!myVagrantと書き込んで保存。

ssh接続せずにindex.htmlファイルを作成、反映できました。

IPアドレスとホスト名を紐付けるプラグインを導入

ここで「vagrant-hostsupdater」というプラグインを導入しておくと、サイトを表示する際に「http://192.168.33.10」というIPアドレスでのアクセスが「http://my-vagrant.com」といったホスト名でアクセスができるようになります。

とても便利なので導入しておきましょう。

一度仮想マシンを終了させます。

$ vagrant halt

下記コマンドで導入。

$ vagrant plugin install vagrant-hostsupdater

※正確にいうとvagrant-hostsupdaterは仮想マシンを立ち上げた際に、ホストOSの/etc/hostsにVagrantfileの設定に合わせて書き換えます。仮想マシン終了時に自動で起動前のhostsの設定に戻ります。

Vagrantファイルにホスト名を記述

導入後、Vagrantfileの「config.vm.network “private_network”, ip: “192.168.33.10”」の下あたりにホストの設定を記述します。

今回は「myvagrant.com」としていますが、お好きな文字列を利用できます。

config.vm.network "private_network", ip: "192.168.33.10”
config.vm.hostname = "myvagrant.com"

Vagrantfileを保存、「vagrant up」で起動。

その後「myvagrant.com」にブラウザからアクセスしてみましょう。

無事、自分で設定したホスト名でアクセスできました。

Vagrantを使った仮想マシンの接続＆Webサーバーの立ち上げ方法は以上です。

おまけ: vagrant sshを簡略化する

vagrantへのSSH接続は、わざわざVagrantfileのあるディレクトリまで移動してコマンドを打たないといけないため、少々めんどうです。

次のコマンドを実行しておくと、その手間を省いてくれます。

参考Vagrant ssh-configでvagrant sshを快適にする – Qiita

$ cd Vagrantfileまでのパス
$ vagrant ssh-config --host myvagrant >> ~/.ssh/config

今回はmyvagrantにしましたが、任意の名前をつけられるのでお好きにつけてみてください。

こうすることで、どこのディレクトリにいても下記コマンドで仮想マシンにアクセスできます。

$ ssh myvagrant

これでより便利にVagrantが使えるようになりました。参考にしてください。

まとめ

仮想マシンにsshで接続した後、WEBサーバを立ち上げてブラウザから確認しました。

ホスト名をつけると作成中のWEBサイトの確認がしやすくなるので、vagrant-hostsupdaterはぜひ導入してみましょう。

1. Macに『Vagrant + VirtualBox』を導入する手順
2. Windowsローカル開発環境を『Vagrant + VirtualBox』で作ってみよう
3. Vagrantを使ってみよう！Boxの取得から起動・停止・削除まで
4. 『Vagrant Cloud』を利用してVagrantのBoxを追加してみよう
5. Vagrantで仮想マシンに接続＆Webサーバを立ち上げてみよう <- 本記事
6. Vagrantで作成した環境を「コピー＆配布して他人と共有する」方法
7. 『Vagrant+VCCW』でWordPressローカル環境を構築してみよう
8. 本番環境のWordPressサイトを『VCCW+WordMove』でローカルと同期！

Tweet

Pocket

okutani (okutani_t) のヒトコト

okutani_t

ちなみにVagrantfileは一度設定をおこなえば、vagrant destroyで仮想マシンを削除してもすぐに同じ環境を作ることができるので便利です。参考にしてください。

Web開発のお仕事を募集しています