Web Design Leaves

作成日：2020年4月13日

XAMPP のダウンロード

XAMPP のダウンロードページ（https://www.apachefriends.org/download.html）に Mac 版のリストがあります。

XAMPP for OS X と XAMPP-VM（VM 版）の複数のバージョンが表示されています。サイズの軽いほうが XAMPP for OS X になります。

ファイル名は例えば、xampp-osx-7.4.4-0-installer.dmg のように最後が -installer.dmg となっています（VM 版の方は 最後が -vm.dmg となっています）。

使用したいバージョンのダウンロードボタン Download (64bit) をクリックするとファイルをダウンロードすることができます。

XAMPP のインストール

ダウンロードしたインストーラのファイル（例：xampp-osx-7.4.4-0-installer.dmg）をダブルクリックすると以下が表示されるので、XAMPP.app をダブルクリックします。

以下が表示されるので「開く」をクリックします。

パスワードを求められるので入力して「OK」をクリックします。

「Next」をクリックします。

インストールするコンポーネントの選択画面が表示されるので、特に理由がなければデフォルトのまま「Next」をクリックします。

/Applications/XAMPP フォルダにインストールされると表示されるので「Next」をクリックします。

以下の画面が表示されます。「Learn more about Bitnami for XAMPP」にチェックが入っているとその説明が表示されるので、チェックを外して「Next」をクリックします。

XAMPP のインストール開始の確認画面が表示されるので、「Next」をクリックするとインストールが開始されます。

インストールには少なくとも数分はかかります。

しばらくするとインストールが完了して以下のような表示になります。

「Launch XAMPP」にチェックが入っている状態で「Finish」をクリックすると XAMPP が起動します。

Manage Servers のタブをクリックすると、Apache や MySQL を停止したり起動することができます。

また、インストールが完了するとアプリケーションフォルダ（Applications）には XAMPP のフォルダが作成されています。

XAMPP フォルダの中は以下のようになっていて、XAMPP の起動（manager-osx.app）のショートカットなどが入っています。

• manager-osx.app のエイリアス：ダブルクリックすると XAMPP を起動します
• bin や htdocs などのエイリアス：それぞれのフォルダへのショートカット
• xamppfiles フォルダ：実際の bin や htdocs などのフォルダが格納されているフォルダ
• uninstall.app：XAMPP の削除に使うアンインストーラー

xamppfiles フォルダの中には以下のようになっています。

XAMPP の使い方

LaunchPad の「XAMPP（その他）」というフォルダの manager-osx や /Applications/XAMPP/manager-osx.app または /Applications/XAMPP/xamppfiles/manager-osx.app をダブルクリックすることで XAMPP を起動することができます。

XAMPP を起動すると Application Manager が開きます。

右下の「Go to Application」をクリックすると、ブラウザが起動して XAMPP のダッシュボード（http://localhost/dashboard/）が開きます。

右上の「PHP Info」をクリックすると、PHP Info のページが開くので システムや Apache、PHP、MySQL（Maria DB）の各種情報を確認することができます。

「phpMyAdmin」をクリックすると phpMyAdmin が開きます。

但し、まだ MySQL Database（Maria DB）を起動していない場合は、以下のように接続エラーのページが表示されます。

バーチャルホストの設定

例えば、ローカル環境（MAMP や XAMPP）で htdocs に example と言うフォルダを配置してブラウザでアクセスする場合、通常 http://localhost/example/ と言う URL になります。

これを http://example.localhost/ と言う URL でアクセスできるようにするにはバーチャルホストと言う機能を利用します。

# Virtual hosts
#Include etc/extra/httpd-vhosts.conf

# Virtual hosts
Include etc/extra/httpd-vhosts.conf

# VirtualHost example:
# Almost any Apache directive may go into a VirtualHost container.
# The first VirtualHost section is used for all requests that do not
# match a ServerName or ServerAlias in any <VirtualHost> block.
#
<VirtualHost *:80>
    ServerAdmin webmaster@dummy-host.example.com
    DocumentRoot "/Applications/XAMPP/xamppfiles/docs/dummy-host.example.com"
    ServerName dummy-host.example.com
    ServerAlias www.dummy-host.example.com
    ErrorLog "logs/dummy-host.example.com-error_log"
    CustomLog "logs/dummy-host.example.com-access_log" common
