Laradockを使ってCakePHP3+Xdebug+VS Codeの開発環境を構築する。

CakePHP3で作りたいものがあったので、CakePHP3の開発環境を簡単にDockerを使って構築しようと思い立った。最初は自分でdocker-compose.ymlを作成してコンテナを起動してみたけど、どうしてもXdebugでデバッグができなかった。

たまたまLaradockという本来はLaravelフレームワーク用のDockerコンテナキットを見つけた。最後にcomposerでLaravelの代わりにCakePHPをインストールできるらしいからLaradockを使ってみた。LAMP関連(今回はAではなくnginxだけど)のコンテナが全部入りだから(MySQLだけではなくて、PostgreSQLやSQL Serverもある)、自分でdocker-compose.ymlを書くよりはいいだろうと思った。

参考までにこれから構築していく自分の環境は以下の通りである。ここにLaradockを使ってCakePHP3+Xdebug+VS Codeの開発環境を構築する。。

Windows 10 Pro 64 bit
Docker version 17.12.0-ce, build c97c6d6
docker-compose version 1.18.0, build 8dd22a96

以下はいろいろと参考にしたサイトからつまみ食いしなから設定を行った部分を抜き出してまとめていく。

Laradockの設定は、こちらのサイトを途中まで参考にした。

PHPフレームワーク「Laradock」で、手軽にLaravel+Dockerな開発環境を構築する

gitのcloneでLaradockをインストールしている。次にLaradockでCakePHP3に関する設定を行うには、こちらのサイトを参考にした。

LaradockでPHPフレームワーク(Laravel・CakePHP)とCMS(WordPress・Drupal・baserCMS)の開発環境(nginx・php-fpm・mysql)を構築する

.envをコピーして設定して、これでインストール完了ですと言えないのは、コピー&ペーストインストールのいつものこと。このままではphpMyAdminからMySQLコンテナに接続できないとか、細かい問題があった。そしてXdebugでPHPのデバッグをやりたかったので、いろいろ設定を追加していく。

まずは、上記の2つのサイトを参考にしてLaradockをインストールする。自分のところでは、今までの作業でディレクトリはこのようになっている。

 /laradock-test
 ├── laradock
 └── src

.envの設定だが、設定の一番のポイントはポート番号を重ならないこと。既にローカルでPHP+Xdebugが動いていたようなので、ポート番号の指定で嵌まった。使っていないポート番号を設定しておく。以下に今回設定した.envのnginx, MySQL, phpMyAdminの設定を上げておく。

 ### NGINX
 NGINX_HOST_HTTP_PORT=8082
 NGINX_HOST_HTTPS_PORT=443
 NGINX_HOST_LOG_PATH=./logs/nginx/
 NGINX_SITES_PATH=./nginx/sites/
 NGINX_PHP_UPSTREAM_CONTAINER=php-fpm
 NGINX_PHP_UPSTREAM_PORT=9000

## MYSQL
 MYSQL_VERSION=5.7
 MYSQL_DATABASE=default
 MYSQL_USER=default
 MYSQL_PASSWORD=secret
 MYSQL_PORT=3333
 MYSQL_ROOT_PASSWORD=root
 MYSQL_ENTRYPOINT_INITDB=./mysql/docker-entrypoint-initdb.d

### PHP MY ADMIN
 # Accepted values: mariadb - mysql
 PMA_DB_ENGINE=mysql
 # Credentials/Port:
 PMA_USER=default
 PMA_PASSWORD=secret
 PMA_ROOT_PASSWORD=secret
 PMA_PORT=8083

使っていない別のポート番号に設定し直しておく。MYSQL_VERSIONは元の設定の8.0だと認証で失敗してしまったので、8.0ではく5.7に設定したら認証ができた。こちらは何か別のよい方法があるかもしれない。

WORKSPACEとPHP_FPM の設定は以下の通り。修正した箇所だけを上げておく。

 ### WORKSPACE
 WORKSPACE_INSTALL_XDEBUG=true

 ### PHP_FPM
 PHP_FPM_INSTALL_XDEBUG=true
 PHP_FPM_INSTALL_INTL=true

