みっちぇのWebデザイン研究所

はてなブログのカスタマイズを中心に、ウェブデザインについて研究するブログ

トップ > PHP > PHPのローカルサーバー構築をApache2でやる方法【初心者向け】

PHPのローカルサーバー構築をApache2でやる方法【初心者向け】

PHP Apache サーバー関連

こんにちは！
WordPressを使用するため、ローカルサーバーを立ち上げるために導入したLocal by Flywheelと、VSCodeのPHPServerが喧嘩して、うまくいかず（PHPServerのパス設定がたぶんおかしい）、初心者には解決できなかったので、Apacheでサーバー構築しました。

こっちのほうがすんなりできたので記録がてら記事にしてみます。

ちなみにLocalでWordPressローカルサーバー環境を作るのはとってもカンタンだったので、WordPressのローカルサーバーを作りたい方は以下記事も参考になるかもしれません！

micche-labo.hatenablog.com micche-labo.hatenablog.com

実行環境

今回PHPの環境構築するにあたっての私の実行環境です。

PC

mac OS Catalina バージョン10.15.7

（詳細は以下画像）

f:id:micche-labo:20211027121632p:plain
MacOSの情報

エディタ

Visual Studio Code バージョン1.60.0(Universal)

インストールなどの記事は以下 micche-labo.hatenablog.com

f:id:micche-labo:20211026223438p:plain
VSCodeバージョン

PHPバージョン

PHP 7.3.11

macだと既にインストールされてる。

チェックの仕方

VSCode上のターミナルでチェックしちゃいます。

f:id:micche-labo:20211026225405p:plain
VSCodeのターミナルでPHPバージョンチェック

% php -v

と入力し、enter(return)。（bashの場合%は$に読み替えてください）

PHP 7.3.11 (cli) (built: Jun  5 2020 23:50:40) ( NTS )
Copyright (c) 1997-2018 The PHP Group
Zend Engine v3.3.11, Copyright (c) 1998-2018 Zend Technologies

macだとphpとかapacheはインストール済みだそうです。

Apache

Apache 2.4.41 (Unix)

こちらもmacだと既にインストール済み。

チェックの仕方

phpと同様にapacheもバージョンチェックしてみます。

VSCodeのターミナル上で

% httpd -v

と打ち込みenter。すると、

Server version: Apache/2.4.41 (Unix)
Server built:   Jun  5 2020 23:42:06

のように、Apacheのバージョンがわかる。

php.ini.defaultをコピーしphp.iniをつくる

% php --ini

と打つと、

Configuration File (php.ini) Path: /etc
Loaded Configuration File:         (none)
Scan for additional .ini files in: (none)
Additional .ini files parsed:      (none)

と返ってきて、Loaded Configuration File:(none)となっていることがわかります。

これは、php.iniファイルが存在しないことを意味します。

参考
qiita.com

一応Finder上でも検索してみますが、phpはインストールされているものの、やはりphp.iniはありません。

あったのは、php.ini.defaultというファイルのみ。

f:id:micche-labo:20211026231354p:plain
finderスクショ。php.ini.defaultというファイルはある

そこで、mac php.ini.defaultなどで検索してみました。

参考になる記事がいくつかでてきたのでその通りにやってみたところうまくいったので載せておきます。

  1. Finder上でphp.iniと検索
  2. php.iniがなく、php.ini.defaultがあった場合は、コピーしてphp.iniにリネームする。

この時権限がないと言われ、普通にはコピーできません。

ターミナル上で

% sudo cp /etc/php.ini.default /etc/php.ini

と打ち、PCのログインパスワードを聞かれるので入力してコピーするのが簡単で早かったです。

参考サイトには実行権をつけるコマンドも載ってました。

% sudo chmod 644 /etc/php.ini

chmodについて補足
664でrw-r--r--という意味。
rwは読み書き可能。
r--は読み込みのみ可能という意味。
読み方は、3文字ずつ区切ってみる。
最初の3文字が所有者、つぎの3文字がグループ、最後の3文字がその他に与えられる権限である。

chmodコマンドについての参考サイト様
qiita.com

php.iniについての参考サイト様

