VPSで作る、オンラインPHP開発環境（ Code-Server, Xdebug）

# はじめに

Code-Server は VSCode をサーバー上で動くように移植したものです。

https://github.com/cdr/code-server

この記事は Open LiteSpeed を使ってWebサーバーの構築が完了しているところからスタートしています。

https://qiita.com/dxa/items/b7b5a9e1f8aa12b545e7

https://qiita.com/dxa/items/01d78bda1ca5df73bab6

# Xdebug をインストール

まず必要なものを揃えます。

```bash
[root@vm opc]# dnf install lsphp80-devel lsphp80-pear
```

Xdebugを入れます。

```bash
[root@vm opc]# /usr/local/lsws/lsphp80/bin/pecl install xdebug
～（中略）～
  +----------------------------------------------------------------------+
  |                                                                      |
  |   INSTALLATION INSTRUCTIONS                                          |
  |   =========================                                          |
  |                                                                      |
  |   See https://xdebug.org/install.php#configure-php for instructions  |
  |   on how to enable Xdebug for PHP.                                   |
  |                                                                      |
  |   Documentation is available online as well:                         |
  |   - A list of all settings:  https://xdebug.org/docs-settings.php    |
  |   - A list of all functions: https://xdebug.org/docs-functions.php   |
  |   - Profiling instructions:  https://xdebug.org/docs-profiling2.php  |
  |   - Remote debugging:        https://xdebug.org/docs-debugger.php    |
  |                                                                      |
  |                                                                      |
  |   NOTE: Please disregard the message                                 |
  |       You should add "extension=xdebug.so" to php.ini                |
  |   that is emitted by the PECL installer. This does not work for      |
  |   Xdebug.                                                            |
  |                                                                      |
  +----------------------------------------------------------------------+
～（中略）～

Build process completed successfully
Installing '/usr/local/lsws/lsphp80/lib64/php/modules/xdebug.so'
install ok: channel://pecl.php.net/xdebug-3.0.4
configuration option "php_ini" is not set to php.ini location
You should add "zend_extension=/usr/local/lsws/lsphp80/lib64/php/modules/xdebug.so" to php.ini
```

# PHP側の設定

PHPの設定を編集

```bash
[root@vm opc]# vi /usr/local/lsws/lsphp80/etc/php.ini
```

最終行に追記

```vim:/usr/local/lsws/lsphp80/etc/php.ini
[xdebug]
zend_extension=/usr/local/lsws/lsphp80/lib64/php/modules/xdebug.so
xdebug.mode=debug
xdebug.start_with_request = yes
xdebug.client_host=127.0.0.1
xdebug.client_port=9003
```

再起動

```bash
[root@vm opc]# systemctl restart lsws
```

ファイアウォールを許可する

```bash
[root@vm opc]# firewall-cmd --zone=public --permanent --add-port=9003/tcp
[root@vm opc]# firewall-cmd --reload
```

# CodeServer をインストール

```bash
[root@vm opc]# curl -fsSL https://code-server.dev/install.sh | sh
```

サービス化と同時に起動させて設定ファイル（パスワード込み）を生成させる

```bash
[root@vm opc]# systemctl enable --now code-server@$USER
```

設定ファイルの中にアクセスに必要なパスワードが書かれているので控えておく

```bash
[root@vm opc]# cat /home/opc/.config/code-server/config.yaml
bind-addr: 127.0.0.1:8080
auth: password
password: 76f63ca8eef1d011f68bf306
cert: false
```

ファイアウォールを許可する

```bash
[root@vm opc]# firewall-cmd --zone=public --permanent --add-port=8080/tcp
[root@vm opc]# firewall-cmd --reload
```




# LiteSpeed の準備

ドキュメントルートを作ります。
リバースプロキシを組むためこのディレクトリは使用しませんが、LiteSpeed の仕様上これが無いと動きません。

```bash
[root@vm opc]# mkdir -m 755 -p /usr/local/lsws/virtual/ide.vso.mydomain.com/html/
[root@vm opc]# chown -R nobody:nobody /usr/local/lsws/virtual/ide.vso.mydomain.com/
```

LiteSpeed 上でリバースプロキシを設定します。

<iframe src="https://docs.google.com/presentation/d/e/2PACX-1vSLQvH4TAjUMLtcXcrtIovWTdWwiRdj0nIR8l0nLFyPe3Ec25mUbUBvcSiRk722oZNkVpYcrIxK6XZj/pubembed?start=false&loop=false&delayms=3000" frameborder="0" width="100%" height="570" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true"></iframe>

# いざデバッグ

URLへアクセスします。
例. https://ide.vso.mydomain.com

<iframe src="https://docs.google.com/presentation/d/e/2PACX-1vRwmSq42jcZus_CnUARJsSBJA_NnDJsGkxd7OBdzfubVZPPe-mGEPFaix0fnrpwOZ9dXZvcRNrqOmY-/embed?start=false&loop=false&delayms=3000" frameborder="0" width="100%" height="570" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true"></iframe>

# さいごに

この記事を書いた経緯として、PHP開発入門のサイトやコミュニティで、Xdebugが使えるところまで紹介しないところが見られたので記事にしてみました。

# 変更履歴
* 2024年5月 現在でも手順に変更がないことを確認
* 2025年6月 スライドの不具合を解消