Xdebugを使うのでWORKSPACE_INSTALL_XDEBUGとPHP_FPM_INSTALL_XDEBUGをtrueにして(PHP_FPM_INSTALL_XDEBUGだけでもいいかも?)、PHP_FPM_INSTALL_INTLはCakePHP3で必要なのでtrueにしておく。

.envの設定の最後として、CakePHP3のインストール先のディレクトリも設定しておく。

# Point to your code, will be available at `/var/www`.
APPLICATION=../src/

nginxのドキュメントルートを修正する。設定するファイルは以下のファイルである。

.\laradock\nginx\sites\default.conf

こちらのrootの設定を、CakePHP3のリモート側のドキュメントルートのディレクトリに設定する。今回のプロジェクト名をmycakephpとしておく。

root /var/www/mycakephp/webroot;
ここで一度Docker composeを実行してコンテナを起動しておく。
docker-compose up -d nginx mysql phpmyadmin

workspaceコンテナにログインして、composerを使ってCakePHP3をインストールしておく。こちらは参考サイトの通り。

LaradockでCakePHPの開発環境(nginx・php-fpm・mysql)を構築する

ここではサイトに書いてある通り、以下のコマンドでプロジェクトmycakephpでCakePHP3をインストールした。

 $ composer self-update && composer create-project --prefer-dist cakephp/app mycakephp

nginxからCakePHP3のサイトを参照できるかチェックする。OKならCakePHP3の初期画面が見えるはず。

データベースの接続の設定を.\src\mycakephp\config\app.phpにしておく。