</VirtualHost>

<VirtualHost *:80>
    ServerAdmin webmaster@dummy-host2.example.com
    DocumentRoot "/Applications/XAMPP/xamppfiles/docs/dummy-host2.example.com"
    ServerName dummy-host2.example.com
    ErrorLog "logs/dummy-host2.example.com-error_log"
    CustomLog "logs/dummy-host2.example.com-access_log" common
</VirtualHost>

<VirtualHost *:80>
    DocumentRoot "/Applications/XAMPP/xamppfiles/htdocs/example"
    ServerName example.localhost
</VirtualHost>

<Directory "/path/to/directory"> #上記と同じパス
  order deny,allow
  allow from ALL
</Directory>

private
└── etc
    └── hosts

##
# Host Database
#
# localhost is used to configure the loopback interface
# when the system is booting.  Do not change this entry.
##
127.0.0.1	localhost
255.255.255.255	broadcasthost
::1             localhost

##
# Host Database
#
# localhost is used to configure the loopback interface
# when the system is booting.  Do not change this entry.
##
127.0.0.1	localhost
255.255.255.255	broadcasthost
::1             localhost
127.0.0.1	example.localhost
127.0.0.1	foo.localhost #必要なだけ追加します

sudo /Applications/XAMPP/xamppfiles/bin/apachectl restart
Password: # パスワードを入力

Error 403 / Access Forbidden

以下は今回 Mac に XAMPP（7.4.4）をインストールして使用した際に発生した問題とその解決策です。

特定のディレクトリで 403 エラーが発生してページを表示することができない現象が発生しました。ページへアクセスすると以下のように表示されてしまいます。

また、WordPress をインストールする際に「wp-config.php ファイルに書き込みできません」という現象も発生しました。

上記に関しては wp-config.php を手動で作成して WordPress をインストールすることはできましたが、アップデートやプラグインをインストールしようとすると以下のような FTP 情報入力画面が表示されてしまいました。

アクセス権限の問題のようなので chmod コマンドでパーミッションの変更をしたり、chown コマンドでファイルの所有者を変更してみましたが現象は変わりませんでした。

<IfModule unixd_module>
#
# If you wish httpd to run as a different user or group, you must run
# httpd as root initially and it will switch.  
#
# User/Group: The name (or #number) of the user/group to run httpd as.
# It is usually good practice to create a dedicated user and group for
# running httpd, as with most system services.
#
User daemon
Group daemon
</IfModule>   

<IfModule unixd_module>
#
# If you wish httpd to run as a different user or group, you must run
# httpd as root initially and it will switch.  
#
# User/Group: The name (or #number) of the user/group to run httpd as.
# It is usually good practice to create a dedicated user and group for
# running httpd, as with most system services.
#
User foo 
Group daemon
</IfModule>   

phpMyAdmin エラー

おそらく上記の変更により、今度は phpMyAdmin で以下のエラーが発生。

ls コマンドで確認すると以下のようになっていました。

ls -al /Applications/XAMPP/xamppfiles/phpmyadmin/tmp
total 0
drwxrwxr-x    3 root    daemon    96  4 13 14:33 .
drwxrwxr-x  118 root    admin   3776  4 13 16:29 ..
drwxr-x---   24 daemon  daemon   768  4 13 14:33 twig

前項のエラーの対処で daemon を foo に変更したのが原因の可能性があるので、chown コマンドで phpmyadmin/tmp/twig のオーナーを Mac ユーザ（この例の場合は foo）に変更したらエラーが解消されました。こちらもこの方法が正しい解決方法かどうかは定かではありません。

sudo chown foo /Applications/XAMPP/xamppfiles/phpmyadmin/tmp/twig

ls -al /Applications/XAMPP/xamppfiles/phpmyadmin/tmp
total 0
drwxrwxr-x    3 root    daemon    96  4 13 14:33 .
drwxrwxr-x  118 root    admin   3776  4 13 16:29 ..
drwxr-x---   24 foo     daemon   768  4 13 14:33 twig  #変更