on wordpress

VCCW + MailCatcherで送信メールを確認するための環境を構築

VCCWにかぎらずVagrant環境では、メールを送信の関連した確認作業が困難です。

また、仮にクラウド等を使って確認するにも、いちいちソースコードをアップロードするのはめんどくさいですし、ほんとにメールがでちゃうのも時には困りモノです。

そこでRuby製のツールのMailCatcherを使うととても便利なのでVCCW上でMailCatcherをセットアップしてメールの確認を行う手順を紹介します。

MailCatcherとは？

MailCatcherとはRuby製のオープンソースのSMTPサーバーで、メール系の開発に便利な以下のような特徴を兼ね備えています。

  • 簡単なコマンドで起動することが可能。
  • ウェブサーバーも同時に起動し、送信したメールをブラウザで確認することができる。
  • メールはMailCatcherから先には送信されない。
  • ウェブソケットを使用しており送信したメールはリアルタイムで表示される。（リロードが不要）
  • APIを搭載しており、たとえばユニットテストなどで送信メールの内容の確認を自動化できる。

VCCWでのセットアップ

VCCWの最新版(v2.13.0)ではMailCatcherはすでにインストール済みですが、デフォルトでは有効化されていません。

実際に使用するには、WordPressからのメールがMailCatcherに向けて送信されるように専用プラグインをインストールする必要があります。

そのためのコマンドをGitHub上にあげていますので、そちらを使用してもらえば一発で完了します。

以下のコマンドはvagrant sshでゲストマシンにログインしてから実行してください。

$ curl -L https://raw.githubusercontent.com/vccw-team/activate-mailcatcher/master/setup.sh | bash

コマンドは以下のリポジトリにありますので、もし動かなければIssueに投稿してください。

https://github.com/vccw-team/activate-mailcatcher

コマンドの実行に成功すると以下のように出力されるはずです。

Starting MailCatcher
==> smtp://127.0.0.1:1025
==> http://192.168.33.10:1080
*** MailCatcher runs as a daemon by default. Go to the web interface to quit.

上の出力内にあるhttp://ではじまるURLにブラウザでアクセスするとMailCatcherのユーザーインターフェースが表示されます。

MailCatcher用のWordPressプラグインについて

上述のセットアップ用コマンドでは、通常のプラグインとは違いwp-content/mu-plugins以下にインストールしています。

これはWordmoveを使用してデプロイする際に、あやまって本番サーバーにもこのプラグインがデプロイされてしまうことを防ぐためです。

そのかわりブラウザから無効化できないので、このへんは好みだろうなーということで、デフォルトでは有効化していません。

プラグイン本体は、以下のリポジトリにあります。

https://github.com/vccw-team/mailcatcher

Composerを使用しているため構成が一般のプラグインと違いますのでご注意ください。

Contact Form 7 で試してみる

セットアップはVCCWならコマンド一発で完了なので、さっそくContact Form 7をインストールして試してみましょう。

以下のスクリーンショットはContact Form 7がデフォルトでインストールしてくれるショートコードをそのまま使っています。

送信ボタンをクリックしてMailCatcherにアクセスしてください。

VCCWのデフォルトならURLはhttp://192.168.33.10:1080/です。

Webメール風のUIに送信したメールが表示されてることを確認して下さい。

APIを使って送信メールの確認を自動化する

MailCatcherにはAPIもありますので、以下のようなコードで送信メールの内容のチェックを自動化することもできます。

  /**
   * @test
   */
  public function wp_mail()
  {
    wp_mail( "test@example.com", "This is subject", "This is body" );

    $message = $this->get_last_mail();

    $this->assertSame( "<test@example.com>", $message->recipients[0] );
    $this->assertSame( "This is subject", $message->subject );
    $this->assertTrue( !! strpos( $message->source, "This is body" ) );
  }

上のコードは、wp_mail()関数で送信したメールの内容をMailCatcherから取得して、送信先メールアドレスや件名、本文などが期待通りかチェックをしています。

get_last_mail()というメソッドがMailCatcherのAPIからメールを取得するためのメソッドですが、他にもいろいろと工夫が必要なので、詳細は後日ブログに書きます。