qiita.com

syslog.life

認識されたかチェックしてみます。

% php --ini

入力後enter(return)。

Configuration File (php.ini) Path: /etc
Loaded Configuration File:         /etc/php.ini
Scan for additional .ini files in: (none)
Additional .ini files parsed:      (none)

ここまででphp.iniファイルを作って認識させることができました。

Apacheを起動してみる

ここまでで一旦ローカルサーバーを立ち上げてみます。

% sudo apachectl start

で、ローカルサーバーが起動します。

ブラウザのアドレスバーに

http://localhost/

と入力します。

すると、デフォルトで

Library/WebServer/Documents/index.html.en

が開き、ブラウザ上に

It works!と表示されます。

Apacheを再起動するには、ターミナルで

% sudo apachectl restart

Apacheを停止するには、ターミナルで

% sudo apachectl stop

と打ち込みエンターキーを押せばOK。

httpd.confを編集する

編集と言っても、ほとんどコメントアウトを消すだけなので簡単です。

コメントアウトを消す以外の作業だと、さきほどアクセスしたhttp://localhost/の参照するディレクトリを変更します。

注意

httpd.confは二つあり、片方は/original/http.confにあるが、こっちはバックアップ用のファイルなので触らない。

コードを変更するのは、apache2フォルダ（ディレクトリ）直下のhttpd.conf。

サーバー起動用フォルダを設定する

Check!

後述するユーザーディレクトリを設定するならこの設定はしてもしなくても。

http://localhost/でアクセスした際のフォルダ指定です。

たとえばサーバー起動用フォルダをSitesとした場合。

ディレクトリは画像の通り。
/User/ユーザー名/Sites/index.phpのように、フォルダの中にindex.phpファイルを作って置いておく。

f:id:micche-labo:20211027001600p:plain
Sitesフォルダ内にindex.phpファイルを置く
/private/etc/apache2/httpd.confを編集する。

▲macのプレビューで画像作ったらなぜか文字が消える現象に悩んでます。すみません…。
Sitesフォルダ内に、の続きはindex.phpファイルを作る、です。

/private/etc/apache2/httpd.confを開いて編集します。

ちなみにVSCodeだと実行権なくても、パスワードを聞かれた後、保存できるので便利です。

編集前

DocumentRoot "/Library/WebServer/Documents"
<Directory "/Library/WebServer/Documents">

編集後

DocumentRoot "/Users/ユーザー名/Sites"
<Directory "/Users/ユーザー名/Sites/">

（ほかのフォルダがよければそのフォルダのパスを入れる）

この時点で一旦

% sudo apachectl restart

でサーバーを再起動すると、お目当てのフォルダに配置したindex.phpがブラウザで起動したhttp://localhostで表示されてるかと思います。

ちなみにindex.phpがないとエラーでます。

が、フォルダ一覧を表示するようにしてそこからクリックしてindex.phpを開くこともできます。（セキュリティ的に良くないらしいのでローカル環境でのみ使用。）

httpd.confの268行目

編集前 Options FollowSymLinks Multiviews を

編集後 Options Indexes FollowSymLinks Multiviews

とすることで

f:id:micche-labo:20211027004338p:plain
localhost内のフォルダ一覧

画像のようにフォルダ内が一覧表示され、クリックすることでフォルダ内のindex.phpが表示できます。

後述のユーザーディレクトリを使用するなら、ユーザー名.confにOption設定を別途追加することで、http://localhost/~ユーザー名/でアクセスした時にのみOptionを有効にすることもできます。

その場合は何を追加したかわかるよう+オプション内容とするのが良いみたいです。（+を書かずに追加すると上書きされるようです）

Optionについての参考サイト様 www.javadrive.jp

PHPを使えるようにコメントアウトを消す

編集前

#LoadModule php7_module libexec/apache2/libphp7.so

を

編集後

LoadModule php7_module libexec/apache2/libphp7.so

のように#を消して有効に。

Check

php7の番号はバージョンによって異なります。

phpファイルが拡張子htmlでも動作するように設定

編集前

ddType application/x-compress .Z
AddType application/x-gzip .gz .tgz