'Datasources' => [

    'default' => [
       :
    'host' => 'mysql',
       :
    'username' => 'default',
    'password' => 'secret',
    'database' => 'default',
       :

このような感じで.envのMySQLの設定に合わせておけば、データベースに接続が成功はずである。

phpMyAdminも確認しておく。こちらも.envのMySQLの設定通りにすればログインできてMySQLの中を参照できるはずである。もちろん、MySQLのパスワードは適当なものに変えること。

サーバ:mysql
ユーザ名: root
パスワード: root

MySQL Workbenchからも接続を確認できた。以下の接続情報でWindowsローカルで接続できた。

Hostname:localhost
Port: 3333
Username: root
password: root

最後にXdebugの設定である。Xdebugのコンテナ側の設定ファイルは次の2つである。同じ内容でコピーすれば大丈夫だった。

.\laradock\php-fpm\xdebug.ini
.\laradock\workspace\xdebug.ini

自分が設定した内容は以下の通りである。とりあえずプロフィラの設定も含めて設定しておく。

 xdebug.remote_host=172.27.7.81
 xdebug.remote_port=9002
 xdebug.idekey=Listen for XDebug

 xdebug.remote_autostart=1
 xdebug.remote_enable=1
 xdebug.remote_connect_back=0
 xdebug.cli_color=1
 xdebug.profiler_enable=1
 xdebug.profiler_output_dir="/var/www/mycakephp/tmp"

 xdebug.remote_handler=dbgp
 xdebug.remote_mode=req

 xdebug.var_display_max_children=-1
 xdebug.var_display_max_data=-1
 xdebug.var_display_max_depth=-1

ここでわからなかったのはxdebug.remote_hostの値だった。結論としてはこちらはWindowsの場合、

ipconfig

で表示されるDocker側の仮想スイッチのアドレスの値を設定しておく。Googleさんに「xdebug リモートデバッグ」で検索して、よく出てくるサイトに書かれている$_SERVER[‘HTTP_X_REAL_IP’]とか$_SERVER[‘REMOTE_ADDR’]の値ではないので注意すること。

docker-compose stop
docker-compose build php-fpm workspace

でphp-fpmとworkspaceのイメージをビルドしなおす。ビルドできたら、

docker-compose up -d nginx mysql phpmyadmin

をDocker Composeを再度実行する。nginxのドキュメントルートにphpinfo()を書いたファイルを置いてアクセスしてみて、正しくxdebugが設定されているかを確認しておく。

クライアント側の開発環境はマイクロソフトのVisual Studio Code(VS Code)を使っている。あらかじめVS Codeの拡張機能であるPHP Debugをインストールしておく。次にVS Codeのデバッグの構成ファイル(launch.json)を修正する。launch.jsonは以下のように設定した。

{
  "version": "0.2.0",
  "configurations": [

   {
    "name": "Listen for XDebug",
    "type": "php",
    "request": "launch",
    "port": 9002,
    "pathMappings": {
      "/var/www":"${workspaceRoot}/src"
     },
    "ignore": [
      "**/vendor/**/*.php"
    ]
   },
   {
    "name": "Launch currently open script",
    "type": "php",
    "request": "launch",
    "program": "${file}",
    "cwd": "${fileDirname}",
    "port": 9002
   }
  ]
 }

portは、xdebug.iniのxdebug.remote_portと同じ値にする。以下のように設定するように言っているサイトもあるが、

      "serverSourceRoot": "/var/www",
      "localSourceRoot": "${workspaceRoot}/src"

serverSourceRoot、localSourceRootとも今後推奨されない設定のようなので、pathMappingsにしておく。pathMappingsの設定は、

"pathMappings": {
    "リモートディレクトリ":"ローカルディレクトリ" 
    },

のようにリモートとローカルのパスをマッピングする設定である。ドキュメントをよく読まずにリモートとローカルを反対にしてしまったので動かなくて悩んだ。こちらはnginxのドキュメントルートのディレクトリではないことに注意する。ドキュメントルートディレクトリ外のファイル(例えば、.\src\mycakephp\src\Controller\AppController.php)をデバックしようとしたときに、pathMappingsにルートディレクトリに設定してしまうとソースファイルが見つからないと言ってくる。そこでソースファイルを格納しているディレクトリを設定しておく。

ignoreの設定をしておかないと、以下のような例外が途中で発生する。どうしてかは不明である。

例外が発生しました

Aura\Intl\Exception: Package 'default' with locale 'ja-JP' is not registered.

.\src\mycakephp\webroot\index.php とかに適当にブレークポイントを設定して、Listen for XDebug”の構成でデバッグを行う。ブレークポイントを設定したところで止まるかとチェックする。後はステップオーバーでプログラムが進むか、ステップインで別のソースを参照できるか、または変数の中身を参照できるかをチェックして完了。

以上でLaradock+CakePHP3+XdebugでVS Codeを使って快適にデバッグができるようになった。以上、再度開発環境を構築する際に忘れないようにメモを残しておく。

追記

同じ設定をMacでやってみたら、niginxコンテナが起動できなかった。原因不明・・

.\laradock\nginx\sites\default.conf にゴミが入っていたのが原因だった。dockerのログを見たら原因がわかった。

無事にMacでCakePHP3のトップページを参照できた。ただしデバッグできない。

Macでもデバッグができるようなった。ただし、xdebug.ini に

xdebug.remote_host=docker.for.mac.localhost

を設定すればOKのようだ。情報はこちらのサイトから。

PHP on Laradock w/ Visual Studio Code(VS Code)でデバッグ環境 (特にon Mac)

ただし、MacでDockerはとても遅い。ブラウザが表示し終わるのに時間がかかる。こちらは問題になっているようで、将来改善されるのかな?

追記2

VS CodeのターミナルからDocker Composeすると、IO Errorが出る。普通にPower Shellで実行するとうまく行く。これは、issuesに上がっているから周知の問題なのかな?

追記3

MySQLのコンテナが起動できなかったので、解決策はこちらから

LaradockでMySQLがどうしても立ち上がらない人あつまれー!

CakeEmailでメール本文が文字化けする

とっても悩んで解決したのでメモを残しておく。

CakePHPのCakeEmailを初めて使ってみたら、送信したメールの本文が文字化けする。今までQdmailを使っていたので、そんな現象には合わなかった。

Googleさんに聞いてみると

CakeEmailを使っていて本文が文字化けたらとりあえずcharsetを疑ってみる

なんて書いてあるけど、charsetにISO-2022-JPを設定しても現象は変わらない。今度はメールヘッダがも文字化けする。

しかたないので、CakeEmailをNetBeansのデバッガで追ってみる。CakeEmailの_encodeString()メソッド辺りに見当をつけてブレークポイントを設定する。デバッグしてみると何とmb_convert_encoding()を処理する前にreturnしていた。

原因はmb_convert_encoding()関数が存在しないことだった。つまり、mbstringモジュールをインストールしていないことが、そもそもの原因である。

php.iniにmbstringモジュールを読み込んであげて、mbstringモジュールの設定を適当にしてphpinfo()でmbstringがサポートされていることを確認する。

今度は文字化けせずにメールを送れた。

WindowsのローカルPCに開発環境にPHPをインストールしたままで動かしたのが原因かもしれない。

#baserCMS で管理者ページにログインできないときの対応メモ

今のお客さんのIRサイトをリニューアルをしたいという案件で、以前テストで作成したbaserCMSのテストサイトを復活させます。テストサイトはvagrant+VirtualBoxでローカルのPCに作成しています。

久しぶりにvagrant upでサーバーを起動してきます。Vagrantで起動したらberkshelfでのmysqlのChefのクックブックの仕様が変わって動かないというトラブルがありましたが、これは自分でレシピを作って対応します。後はMySQLのバックアップを投入すれば、今まで作成したサイトにはアクセスできます。しかし、baserCMSの管理者ページにはログインできません。

ここでNetBeansのデバッガを使ってログインの処理を追っていきます。ログインが成功した後のリダイレクトの処理以降がうまくいっていないようです。管理者ページのトップにリダイレクトしようとして、どういう訳か遷移しません。

調べてみるとCakePHPのエラーログを見ろとあります。ログには

2015-08-18 11:16:43 Warning: Warning (2): Unknown: Failed to write session data
(files). Please verify that the current setting of session.save_path is correct
(/vagrant/app/tmp/sessions) in [Unknown, line 0]

なんて書かれています。セッションデータをうまく書き込まれていないようです。

Googleさんにセッションデータがなぜ書き込めないかを聞いてみると、Vagrantの同期フォルダの権限の設定が間違っているとのこと。こちらのページのsynced_folderの設定を行うとうまく行きました。オーナーとグループをapacheにすればよさそうです。

baserCMSのGitHubにVagarantFileのサンプルがありますが、こちらのsynced_folderの設定のままだと、私のところではうまくセッションの書き込みができませんでした。今までうまくいっていましたがどうしてなのだろうか?

以上、2日位悩んだ結果のメモです。まずはCakePHPで何かあったらログを読めということでしょうか。いつも基本を忘れます。

CakePHPのDebugKitプラグインでのエラー

CakePHPを2.6.3にバージョンアップしたら、コントローラーでセットした値がビューに渡っていない。色々調べてみるとDebugKitプラグインでエラーをしている。

Could not load class DebugKitLogListenerLog

このエラーメッセージから調べると、GitHubのDebugKitのissusが見つかった。

https://github.com/cakephp/debug_kit/issues/144

APP/Plugin/DebugKit/Lib/Panel/LogPanel.phpの25行目を

'engine' => 'DebugKit.DebugKitLogListener',

'engine' => 'DebugKit.DebugKitLog',

にする。これでエラーがなくなった。

MySQL Workbenchのマイグレーションで文字化け

SQLServerのデータベースをMySQLに変換しようと、MySQL Workbenchのマイグレーションの機能を使ってみた。スルスルとテーブル構造やデータを変換できた。これはすごい。

と思っていたら、日本語で格納した項目はすべて???で文字化け。ダメじゃん、と思って、いろいろ調べてみた。MySQL Workbenchに文字コードを設定できる設定はないし、さてどうしたものか。

どうせ最後にはMongoDBのコレクションに変換する予定なので、CakePHPのシェルで変換プログラムを書いている。そのプログラムからSQLServerを直接見に行けばいいじゃない、と思ってFreeTDSだのODBCだのCentOSにインストールしてやってみると接続はできた。しかし、Linux, Mac OS X, FreeBSDからはSQLServerは接続できないとCakePHPのドキュメントには書いてある。実際に/Config/databese.phpにSQLServerをデータソースとして設定しても接続できなかった。CakePHPのソースを負っていくとPDOのライブラリが見つからない云々というエラーとなる。

それでも、しつこく調べてみると、無理矢理CakePHPのSQLServerのデータソースを書き換えてSQLServerに接続する方法があって試してみたけど接続できるが文字化けという同じ結果だった。しかし、pearのDB.phpだと文字化けせずにうまく接続できる。でも、今さらDB.phpなんて使うなんてね・・・。

と、諦めているときに、とても当たり前のことに気が付いた。とても恥ずかしいこと・・・。

何とMySQLで文字コードの設定を何もしていなかった。ここのサイトに書いているように/etc/my.iniに

[mysqld]

character-set-server=utf8

[mysql]
default-character-set=utf8

[mysqldump]
default-character-set=utf8

を設定しみる。今度は、MySQL Workbenchのマイグレーションで文字化けせずに、うまくSQLServerからMySQLに変換できた。

やれやれ、大変な回り道をしてしまった。もっと早く気付けよ > 自分。

#CakePHP 3を試してみました。

環境を作ってインストールできたので、CakePHP 3を試してみました。試したみたと言ったけど、簡単にいつものブログのデータベースを作って、ControllerとModelをBakeして、使用している値をダンプしてみる。あとは、CakePHP3のドキュメントを読んでみる。

つまるところ、大幅に変わったMVCのModelの部分が肝かな。ModelがTable ObjectEntitiesになって、ORMがどう関わってくるというところが大事か。それとコントローラーとTable ObjectEntities、ビューがどう関しているかをもっと理解しなくてはいけない。

CakePHP3のドキュメントTable ObjectEntitiesを訳しながら読み進めていたけど、これはおもしろぞ。

Berkshelf のWindowsへのより簡単なインストール方法。

以前、Berkshelf のインストールが面倒、と書きましたが、もっと簡単なイントール方法が紹介されていました。紹介されていたのは、「CakePHPで学ぶ継続的インテグレーション」という本です。ここで、ChefDK(Chef Development Kit)を利用する方法が書かれています。

ChefDKを使えば、Rubyやgemをインストールことなく、ChefやBerkshelfなどのChefに関連するツールをまとめてWindows上にインストールできます。面倒なRuby関連のツールをChefDKでWindowsに簡単にでききます。これでChefを使いたいだけなのに、Ruby関連のインストールと格闘しなければいけない、なんてことがなくなります。

CakeFest2014報告会の参加 #CakePHP  

CakeFest2014報告会の参加 #CakePHP  

たまたまFacebookに前日に見つけて、速攻で参加申し込み。本日行ってきました。

コワーキングスペースに行ったのは初めて、こういった勉強会に行ったのも初めて。今回は、日本で活動しているしているCakePHPのコアなメンバーが揃ったなのかな。

この勉強会の懇親会で「CakePHPで学ぶ継続的インテグレーション 」の著者とお話して、帰りの地下鉄の中から、これまた速攻でアマゾンに注文してしまいましたよ。本日発売だそうだ。CakePHPのテストに関しては、いろいろなところから情報をGetしなければいけなかったので、これでまとめてスキルアップできるといいな。

とりあえず、ここで本を注文しましたよ、と報告。

CakeFest 2014 報告会 for CakePHP JAPAN
2014-09-19(金)19:30 – 21:30 CakeFest 2014 の報告会です。

CakeFest 報告会 for CakePHP JAPAN

CakeFest2014の報告会イベントをCo-Edoにて9/19に行ないます。
できれば多くの参加者の方に来ていただき、来年10周年となるCakePHPの盛り上がりと、CakeFest2015に日本から参加するきっかけにもなれば良いなと思っています。

内容

以下を予定しています。

@sizuhikoさんによる報告
@yandoさんによる報告
CakeBeer

CakePHPと言えばビール!
時間があればLTタ…

#baserCMS のPDFリンクプラグイン作成

baserCMS公式サイト10年以上お付き合いしている会社の株主向けのサイトを運営しているのですが、そろそろリニューアルしましょうということになりました。今まではベタにPHPを使って書いていましたので、キチンとPHPのフレームワークを使って作成することにします。PHPのフレームワークといっても、CakePHPしか知らないので、CakePHPで作成してきます。

CakePHPの上で作っていくのもいいのですが、今回はCakePHPの上で動いているbaserCMSというコンテンツ管理システムの上で作成して行きます。会社のサイトですので、Wordpressのように時系列で記事を並べていくのではなく、固定ページ中心ですので、WordpressではなくbaserCMSが丁度いいのです。

しかし、会社サイトといっても、株主向けのサイトでもありますので、PDFファイルのIR情報やニュースリリースを掲載しなければいけません。しかも、IR情報というのは面倒なもので、証券取引所からのお達しで発表時間よりも、PDFファイルを前に見せることは厳禁です。IR情報を見て株の売買をするのですから、発表前の情報を手に入れられてしまうことは御法度です。

そこで、PDFファイルを時間によって記事リストを生成できるようなことを実現します。時間での表示管理はbaserCMSにデフォルトでインストールされているブログプラグインに、日付でアクセス制限をする機能がありますので、こちらを利用することにします。

今回はブログブラグインにPDFファイルを登録できるようにしました。ブログプラグインのpostテーブルにPDFファイル名の項目を追加して、プラグインを直接改造する訳にはいかないので、PDFリンクプラグインを別途開発して、postテーブルに1対1でPDF情報を格納するテーブルを用意しました。これでbaserCMSがアップデートした場合にも対応できます。

ブログプラグインの管理ページでPDFファイルを指定してファイルをアップできる機能を、PDFリンクプラグインとして追加しています。同じような機能を持ったプラグインを探しても見つからなかったので自分で作ることにしました。もしも、存在したならば、今回はbaserCMSのプラグインの開発のスキルを習得できたということでよしとしましょう。

作成したbaserCMSのPDFリンクプラグインをGitHubに置いておきます。

https://github.com/muneando/basercms-plugin-pdf

ご自由にお使いください。バグを見つけたり機能アップしたら、GitHubから連絡ください。ただし、今回のサイトを作成するにあたっての必要最上限の機能しか実現していませんので、機能アップをしていただければ、大変うれしいです。

ページ内で表示するPDFファイルへのリンクは、PDFリンクプラグインのヘルパーで実現しています。ブログの本文とPDFファイルをどちらを優先してリンク先で表示できるかを、PDFリンクプラグインの管理ページで指定できます。前述の通りPDFファイルへの直リンクはダメですので、ユーザーがアクセスできないところにPDFファイルを置いて、PDFファイルをダウンロードする前に、時間をチェックできるようにしています。

使い方の説明は、GitHub の README.md をご覧ください。

このプラグインの作成で参考したのは、materializing 氏の Keyword プラグインです。参考というよりも、baserCMSのプラグインのイベント辺りは丸写しです。おかげでCakePHPのイベントについて理解できました。materializing 氏には、baserCMSのプラグインについて相談に乗っていただき感謝です。

実際に動いているサイトは、まだテスト段階なので公開していません。PDFリンクプラグイン以外にも、IRカレンダーを表示するためのbaserCMSブラグインも作成してしましました。もし、お客さんにOKいただいたら、baserCMSの利用例としてご覧いただけるようにします。

#baserCMS のテーマ配置場所がドキュメントルートの下だった

CakePHPでサイトを作成していると、静的ページの編集追加も自分で作らないといけないし、お客さんでも編集可能にしたり、その他諸々便利そうだからということbaserCMSをプラットフォームにしてみたらどうなるかとインストールしてみた。

しかしながらbaserCMSのテーマ配置場所がドキュメントルートの下にあるということはちょっと驚いた。ビューの下ではないのね。CakePHPのテーマの機能は使っていないのかな。

もしかしたら、.htaccessにゴチョゴチョ設定されているから直接ファイルにアクセスできないようにしているとか思ったらそうではなかった。もしかしたらブログでアップロードされたファイルもwebrootのfilesの下に入ってしまうのかな。

何かbaserCMSのドキュメントに書かれていないようなテーマの配置場所を変更する設定方法があるのだろうか?