Vagrant + Virtualbox + Docker + Laradoc + Laravel + VSCode + XDebug の 環境を設定したメモ。

## 概要
「[docker+laravel+VSCode+Xdebugという開発環境を作る](https://qiita.com/kefian1go/items/bbc8f9d51fe890194ad7)」を参考に laradock で作った環境にPHP Debugでアクセスしたかったが、案外ハマった。`xdebug.remote_host=10.0.2.2 `と設定しなければならないところを適当な値にしてしまっていたのが原因。`host.docker.internal`はwindows用であった（[*注](https://qiita.com/a4_nghm/items/b5b339dce43824e07531)）

## 環境

* Windows 10 Home
* Vagrant 2.2.5
* virtualbox 6.0.12
* Ubuntu 18.04 LTS (Bionic Beaver)
* Docker version 19.03.2, build 6a30dfc
* docker-compose version 1.24.1, build 4667896b
* VSCode 38.1
* Laradoc 
* Laravel 6.0

## ディレクトリ構成

[※参考github](https://github.com/hibohiboo/develop/tree/0c4f2b7964cdaf04576642331dc09b780a979d5d/tutorial/lesson/php/laravel)


```yml
- .vscode
  - extensions.json
  - launch.json
  - settings.json
- laravel_docker
  - laradock #githubからcloneしたもの
    - .env
    - php-fpm
      - xdebug.ini
    - workspace
      - xdebug.ini
  - sampleapp # プロジェクトのディレクトリ
    - app
      - Http
        - Middleware
          - EncryptCookies.php
      - public
        - index.php # ブレークポイントを試しにしかける場所
```

## ソース修正

### XDebug のインストール

```diff:laravel_docker/laradock/.env
... 

WORKSPACE_INSTALL_WORKSPACE_SSH=false
WORKSPACE_INSTALL_SUBVERSION=false
- WORKSPACE_INSTALL_XDEBUG=false
+ WORKSPACE_INSTALL_XDEBUG=true
WORKSPACE_INSTALL_PHPDBG=false
WORKSPACE_INSTALL_SSH2=false
...
PHP_FPM_INSTALL_MEMCACHED=false
- PHP_FPM_INSTALL_XDEBUG=false
+ PHP_FPM_INSTALL_XDEBUG=true
PHP_FPM_INSTALL_XHPROF=false
...
```

workspaceとphp-fpmのxdebugの設定は同一とする。
`remote_host`は`10.0.2.2`となる。

ゲスト OS 側からホスト OS を認識したい場合は 10.0.2.2 でアクセス可能。（VirtualBox ではホスト OS のネットワークアダプタに NAT を利用して、IP アドレス 10.0.2.2 を割り当てるのがデフォルトの設定。[*注](https://gist.github.com/yano3nora/86f5a77dd139803ee321210ce5cfc6e0))

```diff:laravel_docker/laradock/php-fpm/xdebug.ini
-; xdebug.remote_host=dockerhost
-xdebug.remote_connect_back=1
-xdebug.remote_port=9000
-xdebug.idekey=PHPSTORM
+xdebug.remote_host=10.0.2.2 
+xdebug.remote_connect_back=0
+xdebug.remote_port=9001
+xdebug.idekey=Listen for XDebug

-xdebug.remote_autostart=0
-xdebug.remote_enable=0
-xdebug.cli_color=0
+xdebug.remote_autostart=1
+xdebug.remote_enable=1
+xdebug.cli_color=1
 xdebug.profiler_enable=0
 xdebug.profiler_output_dir="~/xdebug/phpstorm/tmp/profiling"
```

```diff:laravel_docker/laradock/workspace/xdebug.ini
-; xdebug.remote_host=dockerhost
-xdebug.remote_connect_back=1
-xdebug.remote_port=9000
-xdebug.idekey=PHPSTORM
+xdebug.remote_host=10.0.2.2 
+xdebug.remote_connect_back=0
+xdebug.remote_port=9001
+xdebug.idekey=Listen for XDebug

-xdebug.remote_autostart=0
-xdebug.remote_enable=0
-xdebug.cli_color=0
+xdebug.remote_autostart=1
+xdebug.remote_enable=1
+xdebug.cli_color=1
 xdebug.profiler_enable=0
 xdebug.profiler_output_dir="~/xdebug/phpstorm/tmp/profiling"
```

設定したら、コンテナを作り直す。

```bash:bin/container_build.sh
#!/bin/bash

bin_dir=$(cd $(dirname $0) && pwd)
parent_dir=$(cd $bin_dir/.. && pwd)
docker_dir=$(cd $parent_dir/laravel_docker/laradock && pwd)
cd $docker_dir
docker-compose build php-fpm workspace
```


### VSCode側の設定

```json:.vscode/launch.json
{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Listen for XDebug",
      "type": "php",
      "request": "launch",
      "port": 9001,
      "pathMappings": {
        "/var/www": "${workspaceFolder}/laravel_docker/sampleapp"
      },
      "log": true
    }
  ]
}
```

```json:.vscode/extensions.json
{
  "recommendations": [
    "felixfbecker.php-debug"
  ],
  "unwantedRecommendations": []
}
```

### 例外でデバッグが見にくくならないように設定。

adminerなど、同梱されているツールでcookieを使うことがあるが、Laravelの暗号化機能がそれを認識すると暗号化不可の例外だらけになってしまう。除外しておく。

```php:laravel_docker\sampleapp\app\Http\Middleware\EncryptCookies.php
<?php
namespace App\Http\Middleware;
use Illuminate\Cookie\Middleware\EncryptCookies as Middleware;

class EncryptCookies extends Middleware
{
    protected $except = [
        'XDEBUG_SESSION', 'adminer_version', 'adminer_sid', 'adminer_key', 'adminer_permanent', '_ga'
    ];
}

```


### 動作確認

ソースの行番号の左側を押して、ブレークポイントを設定する。
虫のアイコンからデバッグ画面にして、「Listen for XDebug」を選んで |> ボタンを押して実行。
ブラウザからララベルのページにアクセスしてブレークポイントで止まることを確認する。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/99876/f9c89f3f-783e-2c54-5ea8-90aed4becc6e.png)

[この時点のソース](https://github.com/hibohiboo/develop/tree/0c4f2b7964cdaf04576642331dc09b780a979d5d/tutorial/lesson/php/laravel)



## 参考

[Laravel Webアプリケーション開発 参考ソース](https://github.com/laravel-socym)
[VSCode で xdebug を利用する on ローカル開発 with Laravel プロジェクト](https://qiita.com/darum/items/d539e916fa6873fe2061)
[docker+laravel+VSCode+Xdebug という開発環境を作る](https://qiita.com/kefian1go/items/bbc8f9d51fe890194ad7)
[homebrew で PHP+XDebug+VSCode の開発環境構築をやり直す](https://qiita.com/kiwi26/items/7e94fb042c5ae819d2d8)
[PhpStorm で Xdebug を使えるようにしよう！](https://qiita.com/taniai-lvgs/items/8e9eba112d2d0ed2530f)
[docker+laravel+VSCode+Xdebugという開発環境を作る](https://qiita.com/kefian1go/items/bbc8f9d51fe890194ad7)
[Vagrant + VirtualBox note. ](https://gist.github.com/yano3nora/86f5a77dd139803ee321210ce5cfc6e0)
[Docker v18.03以降でコンテナからホストに接続したい(Docker for Windows)](https://qiita.com/a4_nghm/items/b5b339dce43824e07531)