この2行の下に、1行加えて

編集後

ddType application/x-compress .Z
AddType application/x-gzip .gz .tgz
AddType application/x-httpd-php .php .html

のようにする。

と、index.htmlに書いたphpもきちんと認識され、ブラウザで確認することができるようになります。

f:id:micche-labo:20211027003919p:plain
htmlファイル内に書いたphpが認識

複数のローカルサーバー（バーチャルホスト）を立てる

さて、このやり方で指定したフォルダ内に作ったindex.phpもしくはindex.htmlでプログラムを書いてもいいんですが（基礎的な勉強ならそれで十分）、これだとphp実行フォルダが変わるたびに設定をいじらなくてはならず面倒です。

/Users/ユーザー名/Sites

内に必要サイト分フォルダを作り、その中にindex.htmlやindex.phpを作ってhttp://localhost/~ユーザー名/フォルダ名/でアクセスする…でもいいかもしれませんが、本番環境に移すときに、パスが異なりうまくいかなかったりすることもあるので、ユーザーディレクトリ（フォルダ）を作り、バーチャルホストを立てようと思います。

また、アドレスを簡単なものに設定できるので、アクセスする際に「あれ？なんだっけ？」とならずに済むのでおすすめです。

バーチャルホストについて
バーチャルホストは、一台のサーバーで仮想的に複数のドメインを運用するサーバー技術の一種で、主にメールサーバーやWebサーバーなどで利用されています。
バーチャルホスト機能を利用することで、1つのサーバー上で複数ドメインを同時に運用することができるようになります。
用語集｜バーチャルホスト

ユーザーディレクトリを作る

ホームディレクトリにSitesという名前でフォルダを作り、ユーザー名.confファイルに設定を記述すると、

localhost/~ユーザー名/

でアクセスできるようになります。

ユーザー名.confは、/private/etc/apache2/users/内に作ります。

さきほど「サーバー起動用フォルダを設定する」の項目で既にホームディレクトリにSitesフォルダを作ってある方はそのまま進んでください。
作ってない方は、作ってから進んでください。

設定ファイルに記述する

hogeという名前のユーザーだった場合。

hoge.confファイルを作って開き、

<Directory "/Users/hoge/Sites/">
    AllowOverride All
    Options Indexes MultiViews
    Options +FollowSymLinks
    Require all granted
</Directory>

と記入し保存します。

AllowOverride Allですべてのディレクティブの設定を許可する設定。

対象のディレクトリに設置した .htaccessで設定を変更することができるディレクティブの種類を設定することができます
AllowOverrideディレクティブ：.htaccessを使った設定の上書きを許可する | Let'sプログラミング

Optionsの項目は以下。

項目 意味
Indexes ファイル一覧の表示を行う
MultiViews コンテントネゴシエーションを有効にする
FollowSymLinks シンボリックリンクをたどることを許可する

さきほどhttpd.confでOptions Indexes FollowSymLinks Multiviewsと設定した場合は、Option設定はなくてもいいです。（設定が被ってるので）

Require all grantedですべてのアクセスを許可する設定。

※<Directory "/Users/hoge/Sites/">内のSitesはSites以外だとエラーが出るのでSitesにしてください。

※hogeは全て、PCでログイン中のユーザー名に変えてください。

ユーザーディレクトリ・バーチャルホストの有効化

httpd.confを開き、183行目の

#LoadModule userdir_module libexec/apache2/mod_userdir.so

と、521行目の

#Include /private/etc/apache2/extra/httpd-userdir.conf

と、ついでにバーチャルホスト用の設定で527行目の

#Include /private/etc/apache2/extra/httpd-vhosts.conf

のコメントアウト#を消します。

SSIを有効化したい場合

SSIを有効化したい場合は458行目と459行目の

編集前

#AddType text/html .shtml
#AddOutputFilter INCLUDES .shtml

コメントアウト#を消し、AddOutputFilterに.htmlを追加します。

編集後

AddType text/html .shtml
AddOutputFilter INCLUDES .shtml .html

となればOKです。

