Vagrant+VirtualBox+CentOS7環境構築 ~ローカルのプロジェクトをブラウザに表示するまで~

7939 ワード
環境構築 VirtualBox Mac Vagrant Laravel Mac テキストリンク

はじめに

Vagrantの環境を構築し、ローカルのプロジェクトをブラウザに表示させるまでの記事です。

実行環境

MacOS 10.15.5
Vagrant 2.2.9

目次

-Vagrant環境構築
　-Vagrantインストール
　-VirtualBoxインストール
　-Box CentOS/7の追加
　-Vagrantの初期化
　-仮想環境の起動

-プロジェクトをブラウザに表示
　-Vagrantとプロジェクトの同期
　-Apacheのインストールと接続
　-ドキュメントルートの編集

Vagrant環境構築

1.Vagrantインストール

公式：https://www.vagrantup.com/downloads.html

詳しい手順は、こちらの記事を参考に。
https://qiita.com/ta98/items/a2596217a886c900b124

2.VirtualBoxインストール

公式：https://www.virtualbox.org/wiki/Downloads

詳しい手順は、こちらの下記を参考に。
https://qiita.com/ta98/items/e155e77bd118beaacb3f

3.Boxの追加

ターミナルを起動して、任意の場所に「MyVagrant」ディレクトリを作成し、移動します。

Boxファイルのダウンロード

$ vagrant box add centos/7

実行すると、下記のような表示になります。

$ vagrant box add centos/7
==> box: Loading metadata for box 'centos/7'
    box: URL: https://vagrantcloud.com/centos/7
This box can work with multiple providers! The providers that it
can work with are listed below. Please review the list and choose
the provider you will be working with.

1) hyperv
2) libvirt
3) virtualbox
4) vmware_desktop

Enter your choice:

3を入力し、実行します。

Boxの追加が完了しているかを確認します。
Boxを一覧表示させるコマンドを実行し、

$ vagrant box list

次のように、追加したBoxが一覧に表示されていれば完了です。

$vagrant box list
centos/7 (virtualbox, 2004.01)

4.Vagrantの初期化

vagrantを初期化するコマンドを実行します。

$ vagrant init centos/7

「My Vagrant」ディレクトリ内に、「Vagrantfile」ファイルが作成されていれば完了です。

5.仮想環境の起動

「Vagrantfile」ファイルが存在するディレクトリで、Vagrantの仮想マシンを起動するコマンドを実行します。

$ vagrant up

起動した仮想環境にはsshで接続します。

$ vagrant ssh

#実行後、下記のような表示になります。
[vagrant@localhost ~]$

仮想環境からログアウトする場合は、下記のコマンドを実行します。

[vagtant@localhost]$ exit

仮想マシンの停止は下記のコマンドです。

$ vagrant halt

以上で、Vagrantの環境構築は完了です。

プロジェクトをブラウザに表示

ここからは、ローカルのプロジェクトをVagrantからブラウザに表示させる手順です。

「MyVagrant」配下に、プロジェクトを設置します。(今回はtestプロジェクトとします)

1.Vagrantと同期設定

ゲスト0S: /test/
ホスト0S: /var/www/html/test/

Vagrantとローカルプロジェクトを同期していきます。
まず、下記コマンドで「Vagrantfile」を開き、

$ vi Vagrtantfile

ゲストOSとホストOSを同期させるパスを設定します。
１つ目のパラメーターがホストOS、２つ目のパラメーターがゲストOSです。

#変更前
#config.vm.synced_folder "./data", "/vagrant_data"
↓
#変更後
config.vm.synced_folder "test/", "/var/www/html/test/"

#次の章で必要になってくるので、コメントアウトを外しておきます。
#config.vm.network "private_network", ip:"192.168.33.10"
↓
config.vm.network "private_network", ip:"192.168.33.10"

保存したら、Vagrantを再起動します。

$ vagrant reload

再起動が完了したら、同期が完了しているかを確認します。

#仮想環境にログイン。
$ vagrant ssh

#ホスト0Sで指定したディレクトリに移動。
[vagrant@localhost]$ cd /
[vagrant@localhost]$ cd var/www/html

#配下に指定したディレクトリが作成されているか確認。
[vagrant@localhost]$ ls
test

testディレクトリ内で任意のファイルを作成してみます。ローカルにも反映されることが、Finderなどで確認できれば完了です。

2.Apacheのインストールと接続

仮想環境にログインした状態で、Apacheのインストールから、ブラウザでの接続確認までを行います。

#Apacheのインストール
[vagrant@localhost]$ sudo yum install httpd

#一度ログアウトし、Vagrantを再起動します。
[vagrant@localhost]$ exit
$ vagrant reload

#Vagrant再起動後、ログインし、サーバーを起動。
$ vagrant ssh
[vagrant@localhost]$ sudo service httpd start

#仮想マシン起動時、自動的にサーバーが立ち上がるように設定しておきます。
[vagrant@localhost]$ sudo chkconfig httpd on

ブラウザで192.168.33.10にアクセスしてみます。
下記のような、Apacheのテストページが表示されていれば完了です。

3.ドキュメントルートの編集

最後に、ドキュメントルートを編集し、指定のプロジェクトがブラウザ上に反映されるようにします。

[vagrant@localhost]$ sudo vi /etc/httpd/conf/httpd.conf

#ファイル内のドキュメントルートを編集。
DocumentRoot "/var/www/html
↓
DocumentRoot "/var/www/html/test/

#一度ログアウトし、Vagrantを再起動します。
[vagrant@localhost]$ exit
$ vagrant reload

#Vagrant再起動後、ログインし、サーバーを起動。
$ vagrant ssh
[vagrant@localhost]$ sudo service httpd start

192.168.33.10にアクセスし、プロジェクトページが表示されれば、完了です。

補足:アクセスすると、Forbiddenエラーが表示される場合

「SELinuxのコンテキスト」の不一致が原因と考えられます。
詳細に関しては、下記記事が参考になると思います。
https://wemo.tech/1590

編集箇所は次のとおりです。

[vagrant@localhost]$ sudo vi /etc/selinux/config

#ファイル内の下記を修正
SELINUX=enforcing
↓
SELINUX=disabled

Vagrantとサーバーの再起動を行って下さい。

#ログアウトと再起動
[vagrant@localhost]$ exit
$ vagrant reload

#ログインと、サーバーの再起動
$ vagrant ssh
[vagrant@localhost]$ sudo systemctl restart httpd

おわりに

ご覧いただき、ありがとうございました。
修正箇所、ご指摘等ございましたらご意見いただけますと幸いです。

参考記事

https://qiita.com/ta98/items/5a3f77154aabaf9b8838
https://webbibouroku.com/Blog/Article/vagrant
https://wemo.tech/1590
https://qiita.com/niki-tstk/items/e2cecff58fd97efd7ad1