XAMPP7.0.9ポータブル(zip)版でWeb開発環境の構築メモ

#PHP7に対応したローカル開発環境を作りたい


同一のPC上に[XAMPP](https://www.apachefriends.org/jp/index.html)のv5.6.24(PHP5.6.24)のローカル開発環境とは別に、PHP7に対応したXAMPP環境を作りたい

-今後、別のバージョンのXAMPPをインストールすることを見越してzip版にする
-本投稿の設定方法では、バージョンの異なるXAMPPを同時に起動しないことを前提とする

##構築環境
OS：Windows10 64bit
CPU：Corei3
メモリ：8GB
構築するWEB開発環境：XAMPP7.0.9ポータブル版32bit(XAMPPは64it版がない)

#XAMPP7.0.9ダウンロード

[XAMPP](https://www.apachefriends.org/jp/index.html)のサイトへいく
ポータブル版(zip版)をダウンロードする時は上部メニューの「ダウンロード」をクリック

![image](https://qiita-image-store.s3.amazonaws.com/0/115516/d5724b25-77a2-4417-f063-d2789dd824d2.png)

ダウンロードボタンをクリックすると、インストール版がダウンロードされてしまうので、「さらにダウンロード」をクリック

![image](https://qiita-image-store.s3.amazonaws.com/0/115516/768d6069-d071-f1e4-b8be-b4baf8097adc.png)

「XAMPP Windows」をクリック

![image](https://qiita-image-store.s3.amazonaws.com/0/115516/50a78a10-8797-fcca-9e9c-a5043f2ecc4c.png)

「7.0.9」をクリック

![image](https://qiita-image-store.s3.amazonaws.com/0/115516/40f29928-fb53-a20e-be04-65f260ef9fcc.png)

zip版であることを確認して「xampp-portable-win32-7.0.9-1-VC14.zip」をクリック
(7zでもOKです。このあたりはお好みで)

![image](https://qiita-image-store.s3.amazonaws.com/0/115516/eb8ef737-5f1f-782e-50fa-780391a3f2a3.png)

#XAMPPの設置
##解凍して任意のフォルダに入れる
今回は、Cドライブ直下に「xampp_7_0_9-1」を作成(他のバージョンと混同しないように)し、その中に解凍したファイル群を入れる。

![image](https://qiita-image-store.s3.amazonaws.com/0/115516/203e73c8-3912-6546-59d1-81d10c356d24.png)

↓

![image](https://qiita-image-store.s3.amazonaws.com/0/115516/1ddd204d-df28-0d1f-7a84-af4889455329.png)

##フォルダの位置関係情報修正
setup_xampp.bat を実行(C:\xampp以外のフォルダにxamppを入れた場合は実行必要)
フォルダの位置関係に関する情報がインストールディレクトリのものに修正される

![image](https://qiita-image-store.s3.amazonaws.com/0/115516/e4b28f5f-296a-d7a0-0ddd-09815d8958ea.png)

##コントロールパネル
コントロールパネルの起動
C:\xampp_7_0_9-1\xampp-control.exe　をダブルクリック
言語の選択ダイアログが表示されるのでいずれか選んで保存(大抵はデフォルトの英語だと思いますが。。)

![image](https://qiita-image-store.s3.amazonaws.com/0/115516/b13f9ba4-dc88-ed71-eac9-85ba1487bb49.png)

##ApacheとMySQLを起動
コントロールパネルが起動したら、ApacheとMySQLの「Start」ボタンをクリック

![image](https://qiita-image-store.s3.amazonaws.com/0/115516/e281c0c0-9528-dc6e-8ca5-b1c744cdd52d.png)

ファイアウォールの警告がポップアップされた場合は「プライベートネットワーク」にチェックしてアクセスを許可

![image](https://qiita-image-store.s3.amazonaws.com/0/115516/bb90349d-55cc-98a2-0c7f-d2dbcd3dd43d.png)

起動成功！

![image](https://qiita-image-store.s3.amazonaws.com/0/115516/1b91309e-8019-0e33-faad-569bbf8cd7f9.png)

##ポート80の競合エラーが発生した際の対処
※下記のような、ポート80を利用中のエラーが出たら、競合したアプリのポートを変更。
(skypeをインストールしている場合は、skypeのデフォルトポートも80なので、そちらとかぶっている可能性が高い。)

※XAMPPのApacheのポートを80以外に変更してポート競合を回避する方法もあるが、今回は説明から省略

![image](https://qiita-image-store.s3.amazonaws.com/0/115516/83fb7f41-3891-9d4f-5b44-7ba79cc3253a.png)

#XAMPPのダッシュボードを開く
ApacheとMySQLの起動が完了したら、下記のURLにアクセスをして、ダッシュボードが表示されるか確認する
http://localhost/dashboard/

##起動したxamppのバージョンを確認
![image](https://qiita-image-store.s3.amazonaws.com/0/115516/7681a531-7321-bd88-608e-a5f0670bc8ed.png)

##PHPinfo、phpMyAdminを確認
ダッシュボードの上部メニューの「PHPinfo」「phpMyAdmin」をクリックし、それぞれ表示されるか確認する

#mysqlの初期設定変更
##rootのパスワード変更
MySQLのrootのパスワードを設定する
デフォルトではrootのパスワードは設定されていない
rootのパスワードを設定しなくてもMySQLは利用できるが、設定を推奨

コマンドプロンプトを起動

１．C:\xampp_7_0_9-1\mysql\bin　に移動
```cd C:\xampp_7_0_9-1\mysql\bin```

２．MySQLにログイン
```mysql -h localhost -u root```

３．rootのパスワードを変更(パスワードは任意の文字列とする。ここでは例として「sample」)
```set password for 'root'@'localhost' = password('sample');```

４．パスワードの変更を反映
```flush privileges;```

５．一旦ログアウト
```exit;```

６．再ログイン　設定したパスワードでログインできることを確認する
```mysql -u root -p```

##MySQLの文字コードをutf8に変更
###my.iniの設定変更

C:\xampp_7_0_9-1\mysql\bin\my.ini を開く

####１．[mysqld]末尾の文字コードの設定部分を変更

「## UTF 8 Settings」で検索し、以下5行のコメントアウト(#)を外す

![image](https://qiita-image-store.s3.amazonaws.com/0/115516/e09194a2-c884-f4bf-69e7-8b827c78de4f.png)

↓

![image](https://qiita-image-store.s3.amazonaws.com/0/115516/712e6e2f-15e4-08d4-0aa7-5e68cdaadf15.png)

####２．init-connectを変更

「init-connect=\'SET NAMES utf8\'」→「init-connect=SET NAMES utf8」

![image](https://qiita-image-store.s3.amazonaws.com/0/115516/2aff1687-551a-77d3-060a-fab86cda3af1.png)

↓

![image](https://qiita-image-store.s3.amazonaws.com/0/115516/9576c802-d0a7-67d3-ac99-3cb1cf9de68d.png)


####３．保存をしたらMySQLをコントロールパネルから再起動する

###phpMyAdminにrootのパスワードを設定

rootのパスワードを変更してphpMyAdminにアクセスすると下記のエラー
![image](https://qiita-image-store.s3.amazonaws.com/0/115516/468a87ec-e319-84b9-6f09-21ffbf190a5f.png)

C:\xampp_7_0_9-1\phpMyAdmin\config.inc.php　を開く

21行目付近の
```$cfg['Servers'][$i]['password'] = '';```
の値が空欄のため、設定したMySQLのrootパスワードを記載する

![image](https://qiita-image-store.s3.amazonaws.com/0/115516/753d404d-a9a6-5667-480c-4ea82afa4fa4.png)

↓

![image](https://qiita-image-store.s3.amazonaws.com/0/115516/c36df60e-e791-111f-be1f-d35afb4fbd8d.png)

#PHPの初期設定　C:\xampp_7_0_9-1\php\php.ini　の変更

##１．時計合わせ

「[Date]」を検索。２個ヒットする。1896行目付近の方が変更対象。
```
[Date]
date.timezone=Europe/Berlin
```

![image](https://qiita-image-store.s3.amazonaws.com/0/115516/39bafb45-140a-f1e9-9d8b-03d159a3e48c.png)
↓
```
[Date]
date.timezone=Asia/Tokyo
```
![image](https://qiita-image-store.s3.amazonaws.com/0/115516/67063bc7-6273-3416-b499-431a50f37ab0.png)

##２．SSL有効化

「;extension=php_openssl.dll」
を検索。コメントアウト(;)を外す

;extension=php_openssl.dll
![image](https://qiita-image-store.s3.amazonaws.com/0/115516/999c30d4-9cca-697c-7fdd-b8ca15c2f376.png)
↓
extension=php_openssl.dll
![image](https://qiita-image-store.s3.amazonaws.com/0/115516/7ec30bbc-a668-8baf-4eb1-e2f1f709c47a.png)

##３．XDebug 追加

下記の設定は元々のソースにはないので、末尾に追加
```
[XDebug]
zend_extension="C:\xampp_7_0_9-1\php\ext\php_xdebug.dll"
xdebug.remote_enable=1
xdebug.remote_host=localhost
xdebug.remote_port=9000
xdebug.remote_handler="dbgp"
xdebug.profiler_enable=1
xdebug.profiler_output_dir="c:\xampp_7_0_9-1\tmp"
```

![image](https://qiita-image-store.s3.amazonaws.com/0/115516/4f9352ae-d6ae-2d59-48e8-42c28234d2dd.png)

##４．imap有効化（任意）

;extension=php_imap.dll
↓ アンコメント
```extension=php_imap.dll```

#コントールパネルを起動した時にApacheとMySQLも起動するようにする

「Config」ボタンをクリック
![image](https://qiita-image-store.s3.amazonaws.com/0/115516/0b46fd83-5e84-31ce-1c24-68df00432849.png)

「Apache」と「MySQL」にチェックを入れて保存する
![image](https://qiita-image-store.s3.amazonaws.com/0/115516/100abbc7-7a81-c5e9-5e1b-9c61c65d186b.png)

#PHPのソースを置くところ
C:\xampp_7_0_9-1\htdocs　がアプリケーションルートになるので、この中にPHPファイルを置く