SSIとは
htmlファイル内で<!---->でコメントアウトすると、通常は見えない要素となるが、SSIを使用することで意図したコードを埋め込むことができる。
サーバへの負荷やセキュリティ上の問題から、レンタルサーバーによっては使用できないこともある。

参考 SSIの仕組みと有効化・制限の設定 | @IT

httpd-userdir.confの編集

次にhttpd-userdir.confを開きます。
場所は画像を参考に、/apache2/extra/内を探してみてください。

f:id:micche-labo:20211027104515p:plain
httpd-userdir.confの場所

16行目の

#Include /private/etc/apache2/users/*.conf

のコメントアウト#を消し、有効化します。

f:id:micche-labo:20211027104806p:plain
httpd-userdir.confの#を消す

アクセスしてみる

ここまでで一旦ターミナルにsudo apachectl restartで再起動し、ブラウザでhttp://localhost/~ユーザー名/を開いてみましょう。

f:id:micche-labo:20211027110432p:plain
http://localhost/~ユーザー名/でアクセス

フォルダ内のindex.phpか、もしくは上記画像のように、フォルダ一覧が表示されたかと思います。

バーチャルホストの設定

次に、それぞれのフォルダにローカルサーバーのアドレスを振り分けていきます。

現在、Sitesディレクトリ内には

  • php-test
  • testsite

というディレクトリがあります。

それぞれ、

  • php-testはhttp://php-test:8082/でアクセスできるように設定
  • testsiteはlocal.testsite.comでアクセスできるように設定

していきます。

  1. httpd-vhost.confファイルへ追記
  2. hostsファイルへ追記
  3. Apache再起動
  4. ローカルサーバーを開く

の順で進めていきます。

httpd-vhost.confファイルへ追記

httpd-vhost.confファイル内に、対象となるディレクトリとアクセスする際のアドレスを記入します。

private/etc/apache2/extra/内からhttpd-vhost.confを探し、VSCodeで開きます。

すでに色々とサンプルが書いてあると思いますので、その下に以下を追記します。

#php-test:8082でアクセスするための設定
Listen 8082
<VirtualHost *:8082>
DocumentRoot "/Users/ユーザー名/Sites/php-test"
ServerName php-test
</VirtualHost>

NameVirtualHost *:80
#local.testsite.comでアクセスするための設定
<VirtualHost *:80>
  DocumentRoot "/Users/ユーザー名/Sites/testsite"
  ServerName local.testsite.com
</VirtualHost>

#以下はlocalhostという名前でアクセスした時の設定
<VirtualHost *:80>
ServerName localhost
DocumentRoot "/Users/ユーザー名/Sites/"
</VirtualHost>

以下の画像も参考にしてみてください。

f:id:micche-labo:20211027115501p:plain
httpd-vhostの設定

hostsファイルへ追記

httpd-vhostに記入した内容と合わせてhostsファイルも編集します。

/private/etc/内にhostsはあります。

Finderで探すには、上部バーから移動をクリックし、フォルダを移動をクリックし、/private/etc/を検索します。

もしくはFinderを開いた状態でShift + Command + Gで/private/etc/を検索します。

f:id:micche-labo:20211027113924p:plain
Finderを開き、移動クリック、フォルダを移動クリック

f:id:micche-labo:20211027114204p:plain
/private/etc/と入力し、検索

開いたら以下を追加記入します。

127.0.0.1 php-test
::1 php-test

127.0.0.1 local.testsite.com

ここまでで設定は完了です。

Apacheを再起動

ターミナルでsudo apachectl restart入力しエンター。

ブラウザで確認

http://local.testsite.com/や、http://php-test:8082/でアクセスし、無事にindex.phpやindex.htmlが表示されていたら成功です。

f:id:micche-labo:20211027120800p:plain
ブラウザで確認！

お疲れ様でした。

まとめ

はじめは便利なツールがいろいろあるし、頼ってみようとおもいましたが、ググっているうちにファイルを直接編集した方がはやく、わかりやすかったので今回ご紹介しました。

私も記事にまとめながら、初心者ながらに整理できたので、よかったです。

なにかおかしい記述・間違いあればご指摘くださると助かります。

ではでは。